initialising UX defined variables

How-to Discussions
1

In the example of “circular menu button” there is this ux-only variable/property showItems, which is nowhere declared.

the first time it is “changed”, is in a click handler on some element.

<Panel Width="60" Height="60" Alignment="Right">
	<SmallAvatarIcon Width="40" Height="40"/>
	<Clicked>
		<Toggle Target="showItems" />
		<Toggle Target="hideHeadlines" />
		<Scale Factor="0.9" Duration="0.05" Easing="QuadraticInOut" />
	</Clicked>
</Panel>

then it is used like this

<Panel Margin="20,0,0,0">
	<WhileTrue ux:Name="showItems">
		<ScrollView ux:Name="itemsScrollView">
			<RemovingAnimation>
				<Change itemsScrollView.Opacity="0" Duration="0.6" Easing="ExponentialOut" />
			</RemovingAnimation>
			<StackPanel>
				<Each Items="{items}">
					<CalendarItem MinHeight="70" />
				</Each>
			</StackPanel>
		</ScrollView>
	</WhileTrue>
</Panel>

The problem now in this example is, that if I load this page, showItems seems to be falsy, as the itemsScrollView does not show up, as the example would suggest. instead we have to click the avatar element.

The question now is, how can we define those variables / set an initial value? What are those actually? Are they properties? Where are they attached to and how one can access them? I could not find anything in the docs about this type of properties.

2

showItems is actually defined here: <WhileTrue ux:Name="showItems">

In other words, showItems is a WhileTrue trigger.

The value of this trigger defaults to false and you can set it to true like this: <WhileTrue ux:Name="showItems" Value="true">

You can read more about this here