Don’t worry about the anchors no more, they won’t be in the next release. Anchors are just a some kind of way of templating in lovelace. However I have split my lovelace config into multiple files now and anchors need to be in every page where they are used (so it would require me to duplicate the code on multiple pages). I will be using a decluttering card in the next release. Saves a bunch of lines in code is cleaner and way more dynamic. I hope to have it done before the end of the week.
In the meantime I would not recommend using anchors unless you use a single file for your lovelace config and if you do not plan to use the more dynamic decluttering card in the future. I however highly recommend you to do so as that card is great. What this basically means is that with the decluttering card I will basically use a single button template for all of my buttons in my setup, I am still figuring out a few things with this card so it might take some time.
I have been on vacation/holiday, sorry for the delay
@jimz011 I see you are dutch. Have you post youre config on forum of Tweakers? I think a lot of people theire are also interested in youre configuaration.
1 question Though:
How did you create those buttons ‘‘round’’ with the button card ?
Yes I am Dutch and I have posted my setup on tweakers several times, though tweakers is not the right medium to post setups as there is no way to format code, so my setup is linked on tweakers.
You need to use border-radius for rounded corners in the styles. You can do this with card-modder or card-mod as well as within the button card.
Actually a few people on the button-card thread told me about this. Apparently it is a feature within yaml. Though it doesn’t really work that well for me anymore since I have split my lovelace config in multiple files. Though it is a great way to make templates. But there is not really any documentation for it as far as I know. The decluttering card however has a clear documentation and I know it is a custom card, but hey most useful cards are custom cards no?
Hi all, I wanted to give you guys a heads up. I will push out the long overdue update to my setup tonight.
Warning! The update will break most of the current setup as I have removed 3 custom cards. It will however work exactly as before but just with less clutter and less custom tools.
I have managed to shave off another 2000 lines of code and still manage to get extra features added compared to the previous version.
It is ofcourse compatible with the newest version of HA. Expect the update around 01.00 AM CEST.
Hi everyone I am very pleased to announce the new release for this setup. It took a while and I am terribly sorry for that but here you go, a very big update to an endless project. Enjoy!
Changes (29/06/2019):
BREAKING CHANGES THROUGHOUT THE ENTIRE SETUP!!! If you have previously used my setup I have to warn you that the configuration for this setup is entirely different. Yes the result looks pretty much the same, but the current config is easier to manage and most important, it is almost 2000 lines of code less than before even with the added features! Unfortunately on the outside the setup looks a lot like the previous one, that is because I am pretty happy with the current design. This release is mostly based upon optimization, speed and attention to detail and future-proofing as everything is updated with current mods/cards/etc.
Summary:
The entire interface is now dynamic, sizing happens based on the screen size, no longer are buttons a fixed dimension. This fixes spacing problems on larger screen phones like for example an iPhone Plus/Max, but also tablets benefit from this. And the beauty is that all buttons stay the same aspect ratio regardless of device. So say goodbye to weird rectangle looking buttons when viewed on larger screens and you can now enjoy square buttons at all times.
Removed the following custom-cards: state-switch, useful-markdown-card, card-modder
Added card-mod, markdown-mod and vacuum-cleaner-card
Split lovelace setup into several files for easier management and a less cluttered setup, ui-lovelace.yaml will only reference to the new files, you will not need to edit this file afterwards in a long time. You will need to save this file (regardless if there were any changes) if you make changes in other files. That way it will reload lovelace, else it will keep the old config loaded until refreshed. It might be harder to catch errors because it will even load if you delete all the files within the lovelace folder until you refresh it! so be cautious when working with this. Yes it takes a step extra, but it is worth the effort as editing views, popup-cards or anything else is so easy now and best of all very easy to find. Find the new files in the lovelace folder!
Removed anchors, this was necessary to split the lovelace file as anchors need to be at the root of every yaml file (at least that is what I understood of it)
Added decluttering-card as a replacement to anchors and boy you are going to love this! Why? Well ALL the buttons in the entire setup are based of two templates. Check the code as to what I mean exactly because this one is huge!
Added birthday sensor, it is a python_script which will create a sensor for you, notifications for the frontpage will arrive in the future. You can find the script in the python_scripts folder. You will need to create an automation, an example can be found at the bottom of my automations.yaml file
Added vacuum-card as I have a Roborock S55 integrated in my setup now. This will get improved in the future as I am not happy with the current way it works. Nevertheless it is very much usable.
Cleaned up a lot and I seriously mean a lot of code, no more weird stacks in stacks in stacks which served no purpose. All of the previous card-modder and useful-markdown-cards have been rewritten to be used with the core versions of this. Thomas Loven made a mod which does the same thing as the old ones but instead of it being a custom card it is a mod to the core card. In other words all of my current setup use this kind of code now.
Unified all spacings between screens, whereas before on pages with 4 buttons the borders on the left and right. This is more in line with the Apple Homekit interface and this also means that the borders on each page are the same for every view, popup, card etc. And because the cards used are dynamic now you won’t even notice a difference (though it is a tad bit smaller on iPhone X(s) devices.
Removed state-switch card in favor of core conditional cards. Lightens up the setup and functions exactly the same way. Though if you use user based cards (e.g. you have a different homescreen than your spouse based on user logged in) I would not recommend you to remove this as this I do not know how to achieve the same thing with conditional cards. However I do not use user based cards so in my setup conditional cards will do exactly what the state-switch did in my previous configuration.
Reworked other view with a revamped menu, color to the page will be added in the near future.
Some small fixes, optimisations and a lot of attention to detail
!Important Note!
Apple has released the first beta’s of tvOS 13, the Apple component in Home Assistant will NO LONGER WORK with tvOS 13. This also means, no more state updates, no remote control, no dimming lights when started playing, no more automations possible whatsoever with the Apple TV. If you rely on this DON’T EVER UPDATE TO tvOS 13. Apple has removed a few services from the ATV which involves Home Sharing and was necessary for the pyatv component to work. They will most likely never create an alternative to this and thus you are warned. If you want to downgrade your Apple TV you can still do this until Apple stops signing that firmware so if you haven’t downgraded before halfway september know that you will probably be stuck with a broken remote control in HA or broken automations that were based on the ATV’s states.
@dougbaptista Here is the decluttering example I was telling you about, you should use this instead of anchors
@iantrich I have templated the crap out of the button-card with the decluttering-card as I know you liked my Homekit button design in the past I am certain you will love this!
@CM000n This release fixes the spacing between buttons and screen borders, I saw you had an iPhone Plus model and the buttons on the right look weird on it. Because the buttons are dynamic now this is no longer an issue on larger phones (and I have ofc tested it on my old iPhone 7 Plus)
@everyoneelse Enjoy this massive update and never hesitate to ask questions, just please have patience as I am not a customer service xD!
Wow, that’s really great what you’ve done here again @jimz011 . This time on the backend side of the front end. It looks very promising and easier to maintain.
I’ll see what I can do with it. With me everything lasts currently also somewhat longer until I have converted it. Completely after the German proverb: “The squirrel feeds itself laboriously” (“Mühsam ernährt sich das Eichhörnchen”).
By the way: I don’t use an IPhone but just a poor cheap Xiaomi Mi A2. But I think your new improvements will still be useful for me.
Again, thank you very much for your inspiration and what you have done so far
Ah I see, well the screenshot you made a few months/weeks ago showed me that you have a larger phone than I do, so that is why I mentioned it. Nevertheless will it look better on a Xiaomi as well as the buttons scale dynamically now.
Anyways, enjoy the new code and if you have any questions do not hesitate to ask them. Remember dumb questions are always better than not knowing at all
I will also try to update the repo more frequently from now on. The problem was whenever I decide to rewrite my entire setup it means many things break. This release took a bit longer because of that. Hopefully I don’t have to rewrite it from the ground up next time. However I am still thinking about how to shrink the code a bit further and will now continue working on dynamic theming. This will however take a while as theming is something delicate and should be done right.
You can also expect a revamped vacuum card within a week.
If you are looking for examples the long promised update is finally on github. I will most probably tweak it some more in the future but for now it is great. 5900 lines of code down from 7900 and not only that, I even added features since the previous configuration! You can see in my config for example that I use a single template for every button in my config (except for the light buttons, but I’ll figure that one out eventually which would save another 300/400 lines of code as I want to base all buttons of of one single template).
I’m glad you’re having fun. I have a lot of fun creating this (though this rewrite was pretty exhausting for a non-developer like myself). Pretty sure that people like the devs here do this way much faster than I can. Anyways if you need help just ask.
Yes that is true, I changed the code of the remote to the new format. However I use tvOS 13 now and Apple removed some services on the Apple TV making the remote control useless for me (as well as my dimming automations etc). I will probably go back to tvOS 12 soon. The top button in the remote app and in the new “other” view is a placeholder until I find something that really satisfies me (which it didn’t and still doesn’t).
Remote at the moment isn’t top priority because of this and I’m still not satisfied with the way the view looks. So it might change a few times again.
I finally got into doing the decluttering stuff, your example inspired me to rewrite my setup. Thanks, I will probably “steal” some more stuff in the future haha!
