I used a Data template and use that Data Template in the List view.i also use a Visual State Trigger for increase and decrease font size so my question is that when the windows state trigger but font size not changed. font size remain same in both mobile view in PC view.
Its my Code:
Data Template:
<Page.Resources>
<DataTemplate x:Name="CustomerListViewTemplate" x:DataType="data:Customerlistdata">
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="*"/>
<RowDefinition Height="*"/>
</Grid.RowDefinitions>
<TextBlock Grid.Row="0"
Text="{x:Bind full_firstname}"
x:Phase="1"
x:Name="product_name_layout"
Style="{ThemeResource BaseTextBlockStyle}"
TextWrapping="NoWrap"
Foreground="Gray"
Margin="15,10,0,0"
/>
<TextBlock
Grid.Row="1"
Text="{x:Bind email_id}"
x:Phase="2"
Style="{ThemeResource BodyTextBlockStyle}"
Margin="15,5,0,10"
x:Name="email_id"
FontSize="12"
Foreground="Gray"/>
</Grid>
</DataTemplate>
</Page.Resources>
List View:
<ListView x:Name="MasterListView"
SelectionMode="Extended"
UseLayoutRounding="False"
ScrollViewer.VerticalScrollMode="Enabled"
BorderBrush="#FFA79E9E"
SelectionChanged="OnSelectionChanged"
IsItemClickEnabled="True"
ShowsScrollingPlaceholders="False"
ItemTemplate="{StaticResource CustomerListViewTemplate }"
ItemClick="OnItemClick"
Grid.Column="0"
Grid.Row="1"
>
<ListView.ItemContainerStyle>
<Style TargetType="ListViewItem">
<Setter Property="HorizontalContentAlignment" Value="Stretch" />
</Style>
</ListView.ItemContainerStyle>
</ListView>
Visual State:
<VisualState x:Name="NarrowState">
<VisualState.StateTriggers>
<AdaptiveTrigger MinWindowWidth="0" />
</VisualState.StateTriggers>
<VisualState.Setters>
<Setter Target="MasterListView.Visibility" Value="Visible" />
<Setter Target="DetailContentPresenter.Visibility" Value="Collapsed" />
<Setter Target="MasterColumn.Width" Value="*" />
<Setter Target="DetailColumn.Width" Value="0"/>
<Setter Target="product_name_layout.FontSize" Value="10"/>
</VisualState.Setters>
</VisualState>
所以请给我一些建议如何根据窗口大小更改字体大小。 我想在窗口大小更改时更改字体大小。我使用了内置的风格。实际上我在windows通用应用程序中制作了一个主要细节视图。所有功能都正常工作但字体大小没有改变。
答案 0 :(得分：0)
In this situation we can not change the font size of the data template so we need to add two data template
1) data template for pc
2) data template for mobile
for pc:
--------------------------------------------------------------------------
<Page.Resources>
<DataTemplate x:Name="CustomerListViewTemplatePC" x:DataType="data:Customerlistdata">
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="*"/>
<RowDefinition Height="*"/>
</Grid.RowDefinitions>
<TextBlock Grid.Row="0"
Text="{x:Bind full_firstname}"
x:Phase="1"
x:Name="product_name_layout"
Style="{ThemeResource BaseTextBlockStyle}"
TextWrapping="NoWrap"
Foreground="Gray"
Margin="15,10,0,0"
/>
<TextBlock
Grid.Row="1"
Text="{x:Bind email_id}"
x:Phase="2"
Style="{ThemeResource BodyTextBlockStyle}"
Margin="15,5,0,10"
x:Name="email_id"
FontSize="12"
Foreground="Gray"/>
</Grid>
</DataTemplate>
</Page.Resources>
-------------------------------------------------------------------------------
for mobile
<Page.Resources>
<DataTemplate x:Name="CustomerListViewTemplateMobile" x:DataType="data:Customerlistdata">
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="*"/>
<RowDefinition Height="*"/>
</Grid.RowDefinitions>
<TextBlock Grid.Row="0"
Text="{x:Bind full_firstname}"
x:Phase="1"
x:Name="product_name_layout"
Style="{ThemeResource BaseTextBlockStyle}"
TextWrapping="NoWrap"
Foreground="Gray"
Margin="15,10,0,0"
/>
<TextBlock
Grid.Row="1"
Text="{x:Bind email_id}"
x:Phase="2"
Style="{ThemeResource BodyTextBlockStyle}"
Margin="15,5,0,10"
x:Name="email_id"
FontSize="12"
Foreground="Gray"/>
</Grid>
</DataTemplate>
</Page.Resources>
-----------------------------------------------------------------
aftre make a two individual data template then fire a trigger for both mobile(narrow state) and pc(wide state)
like this...........
<VisualStateManager.VisualStateGroups>
<VisualStateGroup x:Name="PageSizeStatesGroup"
CurrentStateChanged="OnCurrentStateChanged">
<VisualState x:Name="NarrowState">
<VisualState.StateTriggers>
<AdaptiveTrigger MinWindowWidth="0" />
</VisualState.StateTriggers>
<VisualState.Setters>
<Setter Target="MasterListView.Visibility" Value="Visible" />
<Setter Target="DetailContentPresenter.Visibility" Value="Collapsed" />
<Setter Target="MasterColumn.Width" Value="*" />
<Setter Target="DetailColumn.Width" Value="0"/>
</VisualState.Setters>
</VisualState>
<VisualState x:Name="WideState">
<VisualState.StateTriggers>
<AdaptiveTrigger MinWindowWidth="0" />
</VisualState.StateTriggers>
<VisualState.Setters>
<Setter Target="MasterListView.Visibility" Value="Visible" />
<Setter Target="DetailContentPresenter.Visibility" Value="Collapsed" />
<Setter Target="MasterColumn.Width" Value="*" />
<Setter Target="DetailColumn.Width" Value="auto"/>
</VisualState.Setters>
</VisualState>
</VisualStateGroup>
</VisualStateManager.VisualStateGroups>
-----------------------------------------------------------------------------
then apply data template in the listview like this
<ListView x:Name="MasterListView"
SelectionMode="Extended"
UseLayoutRounding="False"
ScrollViewer.VerticalScrollMode="Enabled"
BorderBrush="#FFA79E9E"
SelectionChanged="OnSelectionChanged"
IsItemClickEnabled="True"
ShowsScrollingPlaceholders="False"
ItemTemplate="{`enter code here`StaticResource CustomerListViewTemplate }"
ItemClick="OnItemClick"
Grid.Column="0"
Grid.Row="1"
>
<ListView.ItemContainerStyle>
<Style TargetType="ListViewItem">
<Setter Property="HorizontalContentAlignment" Value="Stretch" />
<Setter Property="FontSize" Value="10" />
</Style>
</ListView.ItemContainerStyle>
</ListView>