根据分辨率更改通用应用程序中的 XAML 边距答案

【问题标题】：Change XAML Margin in universal app based on resolution根据分辨率更改通用应用程序中的 XAML 边距
【发布时间】：2014-07-07 13:27:40
【问题描述】：

我正在为 Wp8.1/WinRt 开发通用应用程序。

对于手机，我有一个 gridview，它将包含堆栈面板的网格显示为“ItemTemplate”。

网格有明确指定的边距，如下所示：

 <GridView ItemsSource="{Binding CurrentItems}">
        <GridView.ItemTemplate>
            <DataTemplate>
               <Grid Width="140" Margin="6,0,6,6" x:Name="I_WANT_TO_ADJUST_MY_MARGINS">
                      <Border Background="{StaticResource PhoneAccentBrush}"/>
                        <Grid Height="140" Width="140">
                        <Image VerticalAlignment="Top" Margin="10" Width="100" Height="100" Source="{Binding Converter={StaticResource ImageConverter}}" HorizontalAlignment="Center" />
                    </Grid>
                    <Grid VerticalAlignment="Bottom">
                        <Border Background="{StaticResource PhoneBackgroundBrush}" Opacity="0.6"/>
                        <TextBlock Text="{Binding DisplayedName}" Style="{StaticResource BodyTextBlockStyle}" Margin="3" TextWrapping="Wrap"/>
                    </Grid>
                </Grid>
            </DataTemplate>
        </GridView.ItemTemplate>
  </GridView>

这在 6 英寸的手机上看起来很棒，给我一个 3 列的外观。但在一个小手机上，虽然我有两列，但右边的负空间量很可怕。

如果屏幕较小，我希望能够使网格的边距I_WANT_TO_ADJUST_MY_MARGINS更大？

注意：此布局专门用于在手机上运行。

【问题讨论】：

标签： c# xaml windows-phone-8.1

【解决方案1】：

我就是这样解决的：

将两个数据模板（大/小屏幕）添加到资源字典 - 我使用了页面资源，但您可能可以使用任何资源。
向页面资源添加 DataTemplateSelector。将上述两个模板指定为属性，如下所示：

<local:WpDataTemplateSelector x:Key="WpDataTemplateSelector" BigScreenTemplate="{StaticResource BigScreen}" SmallScreenTemplate="{StaticResource SmallScreen}"></converters:WpDataTemplateSelector>
在 DataTemplateSelector 中使用以下内容确定屏幕宽度：Window.Current.Bounds.Width
在 GridView 上指定 ItemTemplateSelector 属性

【讨论】：