Lovelace Card Order is Baffling

Been interesting reading your discussion. Whilst I fully understand HOW it works - I also fully believe the philosophy behind this is wrong - and is one of those things that’s clearly ‘a developer does UI design’. Sure it’s logical but it’s bonkers to use.

Given the thrust to dumbing everything down (integrations / move from yaml etc) - this stands out as still incredibly odd. The casual user is oft mentioned for reasons to move away from yaml and move everything to the front-end. How is this casual user going to react when they’ve made themselves a dashboard just how they want it - only to find it renders completely differently on every different device with panels pissing about all over the place? You’re seriously going explain to them the 5 step logic based on the min panel size?

And - I might go on - this is all now rendered pointless by the multiple Lovelace dashboard access stuff. We can get away from the one-dashboard for every device paradigm and just have different dashboards for each device type / screen layout we connect with…

6 Likes

Listen, I just explained how it works. I didn’t come up with the idea, I didn’t develop it, I wasn’t on a committee coming up with the process, nor am I defending it. I will however, argue back when people don’t take advice on how to fix it and instead complain.

2 Likes

Sorry - I wasn’t meaning to have a go at you. I can see how it came across but that wasn’t my intention.

I’m just arguing against the concept that this is a sensible way to have a front-end. If we don’t make our voices heard, then how will things get better? I love HA, but the whole “hunt the panel” thing got boring a couple of years ago. But for some reason there seems to be a mindset that this is how it is, and it can / will never be improved. Most things have improved so much over the last couple of years, but the screen layout is still untouched and still a dog.

IMO.

7 Likes

I’d just like to post this here. My current front page. No stacked cards, and as you can see - minimising vertical scrolling is not what this dashboard achieves. It’s moving cards about and making the screen taller than you’d think possible.

2 Likes
  1. Just posting pictures does not help, not to mention you may not have refreshed the page since moving the order. There’s a caveat to the system. When you adjust the order, it moves the cards around but the automatic placement does not execute. So reloading the page will cause it to execute so you can see the true decided layout.

  2. We have no idea what your vertical stacks look like. You could have vertical stacks littered throughout that. That will drastically change your placement because the considered card is the vertical stack, not the card inside the vertical stack.

  3. Custom cards may not calculate height properly. Things like fold row and conditional cards impact placement because they are cards that have height when unhidden/expanded. The state at load time is usually what’s taken into account for card height.

  4. A solution has been posted many times. You’re welcome to use it to avoid all of this.

  5. If you want to see this change, make a feature request. In all these complaints, I’ve yet to see someone take the time to create a feature request to change this behavior.

Just posting pictures does not help, not to mention you may not have refreshed the page since moving the order. There’s a caveat to the system. When you adjust the order, it moves the cards around but the automatic placement does not execute. So reloading the page will cause it to execute so you can see the true decided layout.

The picture shows exactly what I wanted to show. That the aim of minimising scrolling doesn’t work (although my point is that this is the wrong philosophy - but that wasn’t the point of the picture). What else would you like me to have posted to back this up?

As to the second point - I refreshed several times because I wanted to be sure this wasn’t me being an idiot before I posted it.

We have no idea what your vertical stacks look like.

I mentioned in the post that there are no stacked cards on that page. They don’t look like anything because there aren’t any.

Custom cards may not calculate height properly. Things like fold row and conditional cards impact placement because they are cards that have height when unhidden/expanded. The state at load time is usually what’s taken into account for card height.

Fair point. I see there are 3 mini-graph cards on the offending column - so it could well be that.

A solution has been posted many times. You’re welcome to use it to avoid all of this.

I’ve not seen a solution to this. You’ve shown me how I can see the actual order of the cards, but not how to stop them wandering about the dashboard.

If you want to see this change, make a feature request. In all these complaints, I’ve yet to see someone take the time to create a feature request to change this behavior.

A great point. I’ve now created a feature request for what I’d like to see. Please vote for it people!

Custom:layout-card has been mentioned in this thread a ton. I even walked another gentleman through the process above.

And I wrote a lengthy response as to why that’s not practical. Having an entire dashboard defined in a single card would be like 1000+ lines long. An utter pain.

Recently, for example, I had an entity_id change under me which broke my picture-entity card. All I got was red screen saying there was an error - can’t remember the exact text - something like ‘Cannot get state of undefined’. I basically had to remove entity by entity until I found the offender. I can’t imagine doing that for a card with over 100 entities on it.

Many things can be done in other ways - however the dev team often look at improving them. See automations / scenes etc moving to the front end. Indeed much of the focus has been on improving the front-end accessability. I cannot for the life of me understand the defensive attitude to suggesting improvements - or the denial that everybody on here who finds the logic odd has a valid view point. It’s quite frustrating.

I’m not arguing to be a troll - I just feel that you’re dismissing an idea because ‘it doesn’t work that way’. The very fact that somebody took the time to make a layout-card to work round adds strength to my point. I think it would be a genuine improvement to HA, and that’s what we all want - devs and users alike - to make HA the best it can be.

Anyway - I don’t think we’re going to agree so this will be my last post on the issue (except to plug my feature my feature request if others respond). I’ve raised the feature request and we’ll see where that ends-up.

2 Likes

That’s not how you use it. You can use it as a single card where you need it. That would be per view worse case scenario.

See comment above. The offending card would still be red, not the entire layout card. Please don’t make assumptions.

No but you seem to knock the solution before trying it, which is why we are in this round about communication. It seems that you just don’t want to attempt using this, instead are making assumptions on how it works.

This card is most similar to a stack card. Do you get errors on the stack card when underlying card fails? Short answer: No.

This is correct. Because you are unwilling to try the solution. Not because the solution doesn’t work.

as a completely unrelated side note. I suggest that you look into the decluttering card or lovelace_gen. Both allow you to significantly shrink your configuration. They also make it easier to maintain.

Personally, I use lovelace_gen. I have about 3000 lines of ‘lovelace_gen’ code and it generates around 100,000 lines of UI. It’s extremely easy to manage and adding items is simply a configuration change with a couple lines of code. It has a steep learning curve to it though. Anyways, here’s a snipit of the entire layout card for it

          - type: custom:layout-card
            layout: grid
            gridrows: auto
            gridcols: 20% 80%
            cards:
            - type: vertical-stack
              gridrow: 1 / 1
              gridcol: 1 / 2
              cards:
              ...
            - type: vertical-stack
              gridrow: 1 / 1
              gridcol: 2 / 2
              cards:
              ...

Make the cards contained in ... decluttering cards or use lovelace_gen. Heck you can simple use !includes for each card.

1 Like

Came here to see if i can find any solution on my vertical stacking issue
And although there was quite a bit of heated back and forth, i did learned alot
And thanks @petro for your patience, hang in there.
Ill give custom layout + lovelace_gen a shot

Lovelace_gen is a steep learning curve but the juice is worth the squeeze.

This might give you some ideas

I use layout-card a lot and Lovelace-gen a bit. I also make a lot of use of stack-in-card and other methods to create compound “cards” which I put in separate include files to enable me to reuse recurring code and also include cards in different views and on different dashboards for landscape and portrait devices.

For example, the map screen for desktop uses the same compound ‘card’ four times, once for each person, I use layout card to place them and lovelace-gen to provide the parameters.

On mobile only one of the cards shows and you choose which by clicking on the person entity in a glance card which sets an input field. Conditional card does the rest.

3 Likes

Yep, perfect use for lovelace_gen. I do very similar things. Also if you do things this way, you don’t need to use the layout card because you’re cards will all meet the minimum 5 units height requirement. Everything will place it self properly. I only use the layout card in 1 spot to define a grid of cards that isn’t possible with the normal layout. Outside that, if you make sure all cards meet the minimum 5 height requirement, everything falls into the correct spot on mobile or desktop.

Might wanna hide your URL. :slight_smile:

1 Like

cake day :cake:

4 years! time flies :wink:

The PC view requires layout card to give the map more space, otherwise the 3rd person card falls under it and the map is too small for my liking. I also use it to superimpose Homer on the map :-), just for fun.

I don’t use it on the mobile view though.

Yep looking to do something similar

Right now its looking like a mess right now, i haven’t update it since the past few HA updates, all of them are stack in 1 column (using multiple custom-vertical stack in cards)

Ill try to inspire from your setup using layout-card and lovelace-gen
Thanks again

Too late tonight - but I’ll take a look at that tomorrow. Thanks.