我刚刚开始在通用应用程序中开发。我在Windows 8商店应用程序中开发了应用程序,还开发了Windows Phone 8和Windows Phone 8.1(SilverLight)应用程序。问题与Windows中的通用应用程序和在App中创建的单个UI有关。共享文件夹。
1 对于网络,有响应式用户界面之类的字词。创建有媒体查询来写 css 。 我知道css与我们可以为xaml创建资源相同。我可以从c#获得分辨率,我可以为不同的分辨率创建不同的UI,我可以根据分辨率看到折叠,但是是否有任何单一的方式可以根据设计自动调整。 (这个问题特别与数据绑定控制有关...)
答案 0 :(得分:3)
有几种技术可以根据窗口的大小,形状和分辨率调整页面的设计。这些通常一起使用。
第一种是使用动态布局控件而不是硬编码位置。例如,使用带有*列的网格控件按百分比分割屏幕,或使用StackPanel来堆叠控件,以便它们适合它们。 GridViews可以扩展以填充屏幕(以及更远)。这将让应用程序流动以使用可用空间。
MSDN在Quickstart: Defining layouts
中讨论了这项技术对于更大规模的更改,其中应用应进行更大的更改以适应更大的更改,例如纵向与横向与捕捉模式,您可以使用视觉状态。可视状态允许应用程序设置特定状态(例如“横向”),该状态会自动更改页面控件的属性。对于动态布局,视觉状态通常会隐藏和显示不同的控件,例如从横向模式下的水平方向GridView切换到纵向模式下垂直方向的ListView。通过将两个控件绑定到相同数据的数据绑定,代码隐藏不需要知道在任何特定时间使用哪些控件的任何细节。
MSDN在Quickstart: Designing apps for different window sizes
中讨论了这项技术Blend有一个非常好的Visual States编辑器,您可以用它来直观地定义和设置不同的视觉状态。
相同的技术和代码适用于Windows应用商店应用和Windows Phone应用商店应用,但确切的布局可能会有所不同,以迎合不同的设备尺寸。 Windows应用商店应用程序可以在各种显示尺寸上运行,用户可以自由调整Windows应用商店应用的大小,因此Windows应用商店应用需要支持比Windows Phone应用商店更灵活的布局。 Windows Phone Store应用程序需要考虑显示分辨率,但运行相当一致的宽高比,仅对纵向或横向进行更改。
对于非常简单的应用程序,您可以在通用应用程序的共享项目中共享单个Xaml页面,但在大多数情况下,使用Windows应用商店和Windows Phone应用程序的单独页面设计会更好。除了屏幕尺寸差异之外,还有一些控制差异需要单独的Xaml。 Xaml不支持条件编译,因此共享Xaml文件在两者中都必须完全相同。
答案 1 :(得分:0)
对于Windows应用商店,您可以使用“视觉状态”。您可以设置确定要使用哪种视觉状态的规则,例如当宽度为320时,切换到捕捉模式并修改布局以适应。
在查找有关此内容的信息时要小心,因为Windows 8和8.1之间的范例发生了很大变化。
Jerry Nixon有一个关于视觉状态的精彩教程: http://blog.jerrynixon.com/2013/11/windows-81-how-to-use-visual-states-in.html
我的博客中的这篇文章介绍了一个仅使用代码隐藏的简单场景(VB,但应该很容易更改为C#) - 当你有一个复杂的布局时不建议: http://grogansoft.com/blog/?p=116
Windows开发中心的这些内容中有一个示例: https://code.msdn.microsoft.com/windowsapps/Windows-8-Modern-Style-App-Samples/view/SamplePack#content
对于手机版本,您可能不应该为视觉状态而烦恼,因为手机应用程序始终具有全屏,并且将显示器锁定为纵向或横向是更好的用户体验。
您的手机/商店应用可以共享控件,但它们有自己的页面。我通常会创建任何数据绑定控件的全尺寸和小版本,并在手机上使用较小的尺寸,并且Store版本处于较小的状态(例如屏幕的1/2)。