在VisualState状态里更改Grid的列宽之类的

Win10的UWP有个StateTriggers ,挺不错，但是我还希望有一个方式，能更改Grid的列宽行高之类的东西，比如我之前用的http://l4ljl.codeplex.com/SourceControl/latest#RichMan4LUni/Pages/MainPage.xaml ,里面会根据我是不是横屏而转换显示的样式，现在没设备截不了图只好干说了。

这个东西~本来以为可以用Blend直接设计器里点的~发现得自己改两行代码。

第一步是需要给Grid的列之类的命个名，就像这样

 1 <Grid.ColumnDefinitions>
 2                 <ColumnDefinition x:Name="Col1"/>
 3                 <ColumnDefinition x:Name="Col2" Width="2*"/>
 4                 <ColumnDefinition x:Name="Col3"/>
 5             </Grid.ColumnDefinitions>
 6             <Grid.RowDefinitions>
 7                 <RowDefinition Height="15*"/>
 8                 <RowDefinition Height="Auto"/>
 9                 <RowDefinition Height="10*"/>
10                 <RowDefinition Height="Auto"/>
11                 <RowDefinition Height="5*"/>
12                 <RowDefinition Height="Auto"/>
13                 <RowDefinition Height="5*"/>
14                 <RowDefinition Height="Auto"/>
15                 <RowDefinition x:Name="Row" Height="20*"/>
16             </Grid.RowDefinitions>

给需要变换的行或者列附一个名字。

第二步是在VisualState 里面加Setter 。

 1 <VisualState x:Name="Wide">
 2                     <VisualState.Setters>
 3                         <Setter Target="Col1.Width" Value="5*"/>
 4                         <Setter Target="Col2.Width" Value="2*"/>
 5                         <Setter Target="Col3.Width" Value="1.5*"/>
 6                         <Setter Target="Row.Height" Value="15*"/>
 7                         <Setter Target="Title.(Grid.ColumnSpan)" Value="1"/>
 8                     </VisualState.Setters>
 9                     <VisualState.StateTriggers>
10                         <AdaptiveTrigger MinWindowWidth="640" MinWindowHeight="360"/>
11                     </VisualState.StateTriggers>
12 
13                 </VisualState>

就这样写就可以，刚写好的时候会有下划线各种报错，不用管编译一下就好了。

posted @ 2015-11-22 13:49  Wencey  阅读(425)  评论(0)  编辑  收藏  举报