具有适应不同屏幕分辨率的视图的 MVC 模式

Posted 2023-03-08

【中文标题】具有适应不同屏幕分辨率的视图的 MVC 模式

【英文标题】：MVC pattern with Views adapting to different screen resolutions

【发布时间】：2013-02-21 15:31:56

【问题描述】：

我开始考虑如何解决为具有不同屏幕（分辨率、比例、视网膜等）的所有 ios 设备开发应用程序的问题。我正在使用 Adob​​e Air (AS3)，但这并不重要，因为我处于概念阶段，我担心要使用的模式。

如果我只是为 iPad 开发，那么问题将很简单，只需将尺寸和尺寸加倍以适应视网膜和非视网膜设备。但我需要考虑 iPhone、iPod 以及最终的 android，因为它有无数的屏幕。

到目前为止，我看到了这些可能的选择。如果这些选项已经有一些术语，我很抱歉，但我只会说我自己的话。

具有某种流动布局的智能视图，以及适应视图分配给它们的空间的智能组件，以及字体大小和图像大小的屏幕 dpi。例如：视图显示“底部有一个具有此宽度/高度的按钮”。按钮已经知道文本必须是什么字体大小，具体取决于屏幕 dpi。

使用不同 UI 视图类的参数进行分解。所以我有一个用于 iPad 的视图类，另一个用于 iPhone 等等，并且会有一个类会根据设备分解视图的实例化。这些类中的每一个都可以手工定制为彼此完全不同，但底层模型和（希望）控制器在每台设备上都是相同的。

一种中间方法：一个用于平板电脑的 UI 视图类，另一个用于手机的 UI 视图类，每个都具有某种液体容量来微调元素（按钮、文本、图像等）的位置和大小.

根据设备为 View 提供一些参数的外部配置文件。那将是某种自定义 CSS。

我确信我不是第一个在我的路上发现这块石头的人。 那么这个问题通常是如何解决的呢？ 这些场景是否有一些固定的模式？ 是否有一些我应该阅读的参考资料（书、文章）？

我还没有找到一个深入的答案。如果它已经被询问/回答，请不要投反对票。在 cmets 中发布链接，我将删除此问题。

【参考方案1】：

您正在描述响应式网页设计。有多种方法和方法可以让您的网站响应式（即能够在多种屏幕尺寸上运行，而无需修改或重新配置代码库或依赖用户代理来检测浏览器信息）。

从这里开始：http://msdn.microsoft.com/en-us/magazine/hh653584.aspx

还可以考虑各种可以简化您的生活的开源 CSS 框架。例如，Bootstrap 和 html5 Boilerplate。这两者都完全独立于您的开发平台，并且应该可以与 MVC 很好地配合使用。

【讨论】：

我没有做网站...而且我也没有使用 HTML/CSS。