Reputation: 689
I have created an adaptive trigger with three setters when the minWindowWidth>=0. But its not working. I looked into a similar question here but in that case the adaptive trigger was outside the grid. Even though the adaptive trigger is in the grid its not working. I have attached the implementation.The grid is initially set to collapsed but it is set visible once a custom condition is met.
<Grid x:Name="loginGrid" Visibility="Collapsed" Margin="12,0,12,0">
<!--Adaptive trigger for setting grid width and height-->
<VisualStateManager.VisualStateGroups>
<VisualStateGroup>
<VisualState>
<VisualState.StateTriggers>
<AdaptiveTrigger MinWindowWidth="9"/>
</VisualState.StateTriggers>
<VisualState.Setters>
<Setter Target="titl.Text" Value="Test"/>
<Setter Target="Login.Content" Value="Test"/>
<Setter Target="loginGrid.Margin" Value="12,500,12,500"/>
</VisualState.Setters>
</VisualState>
</VisualStateGroup>
</VisualStateManager.VisualStateGroups>
<Grid.RowDefinitions>
<RowDefinition Height="*" />
<RowDefinition Height="auto"/>
<RowDefinition Height=".25*"/>
<RowDefinition Height="*"/>
<RowDefinition Height="7*" />
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*" />
<ColumnDefinition Width="*"/>
</Grid.ColumnDefinitions>
<TextBlock x:Name="titl" Grid.Row="0" Grid.Column="0" TextAlignment="Center" FontSize="{StaticResource PivotHeaderItemFontSize}" Grid.ColumnSpan="2"/>
<TextBlock Text="Register No" Padding="10,10,10,10" FontSize="{StaticResource SearchBoxContentThemeFontSize}" Grid.Row="1" Grid.Column="0" TextAlignment="Center"/>
<TextBox x:Name="regNo" TextWrapping="Wrap" Text="" FontSize="{StaticResource SearchBoxContentThemeFontSize}" Grid.Row="1" Grid.Column="1" InputScope="Number"/>
<Button x:Name="Login" Content="Login" Click="Login_Click" Background="{ThemeResource AppBarBackgroundThemeBrush}" FontSize="{StaticResource SearchBoxContentThemeFontSize}" Grid.Row="3" Grid.Column="0" Grid.ColumnSpan="2" HorizontalAlignment="Stretch" VerticalAlignment="Stretch"/>
</Grid>
Upvotes: 1
Views: 2390
Reputation: 3746
I'm not seeing anything wrong with your code regarding the adapative trigger.
The error is more a margin error along with a row height error. You are using 500px top/bottom margins so sou will need to have a screen with more than 1000px height to see something. You are also misusing the star notation for the rows height. A star means a fraction of the available space.
For example, the following :
<RowDefinition Height="*" />
<RowDefinition Height="*"/>
<RowDefinition Height="8*" />
means that the first row will take 10% of the available space for the grid, the second 10% too and the latest 80%. BUT, if the available space is 0px, all rows will have a 0px height.
If you set the top/bottom margin to smaller values and let the rows which have fixed height content (like text, buttons etc.) take the space they need (set height to auto), it will work.
<Grid.RowDefinitions>
<RowDefinition Height="auto" />
<RowDefinition Height="auto"/>
<RowDefinition Height=".25*"/>
<RowDefinition Height="auto"/>
<RowDefinition Height="7*" />
</Grid.RowDefinitions>
I've changed the first and 4th rows height to auto so the content will always be displayed no matter of what the display size is.
Regarding the AdaptiveTrigger, do not forget that the minimum window size for UWP application is 320 px so setting a minimum width to 9px will end in the trigger always been active.
Upvotes: 2