如何为不同的显示器分辨率设计GUI？

Question

我正在为特殊应用设计和实现GUI。

我在C＃上使用WPF，

我打算将此应用应用于不同的显示器分辨率（1366x768或1920x1080，...）。

但我对此没有任何经验。我不知道如何实现可以在任何分辨率上显示的灵活GUI。

有人能给我这些想法吗？

Answer 1

1 - 手动编写XAML，不要使用Visual Studio设计器。

• 设计师可以生成固定大小的固定位置UI（ala winforms），如果您需要独立于分辨率，它将无用。

2 - 不要自己修复UI元素的大小和位置。

• 不要做<TextBox Width="56" Margin="50,30,10,5"/>之类的事情。而不是将UI置于与分辨率无关的布局容器中，例如Grid或DockPanel。也可以在网格中使用星号。

编辑：添加@ Viv的评论，这非常重要，我决定将其作为答案的一部分：

与编程中的其他内容一样，请注意点1。不要像“在MVVM中使用代码隐藏中的任何代码错误”这样的另一个语句。使用Designer（VS / Blend）来生成模板，修改故事板，VSM，导入Illustrator / Photoshop文件是非常合理的。知道你正在处理什么，即使在这种情况下，你得到恒定的维度，相应地调整xaml以摆脱它而不是完全忽略它的每个方面

Answer 2

首先，它在某种程度上取决于应用程序的性质，但是你指定的分辨率在宏观方案中并不是非常不同（如果你要比较640x480到2560x1600，那么你可能会有更大的顾虑！），所以很可能，如果你选择了正确的组件，他们会为你自己组织（或者更合适的是，操作系统会在幕后组织它们）。

您选择WPF这一事实意味着您对UI元素的呈现方式具有很大的灵活性，因为WPF本身就是基于矢量的渲染引擎，而不是Windows Forms（GDI / GDI +），它是DPI / per基于像素的渲染引擎。

但是，让我们深入研究一下这个吗？

例如，假设您在Windows窗体中设计了UI，它需要在窗体上使用ToolStrip，然后在ToolStrip上需要1000个按钮。好吧，在一台大型显示器上，您可能只看到所有1000个按钮，但在您的沼泽标准1080p显示器上，您可能只看到其中的30个;那么剩下的会发生什么？ - Windows会将这些文件放在ToolStrip末尾的子菜单中，这样您仍然可以访问它们，即使它们不在ToolStrip的主（可见）部分。我很确定同样的原则将适用于WPF，通过你可以更好地控制事物的渲染方式，并出现！

WPF通过矢量渲染带来的好处是分辨率独立性。这使您可以灵活地决定是否希望元素呈现为“固定”大小（跨任何分辨率，它将始终使用相同的像素），或者允许引擎根据分辨率动态调整元素大小（on低分辨率元素将使用较少的像素进行渲染，但质量较差，或者在高分辨率下，将使用更多像素渲染，并且具有更高的质量。）

为了帮助您入门，这是来自SyncFusion的免费WPF电子书（严肃地说，看看它们，它们赠送了相当多的免费，体面的东西！）

WPF Succinctly