Javascript Sencha Architect-使用表单创建屏幕

Javascript Sencha Architect-使用表单创建屏幕,javascript,sencha-touch,extjs,sencha-touch-2,sencha-architect,Javascript,Sencha Touch,Extjs,Sencha Touch 2,Sencha Architect,刚开始看森查触摸 有人能解释一下你们在哪里使用“字段集、FormPanel和容器”吗 例如:带有标题、文本字段和提交按钮的表单 登录屏幕 Title: Login TextField: username PasswordField: password Button: submit 1) 此登录屏幕是否位于容器、字段集和/或formpanel中 2) 没有标题的表格怎么样?只需文本字段、按钮或带有标题、数据列表的屏幕?我认为示例代码将对您有所帮助: Ext.define('MyApp.vie

刚开始看森查触摸

有人能解释一下你们在哪里使用“字段集、FormPanel和容器”吗

例如:带有标题、文本字段和提交按钮的表单

登录屏幕

Title: Login
TextField: username
PasswordField: password
Button: submit  
1) 此登录屏幕是否位于容器、字段集和/或formpanel中


2) 没有标题的表格怎么样?只需文本字段、按钮或带有标题、数据列表的屏幕?

我认为示例代码将对您有所帮助:

Ext.define('MyApp.view.LoginSiteContainer', {
extend: 'Ext.form.Panel',
alias: 'widget.loginsitecontainer',

config: {
    id: 'loginform',
    url: 'som_url',
    items: [            
        {
            xtype: 'container',
            layout: {
                type: 'vbox'
            },
            items: [
                {
                    xtype: 'fieldset',
                    instructions: 'Login using existing account. Password is case sensitive.',
                    title: 'Login details',
                    items: [
                        {
                            xtype: 'textfield',
                            id: 'login',
                            itemId: 'login',
                            label: 'Login'
                        },
                        {
                            xtype: 'passwordfield',
                            id: 'password',
                            itemId: 'password',
                            label: 'Password'
                        }
                    ]
                },
                {
                    xtype: 'panel',
                    layout: {
                        type: 'hbox'
                    },
                    items: [
                        {
                            xtype: 'button',
                            id: 'Login',
                            itemId: 'Login',
                            margin: '0.1em',
                            ui: 'confirm',
                            text: 'Login',
                            flex: 1
                        }
                    ]
                }
            ]
        }
    ],
    listeners: [            
        {
            fn: 'onLoginTap',
            event: 'tap',
            delegate: '#Login'
        }
    ]
},


onLoginTap: function(button, e, options) {
// login function here
}
}))