Android Question How to determine the height of xCLV items?

[Daica]

Helly everyone,

In examples and tutorials, I've seen for xCustomListView, I see people just put in x dip as a value.
For example:

Dim p As B4XView = xui.CreatePanel("")
p.Color = xui.Color_Black
     
p.SetLayoutAnimated(0, 0, 0, 100%x, 200dip) '<----- how do I determine what 200dip is supposed to be?
p.LoadLayout("ListViewItems")

My "ListViewItems" layout has a panel that contains all the items, for example maybe a EditText, Label, ImageView, and Button.
Something like this:

How do I determine that 200dip is correct? Do I add up all the heights of my items or something? Do I debug 10x and test different heights until I find something that fits?

Another thing is that after adding my item, there is a huge gap between items in my list. In the examples and tutorials I've seen, the items has a nice even gap between them

 

[Unobtainius]

Usually I take the lowest items top plus its height plus hightest items top, but all your items are in a panel, so in this particular case, panel height + (panel top x 2)

 

[Unobtainius]

Because your first panel item is offset from the top of the panel you will likely need to add first panel items top to get an even layout.

 

[Daica]

Usually I take the lowest items top plus its height plus hightest items top, but all your items are in a panel, so in this particular case, panel height + (panel top x 2)

Because your first panel item is offset from the top of the panel you will likely need to add first panel items top to get an even layout.

I'll list all my item's top and height to see if I can get this right.

• Panel1: TOP: 10, HEIGHT: None, but there is BOTTOM EDGE DIST: 150
• lblSegmentCode: TOP: 10, HEIGHT: 30
• TakenPicturePreview: TOP: 40, HEIGHT: 180
• lblSegmentDetails: TOP: 220, HEIGHT: 50

Panel1 Height (150) + Panel1 Top * 2 (20) + lblSegmentCode Top (10) = 190dip?

 

[Unobtainius]

Just think of the panel as the clv row. Use the panels height as the clv height. If you offset the top of the panel then add the offset x 2 to the panel height for the clv height. Note, to use this method, don't offset you controls from the top of the panel like you have in the picture

 

[Unobtainius]

In your pic the panel incasules the other controls so you don't need to take them into account to work out the clv height

 

[Daica]

Just think of the panel as the clv row. Use the panels height as the clv height. If you offset the top of the panel then add the offset x 2 to the panel height for the clv height. Note, to use this method, don't offset you controls from the top of the panel like you have in the picture

So should I load the layout and THEN grab the panel's height? Something like this...

p.SetLayoutAnimated(0, 0, 0, 100%x, 100dip)
p.LoadLayout("ListViewItems")
p.SetLayoutAnimated(0, 0, 0, 100%x, Panel1.height + 10dip) 'offset is 5dip so 5*2 = 10dip

 

[Unobtainius]

? You only set the height once. And first, before you load the layout file

 

[Unobtainius]

In the designer genrate a reference to the panel so the app knows your panel height. It's the only way to refence the panel height otherwise regardless of loading the layout the app still can't access anything about the panel

 

[Daica]

In the designer genrate a reference to the panel so the app knows your panel height. It's the only way to refence the panel height otherwise regardless of loading the layout the app still can't access anything about the panel

The panel is part of the Layout for the CLV item. Until I load the layout, if I try to access the panel's properties, I will get an error : Object should first be initialized (Panel).
That is why I set the layout twice.

The anchor on my panel is set stretch left/right and top/bottom so there is no "Height" property. Maybe I will try setting the anchor to stretch left/right and vertical anchor to Top

I'll set the vertical anchor to TOP so that there is a height property so I can use it.

270 + (5 * 2) = 290dip
This looks MUCH better now.

 

[Unobtainius]

If you are going to anchor the panels top and bottom, strech it in the designer to take up the designer surface otherwise results will be weird

 

[Daica]

If you are going to anchor the panels top and bottom, strech it in the designer to take up the designer surface otherwise results will be weird

I will try removing the panel as well, and try your method of the lowest items top plus its height plus (highest items top * 2)
Thank you so much for your wisdom

 

[Unobtainius]

Highest items top x 2

 

[Unobtainius]

Yours would be easy if you moved lblSegmentCode to the top of the panel

Then just go panel height + (panel top x 2)

 

[Unobtainius]

Remember right click and the panel in he designer and generate panel as b4xview

 

[Daica]

Yours would be easy if you moved lblSegmentCode to the top of the panel

Then just go panel height + (panel top x 2)

What if the panel's top is 0?

 

[Unobtainius]

Then you clv won't have a gap between each row of controls other than its built in one

 

[Daica]

I see, so there are a few different ways to do it. I will play around with all of it.
The only thing is I have to figure out how to change the size if the text is too long for example.
Thank you for all your help!