按鈕倒是工具欄

當我在工具欄上停靠按鈕右側的邊框，它開始接觸到工具欄這樣的上緣：按鈕倒是工具欄

enter image description here

這裏是我的代碼：

Ext.define('MyApp.view.MyFormPanel', { 
    extend: 'Ext.form.Panel', 

    config: { 
     items: [ 
      { 
       xtype: 'textfield', 
       label: 'Field' 
      }, 
      { 
       xtype: 'textfield', 
       label: 'Field' 
      }, 
      { 
       xtype: 'toolbar', 
       docked: 'bottom', 
       items: [ 
        { 
         xtype: 'button', 
         ui: 'back', 
         text: 'Back' 
        }, 
        { 
         xtype: 'button', 
         docked: 'right', 
         ui: 'forward', 
         text: 'Continue' 
        } 
       ] 
      } 
     ] 
    } 

});

來源

2012-10-22 Adil Malik

你可以發佈你的當前代碼嗎？ – Eli

@ user1479606我已將代碼添加到問題中。 –

我曾經有同樣的問題，但我解決了它！你用，就像我一樣，xtype: 'toolbar'停靠你的按鈕。你必須使用什麼是

xtype: 'titlebar'

現在，如果你有一些按鈕，在你的標題欄，只需設置align屬性，像這樣：

xtype: 'titlebar', 
items: [ 
     { 
     xtype: 'button', 
     ui: 'back', 
     text: 'Back', 
     align: 'left' 
     }, 
     { 
     xtype: 'button', 
     ui: 'forward', 
     text: 'Continue', 
     align: 'right' 
     } 
]

檢查煎茶文檔的更多信息：Ext.TitleBar

來源

2012-11-15 13:21:39 weerd2

同樣的行爲在這裏，而不是停靠在右邊我使用正確的：10px ;.

這可能是由元素變成position：absolute引起的。沒有一個解決方案可以防止這種情況發生，但是當然你可以通過設置top：.. px來修正它。
如果你有很多像這樣的按鈕，使用一個CSS類來設置它。

來源

2012-10-23 07:54:50

同樣的行爲在這裏，而不是停靠在右邊我用右：10px ;.

也請了Sencha Touch Forum

來源

2012-10-23 08:00:34

好這個報告，我不知道有沒有錯誤或沒有，但你可以通過刪除您docked: 'right'並添加這樣你的兩個按鈕之間的xtype: spacer嘗試不同的方式：

items: [ 
    { 
     xtype: 'button', 
     ui: 'back', 
     text: 'Back' 
    }, 
    { 
     xtype: 'spacer' 
    }, 
    { 
     xtype: 'button', 
     ui: 'forward', 
     text: 'Continue' 
    } 
]

的Ext.Spacer組分通常用來放項之間空間Ext.Toolbar組件。

你可以在他們的文檔中找到關於spacerhere的更多信息和示例。希望它有幫助:)

來源

2012-10-25 03:47:19 Eli

按鈕倒是工具欄

回答

相關問題