Question

我想在垂直布局中放置两个标签，一个文本字段和一个按钮。但是两个标签水平放置，而文本字段和按钮垂直放置。

label1 |标签2 |文本框/按钮

我尝试了各种布局选项，但没有帮助。我的布局有根本错误吗？有什么建议吗？

专家组代码：

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'
    } 
]
}});

Answer 1

您可以使用

<强> labelAlign： '顶部'

属性，用于将标签垂直对齐在文本字段上方。

Answer 2

更新到Sencha Touch 2开发者预览版3解决了我的问题。

Sencha Touch - 标签水平放置而不是垂直放置在面板中

2 个答案: