Question

我正在尝试将旧应用程序迁移到Windows 10，而我正面临着Grid的问题。我在XAML页面中创建了一个Grid，其中包含2个不同的行中的WebView和ListView。现在问题是它在Local Machine（笔记本电脑）中显得很好但是当我在Windows Phone中检查相同时，它看起来不太好（图像，文本看起来非常大）。请在下面找到我的XAML代码和ListView的DataTemplate。我知道RelativePanel会节省我的一天，但任何人都可以更新我的代码并建议我，以便我可以在每个页面上使用相同的内容，因为我的应用程序经常在Grid中使用ListView。

XAML CODE

<Grid x:Name="LayoutRoot" Background="{StaticResource AppBackGroundColor}">
    <Grid.RowDefinitions>
        <RowDefinition Height="*"/>
        <RowDefinition Height="*"/>
    </Grid.RowDefinitions>

    <WebView Grid.Row="0"
             x:Name="webView"
             DefaultBackgroundColor="#388941"
             IsHitTestVisible="False"/>
    <ListView x:Name="loginandRegisterOptionslist"
             Margin="0,10,0,0"
             Grid.Row="1"
             ScrollViewer.VerticalScrollBarVisibility="Auto"
             ItemContainerStyle="{StaticResource GenericListViewContainerStyle}"
             ItemTemplate="{StaticResource WelcomePageListItemTemplate}"
             VerticalAlignment="Bottom"
             SelectionMode="Single"
             />
</Grid>

以上ListView的数据模板

<DataTemplate x:Key="WelcomePageListItemTemplate">

        <Grid Margin="0,2,0,2"
          Background="White">
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="Auto" />
                <ColumnDefinition Width="*" />
            </Grid.ColumnDefinitions>

            <Image Width="80"
               Height="60"
               Name="img1"
               Stretch="Uniform"
               Margin="4,0,4,0"
               Grid.Column="0"
               Source="{Binding IMAGE_URL}"></Image>

            <StackPanel Grid.Column="1"
                    Margin="0,8,0,8">
                <TextBlock Text="{Binding TITLE}"
                       Margin="2"
                       Style="{StaticResource HeaderContentStyle}" />
                <TextBlock Text="{Binding VALUE}"
                       Margin="2"
                       Style="{StaticResource DescriptionContentStyle}" />
            </StackPanel>
        </Grid>

</DataTemplate>

Answer 1

您可能需要尝试一些解决方案：

将您的datatemplace放入用户控件中，使用Adaptive Trigger根据不同的屏幕尺寸自定义图像和文本的大小。
对差异设备系列使用差异XAML视图
启动应用程序时，检测设备系列，根据该信息为大小装订设置正确的值

如何在Windows 10中制作自适应UI？

1 个答案: