2011-12-05 73 views
1

我想在垂直佈局中放置兩個標籤,一個文本框和一個按鈕。 但是兩個標籤水平放置,而文本框和按鈕垂直放置。Sencha Touch - 水平放置標籤而不是垂直放置在面板中

label1 |標籤2 | textfield/button

我嘗試了各種佈局選項,但沒有幫助。我的佈局是否存在根本性錯誤? 有什麼建議嗎?

代碼面板:

Ext.define('MyApp.view.Demoview', { 
extend: 'Ext.Panel', 
xtype: 'demoview', 
fullscreen : false, 
config: { 
    items : [ { 
     docked : 'top', 
     xtype : 'toolbar', 
     title : 'A title' 
    }, { 
     xtype : 'panel', 
     layout : { 
      type : 'vbox', 
      pack : 'center', 
      align : 'center' 
     }, 
     defaults : { 
      margin : 5 
     }, 
     items : [ { 
      xtype : 'label', 
      styleHtmlContent: true, 
      height:'100px', 
      html : 'label 1' 
     }, { 
      xtype: 'label', 
      styleHtmlContent: true, 
      height: '100px', 
      html: 'label 2' 
     }, { 
      xtype : 'textfield', 
      label: 'Name', 
      required: true 
     }, { 
      xtype : 'button', 
      itemId : 'demoButton', 
      text : 'Button', 
      ui : 'round' 
     }] 
    } ] 
}}); 

他們嵌套卡布局的容器內:

Ext.define('MyApp.view.Main', { 
extend : 'Ext.Container', 
requires : [ 'MyApp.view.Someview', 'MyApp.view.Demoview'], 
config : { 
    fullscreen : false, 
    layout : 'card', 
    activeItem : 0, 
    items : [ { 
     layout : 'fit', 
     xtype : 'somview' 
    }{ 
     layout : 'fit', 
     xtype : 'demoview' 
    } 
] 
}}); 

回答

0

更新到Sencha Touch 2開發者預覽版3解決了我的問題。

1

您可以使用

labelAlign: '頂'

屬性將標籤垂直對齊textf ield。

+0

嗨,thx爲您的答覆。文本框和其標籤完美地工作。問題在於xtype:'label'!它們水平顯示爲大水平框,而不是垂直顯示在文本框和按鈕之上。 – karazy

相關問題