[frishi]

Hi skinners!

I have a question about positioning.
I wanted to know if there is an equivalent of CSS fluid positioning in the world of XML skinning for XBMC.

Say I have this layout with the following controls:

labelA----image
|
labelB
|
labelC

Now let's say, each label has a height of 30 (pixels?)
and labelB is a tagline property that is not available for a certain movie.

In that case, labelB is just a hunk of 30(units?) sitting there creating awkward white space.
Can't I expect labelC to be "pushed up" when labelB is unavailable?

To be clear, I am using the skin.widgets addon to invoke properties of random and recent movies:

PHP Code:

<label>$INFO[Window(Home).Property(RandomMovie.1.Tagline)]</label> 


I am not sure if I am understanding the positioning correctly...

Please help.

[Jeroen]

If you put the labels in a grouplist, and use visibility conditions to check whether the info for that label is available, then yes.

[frishi]

Thanks Jeroen!

However, I am using a group to display the movie title, tagline and then it's rating since it makes the most sense.
Do you think I should use a list instead?

[Hitcher]

If using a group you'll have to add a slide animation to move labelC up if labelB isn't available.

Using a grouplist as Jeroen suggested removes the need to animate labelC because it'll take the position of labelB if you hide it when not available.

[Jeroen]

Well, with just a group you're not going to be able to have any moving of the items like you described.

Note that you can still use groups within the list so you can group the labels for 1 item together.

I use this method in the video information screen. The amount of available metadata for each movie can of course differ, and I don't want a bunch of labels saying "unavailable" or something like that. So, I use this same method to hide unavailable info and move everything below it up.

snippet:

PHP Code:

<control type="grouplist" id="1000">
    <orientation>vertical</orientation>
    <height>320</height>
    <itemgap>0</itemgap>
    <!--writer-->
    <control type="group">
        <width>720</width>
        <height>22</height>
        <visible>!IsEmpty(ListItem.Writer)</visible>
        <control type="label">
            <width>720</width>
            <label>$LOCALIZE[20417] [COLOR=Color1]$INFO[ListItem.Writer][/COLOR]</label>
            <include>detail_Sub</include>
            <include>autoscroll-line</include>
        </control>
    </control> 


etc..

[frishi]

Thanks Jeroen!

I'll try that.

[frishi]

As a follow-up, I followed Jeroen's advice.

I put the rating metadata into a nested group within a grouplist.
Also added the !IsEmpty() condition to the movie tagline Infolabel.