responsive-design - 使用 Appcelerator Titanium 框架进行响应式 UI 设计

Question

我是Appcelerator框架的新手，我在appcelerator中开发了一个应用程序，但该应用程序在IOS上看起来不错，但在Android上看起来不太好。 我想开发一个像 html 一样响应式的屏幕。 有没有办法像响应式屏幕一样设计appcelerator屏幕。

谢谢你。

Answer 1

不要定义宽度，除非经过计算。 iOS 相当简单，只有几种不同的分辨率，在 Android 上你永远不知道可能会遇到什么分辨率。

幸运的是，您可以在 Titanium 中指定与 HTML 中不同的宽度。例如

var view = Ti.UI.createView({
  left: 20,
  right: 20
});

这将使您的 View 具有父级的宽度，左右各填充 20，将计算宽度。

此外，始终坚持使用原生 UI 元素。因此，应该使用选项卡组、操作栏/导航栏，这样您就不必担心这些元素的跨平台支持、样式和大小。

此外，当您不知道 UI 有多高时，大多数 View 都应该放在 ScrollView 中。它可以适用于 iOS，但不适用于小型 Android 设备。将其放入 ScrollView 中将始终修复屏幕，因为当内容高于适合的高度时， ScrollView 将自动启用滚动。

结论

• 宽度应相对定义。要么具有左/右属性，要么经过计算
• 如果内容的高度未知或未设计为全屏，则将其包裹在 ScrollView 中
• 不要再将应用视为网站，而开始将它们视为应用。布局的工作方式不同

最后，Appcelerator 是公司，Titanium 是您正在使用的技术:)