[LiquidWater]

Hi all,

I am having problems with creating a list of the video page options, which include buttons (View mode, Sort by) and toggle buttons (Sort direction), that has the container.position available.

My interface uses graphics to highlight the selection that goes off of the button space so I have been using the container.position to determine what selection graphic to make visible. Note that the graphic is specific to the position on the list so all items at position "0" use the same graphic and item at position "1" use the same graphic. If I just use the lists focus layout, I am limited to the button space and If I make the buttons huge then the user will be pressing buttons they don't mean to.

I can use the list control but then I cannot put the toggle buttons in it. For the regular content lists (movies,tv shows, etc.) it works perfectly since I have the container position.

Is there anyway to make a list that has toggle buttons in it that still has the container.position label available?

Thanks!

[jmarshall]

A screenshot or two of what you're trying to achieve may be useful.

[LiquidWater]

A screenshot or two of what you're trying to achieve may be useful.

Sure, I'm on my laptop so I don't have access to get screen shots but here is a super rough mock up:



I use an image for each one of the blue selection graphics that I make visible when the corresponding container.position is selected. In this case I use "StringCompare(Container.Position,1)" to make that blue graphic visible. This works perfectly when using the list control on MyVideoNav.xml since it supports container.position...

The mock up might not show it well but the right part of the graphic goes down to the next buttons area which means I can't just extend the width of the button and have the graphic as the focusedlayout.

The real problem is that I can't put the toggle buttons in a list and use items to populate it. In this picture, the "View" and "Sort" button work fine since you can just do, for example:

<label>Sort: $INFO[Container.SortMethod]</label>
<onclick>Container.NextSortMethod</onclick>

The toggle button for the direction ("Ascending") though needs a toggle button which uses:

<onclick>Container.SortDirection</onclick>
<label>584</label>
<altlabel>585</altlabel>

The problem is that I cannot put that in a list as an item AND if I put the buttons in a grouplist then I cannot use container.position.

I know it might be a bit confusing...

Thanks!

[Hitcher]

Why not use visible conditions based on which button is focus instead of string compares based on container positions?

ie

<visible>Control.HasFocus(2)</visible>

[LiquidWater]

Why not use visible conditions based on which button is focus instead of string compares based on container positions?

ie

<visible>Control.HasFocus(2)</visible>

Good idea... I forgot to mention that the list can scroll up and down since there are more controls that do not fit in the viewable list area. For example the "Sort" button maybe at position 0,1,2,3,4,5. If I use Control.hasFocus([sortId]) then the same graphic will appear no matter the position of the "Sort" button...

Thanks!

[Hitcher]

In that case you could use a list with static content and base the images positions on Container().HasFocus().

[LiquidWater]

In that case you could use a list with static content and base the images positions on Container().HasFocus().

I'm not sure I quite get what you mean... Use a list control and set the <content><item> for each button?

I have tried to use this method but I have not been able to figure out how to use the toggle buttons in this way. They require "label" and "altlabel" to show the value since for example, "Container.SortDirection" does not return a string you can use in:

<label>Direction: $INFO[Container.SortDirection]</label>

Otherwise this way works for regular buttons since the list control supports "container.position".

Again the selection graphic to appear is based off of the position in the list rather than the button itself. So whenever the first item in the list has focus, "selectionIndex0.png", for example, would be shown regardless of the button at that index.

Thanks!

[Hitcher]

Use two items based on the toggle labels of those buttons.

ie

PHP Code:

<item id="1">
    <visible>StringCompare(Control.GetLabel(4),$LOCALIZE[584])</visible>
    <label>584</label>
    <onclick>SendClick(25,4)</onclick>
</item>
<item id="2">
    <visible>StringCompare(Control.GetLabel(4),$LOCALIZE[585])</visible>
    <label>585</label>
    <onclick>SendClick(25,4)</onclick>
</item> 


This is for the Sort Direction button.

[LiquidWater]

Use two items based on the toggle labels of those buttons.

ie

PHP Code:

<item id="1">
    <visible>StringCompare(Control.GetLabel(4),$LOCALIZE[584])</visible>
    <label>584</label>
    <onclick>SendClick(25,4)</onclick>
</item>
<item id="2">
    <visible>StringCompare(Control.GetLabel(4),$LOCALIZE[585])</visible>
    <label>585</label>
    <onclick>SendClick(25,4)</onclick>
</item> 


This is for the Sort Direction button.

WOW. Thank you so much! It works perfectly!

[LiquidWater]

Just in case someone has the same problem in the future I want to show the code I used. The code above is great but I was not able to get it to hold the last value so every time the user opened the settings dialog, the value shown would always be "ascending" even if the value was "descending". Here is what I used to fix that, the key being using "container.sortdirection(descending)" and "container.sortdirection(ascending)" for the visibility:

PHP Code:

<control type="togglebutton" id="4">
    <description>Sort Direction</description>
    <visible>false</visible>
    <onclick>Container.SortDirection</onclick>
    <label>584</label>
    <altlabel>585</altlabel>
</control>


<control type="list" id="500">
    <itemlayout width="900" height="85">
        <control type="label">
            <label>$INFO[ListItem.Label]</label>
        </control>
    </itemlayout>

    <focusedlayout width="900" height="85">
        <control type="label">
            <label>$INFO[ListItem.Label]</label>
        </control>
    </focusedlayout>    
        
    <content>                            
        <item id="1">
                <visible>container.sortdirection(ascending)</visible>
                <label>584</label>
                <onclick>SendClick(25,4)</onclick>
        </item>
        <item id="2">
               <visible>container.sortdirection(descending)</visible>
                <label>585</label>
                <onclick>SendClick(25,4)</onclick>
        </item>  
    </content>
</control> 


All the props go to Hitcher for helping me get this to work!

Thanks again!