изменить цвет панели инструментов сенча сенсорный - PullRequest
1 голос
/ 17 ноября 2011

Я новичок в HTML5 и использую Sencha Touch. Пожалуйста, кто-нибудь, дайте мне полный пример того, как изменить цвет панели инструментов. Я пытался сделать это с помощью scss, но мне это не удалось. Спасибо за все ответы,

Код:

//wrapped with css tag

@include sencha-toolbar-ui('yellow', #E9D890, 'bevel');

var loginPanel = new Ext.Panel({
        fullscreen: true,


    items: [
      // add a panel to the root panel
      { 
        xtype: "form",
        renderTo: document.body,
        items: [
          {
            xtype: "textfield",
            name: "username",
            id:"txtusername",
            label: "Username",
            placeHolder: "your username here",

          },

          {
            xtype: "passwordfield",
            name: "password",
            id:"txtpassword",
            label: "Password",
            placeHolder: "your password here"  
          },
          {
             width:100,
             xtype:"button",
             iu:"action",
             text: "log in",
             handler:logIn

          }

        ]  
      }
    ],
    dockedItems: [
    {
        xtype:"toolbar",
        dock: "bottom",

        items: [
        {
            iconMask: true,
            iconCls:"team",
            handler:tapfbHandler,

        }
        ]

    },
    {
        xtype:'toolbar',
        dock:'top',
        title:'app name',
                    ui:'yellow'
            }]
});

Нужно ли включать какой-либо файл стиля? Спасибо.

1 Ответ

3 голосов
/ 17 ноября 2011

Сначала вы можете попробовать изменить интерфейс панели инструментов:

dockedItems: [
    {
        xtype:"toolbar",
        dock: "bottom",
        ui = "light",
        ...

Попробуйте.У вас также есть возможность настроить свой макет с определенным цветом.Я никогда не делаю этого, но в Интернете есть много документов:
http://www.sencha.com/blog/an-introduction-to-theming-sencha-touch http://existdissolve.com/2011/03/sencha-touch-theming-building-our-custom-stylesheet-with-sass http://superdit.com/2011/07/22/sencha-touch-references-and-tutorial-collection/

Вот документация для панели инструментов:
http://docs.sencha.com/touch/1-1/#!/api/Ext.Toolbar

дайте нам знать, что случилось

Редактировать: Чтобы скомпилировать ваш Scss (Saas), попробуйте это: compass compile path/to/scss вот хорошее руководство, все написано http://www.sencha.com/forum/showthread.php?127607-Mastering-the-Compass-SASS-Setup-with-Sencha-Touch

...