Question

我对应用程序开发相当新。我正在努力解决的一件事是确保我的应用在具有不同屏幕尺寸的设备上看起来相同。

这是我使用的逻辑：

    public MainPage()
    {
        this.InitializeComponent();
        placeUI();
    }

placeUI（）方法是一种测量屏幕宽度和高度的方法。例如，如果我需要将我的组件从左侧放置10％，我只需将它在坐标上的x位置乘以0.1。

我的问题是 - 如果它是使UI响应不同屏幕尺寸的标准方法，还是有更简单的方法？谢谢！

Answer 1

有关用于响应式设计的几种技术，请参阅Define page layouts with XAML。该页面面向通用Windows应用程序（Windows 10），但除了RelativePanel和AdaptiveTriggers之外，所有内容都适用于Windows Phone 8.1运行时应用程序。

如果您只是想要一个反应灵敏的设计，例如将项目放置在距离边缘不变的10％的示例中，那么您可以在Grid控件中设置布局，并将列设置为占窗口的10％：< / p>

<Grid>
    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="1*"></ColumnDefinition>
        <ColumnDefinition Width="9*"></ColumnDefinition>
    </Grid.ColumnDefinitions>
    <TextBlock Grid.Column="1">This is 10% from the left</TextBlock>
</Grid>

虽然这对于单个项目来说似乎很多，但对于具有多个元素的典型布局，它通常很有效。

对于具有更多控件的繁忙设计，您可能希望根据屏幕大小移动它们。对于给定的文本块，50％的宽屏幕可能是充足的，而对于相同的文本，50％的窄屏幕可能太小。该应用程序可能希望从宽屏幕上的水平布局切换到窄屏幕上的垂直布局。该应用程序可以使用视觉状态来移动控件或完全切换控件（例如，用于宽屏幕的GridView和用于窄屏幕的ListView，两者都绑定到相同的底层数据）。

Windows手机上的响应式设计

1 个答案: