javascript - Titanium:平台检测并相应地改变界面风格

Question

您可能知道，不同的平台需要略有不同的 UX/UI。

例如，当您为 iPhone 设计时，您可能有一个后退按钮，但是当您为 Android 构建时，您不需要后退按钮。

其他就是图标，Android 的工具栏上可能有多个按钮，而 iPhone 的工具栏上只有 2 个按钮。

所以问题是......当你构建 js 文件来定义界面时，你是构建两个不同的界面 js 文件，每个文件都特定于平台，还是只构建 1 个 js 文件，根据平台检测来更改 UI。

---

我认为拥有两套特定于平台的 UI 可能会更容易，而不是在平台检测上更改样式，因为 UX 甚至可能不同，因此 UX 和 UI 的代码会相当复杂？你觉得怎么样？

Answer 1

我认为，拥有两套特定于平台的 UI 是更好的选择。 示例应用程序(钛工作室内置)展示了如何选择平台。以下是示例应用程序的代码:

var osname = Ti.Platform.osname,
    version = Ti.Platform.version,
    height = Ti.Platform.displayCaps.platformHeight,
    width = Ti.Platform.displayCaps.platformWidth;

//considering tablet to have one dimension over 900px - this is imperfect, so you should feel free to decide
//yourself what you consider a tablet form factor for android
var isTablet = osname === 'ipad' || (osname === 'android' && (width > 899 || height > 899));

var Window;
if (isTablet) {
        Window = require('ui/tablet/ApplicationWindow');
}
else {
    // Android uses platform-specific properties to create windows.
    // All other platforms follow a similar UI pattern.
    if (osname === 'android') {
        Window = require('ui/handheld/android/ApplicationWindow');
    }
    else {
        Window = require('ui/handheld/ApplicationWindow');
    }
}
new Window().open();