📌  相关文章
📜  Sencha Touch-主题

📅  最后修改于: 2020-10-19 03:03:34             🧑  作者: Mango

Sencha Touch提供了许多可在您的应用程序中使用的主题。您可以添加不同的主题代替经典主题，并根据我们用于该应用程序的设备查看输出的差异。只需替换主题CSS文件即可完成此操作，如以下示例中所述。

桌面主题

考虑您的第一个Hello World应用程序。该应用程序中的以下CSS用于桌面主题。

https://cdn.sencha.com/touch/sencha-touch-2.4.2/resources/css/sencha-touch.css

要查看效果，请尝试以下程序-

现场演示

这将产生以下结果-

Windows主题

考虑您的第一个Hello World应用程序。从应用程序中删除以下CSS-

https://cdn.sencha.com/touch/sencha-touch-2.4.2/resources/css/sencha-touch.css

添加以下CSS以使用Windows主题。

https://cdn.sencha.com/touch/sencha-touch-2.4.2/resources/css/wp.css

要查看效果，请尝试以下程序-

现场演示

这将产生以下结果-

iOS主题

考虑您的第一个Hello World应用程序。从应用程序中删除以下CSS。

https://cdn.sencha.com/touch/sencha-touch-2.4.2/resources/css/sencha-touch.css

添加以下CSS以使用Windows主题

https://cdn.sencha.com/touch/sencha-touch-2.4.2/resources/css/cupertino.css

要查看效果，请尝试以下程序-

现场演示

这将产生以下结果-

iOS经典主题

考虑您的第一个Hello World应用程序。从应用程序中删除以下CSS-

https://cdn.sencha.com/touch/sencha-touch-2.4.2/resources/css/sencha-touch.css

添加以下CSS以使用Windows主题-

https://cdn.sencha.com/touch/sencha-touch-2.4.2/resources/css/cupertino-classic.css

要查看效果，请尝试以下程序-

现场演示

这将产生以下结果-

Android主题

考虑您的第一个Hello World应用程序。从应用程序中删除以下CSS。

https://cdn.sencha.com/touch/sencha-touch-2.4.2/resources/css/sencha-touch.css

添加以下CSS以使用Windows主题。

https://cdn.sencha.com/touch/sencha-touch-2.4.2/resources/css/mountainview.css

要查看效果，请尝试以下程序-

现场演示

这将产生以下结果-

黑莓主题

考虑您的第一个Hello World应用程序。从应用程序中删除以下CSS。

https://cdn.sencha.com/touch/sencha-touch-2.4.2/resources/css/sencha-touch.css

添加以下CSS以使用Windows主题。

https://cdn.sencha.com/touch/sencha-touch-2.4.2/resources/css/bb10.css

要查看效果，请尝试以下程序-

现场演示

这将产生以下结果-