sencha-touch - 使用 sencha touch 跨平台一致的 UI，而不是恒定的 UI

Question

我想知道如何在所有平台上创建一致的 UI 而不是恒定的 UI。在这里，一致我的意思是 UI 应该看起来是该特定平台的原生。例如，iOS 中的标签栏位于底部并具有特殊的外观，而 Android 中的标签栏位于顶部且具有不同的外观。

如果我在 sencha 中创建标签栏，它默认位于底部并提供与 iOS 非常相似的蓝色外观和感觉，但它不适用于 Android，因为使用默认外观我会失去 Android 应用程序的感觉，就像Android 中的 iOS 应用程序。
那么我该如何解决这个问题呢？我是否为所有平台编写其他条件以正确布局组件并应用特定的 CSS，或者我可以通过主题来完成，如果是，我可以使用主题来做些什么？请注意，我的目标不仅是拥有不同的组件品牌，而且还要改变它们的位置/方向等。

这些问题的答案是必须的，因为它们将决定我们是否应该采用 sencha 作为跨平台工具。如果我能得到任何在 iPhone/iPad/Android 手机/Android Pad 上运行并提供其平台特定 UI 的工作示例，我将不胜感激。

谢谢，
塔伦。

Answer 1

您可以使用主题来获取 native 颜色。 Sencha touch 带有 4 个 css - android.css、apple.css、bb6.css 和 sencha-touch.css。如果你对这些不满意，你可以用 sass 和 compass 定制一个。关于主题 - http://vimeo.com/17879651

因此，如果您正在开发 Web 应用程序，那么您应该检测设备的类型并发送适当的 css。如果您正在做类似应用程序的 phonegap，那么您可以为每个平台打包不同的 css。

要获得原始位置和方向，您可以使用 sencha 的配置文件。在本教程中阅读有关它们的所有信息:http://www.sencha.com/learn/idiomatic-layouts-with-sencha-touch/ - 基本上，您检查设备的类型并将其保存到配置文件对象，在您拥有检查该对象的 if/else 语句之后。

在这里你可以找到一些用sencha touch制作的应用程序- http://www.sencha.com/apps/