windows phone 8.1上的不同分辨率答案

【问题标题】：Different resolutions on windows phone 8.1windows phone 8.1上的不同分辨率
【发布时间】：2014-12-15 18:46:24
【问题描述】：

我正在将 Titanium 应用程序（适用于 ios 和 Android）迁移到 windows phone 8.1。我是 Windows 应用程序的新手。

我想创建一个在不同屏幕上具有相同外观的应用程序，我的意思是在更大的屏幕上显示更大的元素，但保持应用程序的外观。我想我需要定义边距和宽度和高度来在页面中放置元素。

我尝试在 MainPage.xaml 中放置一些基本元素，看看会发生什么。这是我的代码：

<Grid>

    <Image Source="Assets/ppal/fondoCompleto.png"
           Margin="-25, 0, -25, 0"></Image>
    <Image Source="Assets/ppal/settings.png"
           Margin="10,10,365,612"></Image>
    <TextBlock Text="aaa" FontFamily="Arial" 
               TextAlignment="Center"
               Margin="0, 200, 0, 0"
               FontSize="22"/>

    <Rectangle
        Fill="#0098bc"
        Margin="30, 50, 30, 450"
        RadiusX="5"
        RadiusY="5"/>
</Grid>

我已经在不同英寸的不同 Windows 手机模拟器中尝试过，结果很糟糕。它在 4 英寸上显示正常，但在 6 英寸上显示非常糟糕。

你知道我该怎么做吗？

有没有办法使用像倾角这样的单位，而不是像素？

或者是否有公式可以根据屏幕尺寸转换宽度、高度、边距并返回值？（这是我在 Titanium 应用程序中使用的：Titanium conversion pixels to dp）

非常感谢！

【问题讨论】：

最好在这里提供不同分辨率的图像，这样操作系统就不会缩放它们。使用适当的扩展名非常容易，操作系统会自行获取文件。也许this answer 会有所帮助，还有reference to MSDN。

标签： windows-phone-8.1 screen-resolution screen-size

【解决方案1】：

“我想我需要定义 Margin 和 Width 和 Height 来在页面中放置元素”

不一定。如果您有需要通过动画重叠或移动的元素，您可能需要这样做，但如果您只是布置一些表单元素，您应该使用网格（或多个网格）来排列它们。我不会尝试从上面辨别你的布局（无论如何它看起来像是一个随机测试），但它看起来像这样：

<Grid>
    <Grid.RowDefinitions>
        <RowDefinition Height="100" />
        <RowDefinition Height="*" />
        <RowDefinition Height="2*" />
        <RowDefinition Height="50" />
    </Grid.RowDefinitions>
    <Image Source="Assets/ppal/fondoCompleto.png" Grid.Row="0"></Image>
    <Image Source="Assets/ppal/settings.png" Grid.Row="1"></Image>
    <Rectangle Grid.Row="2" Fill="#0098bc" RadiusX="5" RadiusY="5" />
    <TextBlock Grid.Row="3" Text="aaa" FontFamily="Arial" TextAlignment="Center" FontSize="22"/>
</Grid>

这将布置四行；顶部是 100px 高，底部是 50px 高，中间两行将填满屏幕空间的其余部分(*)，第二行是第一行(2*) 的两倍。您可以对ColumnDefinitions 执行相同的操作。图像应该缩放以适合包含的网格单元格，如果您需要其他元素来缩放以适应通常不适合的元素，您可以使用 ViewBox 之类的东西。

您还可以结合使用网格布局和边距/水平对齐来获得所需的布局。边距将相对于包含的网格单元格。也没有什么可以阻止您在单个网格单元中包含多个元素 - 您可以在两个项目上使用 Grid.Row=1，然后使用边距等按您想要的方式布置它们。

【讨论】：