Vertical List with variant list items looks different

Question

Hello, I have a screen with a vertical list that show every other item in a light gray and dark gray for easy readability for the user. I have a night variant for the previously mentioned light gray and dark gray colors to a darker shade. The day version of the vertical list shows up fine.But, the night version shows up with the light gray items showing up as much bigger than the dark gray items. Do you think this might be a bug? Thanks!

Answer 1

What do you mean with 'much bigger'. Could you post a screenshot of the correct and error cases?

I assume, in your project exists a style to controller the night variant selection. Do you switch the style dynamically at the runtime?

Switching on/off a style has no effect on already existing instances. This means, when you create a list item and then some styles are switched, the already existing item instance remains unaffected by this alternation. The styles alternation affects only new instances created subsequently after the styles have been changed. May be this is the problem?

Try following: In the toolbar activate the style 'night'. Then start the Prototyper. Does the list appear correctly? If yes, your variant is o.k. and the problem roots in the above described peculiarity of instances not being updated if the instances have been created before the styles is switched on/off. In such case you need to create a new instance of the actually visible GUI component and replace the actual component with it. The new instance and all embedded objects is created then with the new style enabled/disabled.

Best regards

Paul Banach

Comments

Hello Paul, yes this issue shows up on the prototyper when I have the "night" variant selected. All other screens look great in both modes. In the application though I do change the variant and then recreate all the screens including this one. I don't think that's the problem unfortunately. I'm unable to attach images sadly due to restrictions on our network.

---

For the benefit of others I'm posting the solution that Paul helped find in the implementation fo the VerticalList:

. The initialisation of the VerticalList property ItemHeight is 1 pixel:

This property should be set to the real height of the items to display in the list. The items in your project seem to be 30 pixel height. Thus change this property to 30. Please see Specify the height of an item within the list. 

2. The implementation of the OnLoad Slot method doesn't update the actual width of the item:

Please see Implement the OnLoadItem slot method to load the items. In this description you see the example code to load an item. In the last code line the item's size is adjusted to actual width of the list box:

itemView.Bounds.size = point( VerticalList.Bounds.w, VerticalList.ItemHeight );