Hello guys,
My goal is to make a horizontal selection list. I’m using the Selection API as the example.
The difference is that I’m using a Scrollview and more than three options.
<ScrollView AllowedScrollDirections="Horizontal" ClipToBounds="True" LayoutMode="PreserveVisual">
<StackPanel Orientation="Horizontal">
<Selection Value="{Property Selected}" MaxCount="1" MinCount="1"/>
<Each Items="{options}">
<SegmentButton Label="Week {Week}" Selection="{Selection}"/>
</Each>
</StackPanel>
</ScrollView>
When selecting an option I want it to be presented in the middle of the visible Scrollview. I achieved that with a BringIntoView Trigger.
<Rectangle ux:Class="SegmentButton" HitTestMode="LocalBounds" Width="100">
<string ux:Property="Label" />
<string ux:Property="Selection" />
<Selectable Value="{Property Selection}" ux:Name="selectedNode"/>
<Text ux:Name="text" Alignment="Center" Color="LightGray" Value="{Property Label}" FontSize="15" />
<Stroke Color="LighterGray" />
<!-- While the rectangle is selected -->
<WhileSelected>
<DebugAction Message="selected {Property Selection}" />
<BringIntoView TargetNode="this"/>
<Change text.Color="White" Duration="0.2" />
<Change this.Color="Purple" Duration="0.2" />
<Change text.FontSize="17" Duration="0.2" />
</WhileSelected>
<!-- When the rectangle is tapped we want to change the selection -->
<Tapped>
<ToggleSelection />
</Tapped>
</Rectangle>
But the issue here is that I need a default option to be selected, and that option may or may not be visible in the Scrollview, as it is calculated dynamically. When I run my app, the default option is selected, which indicates that it runs the following code inside the WhileSelected
<Change text.Color="White" Duration="0.2" />
<Change this.Color="Purple" Duration="0.2" />
<Change text.FontSize="17" Duration="0.2" />
but it is not brought into view, which means it doesn’t run the <BringIntoView TargetNode="this"/> code, nor the <DebugAction Message="selected {Property Selection}" />.
My doubt if this is the expected behavior when building the selectable options and <BringIntoView TargetNode="this"/> is expected not the run in this case. If so, there is any way to make whatever option is selected by default to come into view? (I don’t know what option will be selected by default so I don’t really want to use goto or the gotoRelative)
Thanks.
