sencha-touch-2 - 为什么 Sencha Touch 2 没有 xtype 显示域？

Question

如果您查看 Ext 文档，则有一个 xtype 显示字段，但在 Sencha Touch 中没有。Sencha Touch2中的displayfield有替代品吗？

Answer 1

You can create your own displayfield by extending 'Ext.field.Field' and using 'Ext.Component'. Create a view 'DisplayField'

Ext.define('<yourAppName>.view.DisplayField', {
    extend: 'Ext.field.Field',
    xtype: 'displayfield',
    requires: ['<yourAppName>.view.DisplayFieldComponent'],
    config: {
        component: {
            xtype: 'displayFieldComponent'
        }
    },
    setValue: function (value) {
       this.getComponent().displayElement.setHtml(value);
        return this;
    }
});

Create another view 'DisplayFieldComponent'

Ext.define('<yourAppName>.view.DisplayFieldComponent', {
    extend: 'Ext.Component',
    xtype: 'displayFieldComponent',
    config: {
        cls: 'x-field-input'
    },
    getTemplate: function () {
        return [
            {
                reference: 'displayElement',
                tag: 'div',
                style: 'padding:4px'//style it in your own way
            }
        ];
    },
   });

Add the 'DisplayField' in views object of you app configuration

views:[
'DisplayField'
]

Now use it in your other views by giving the xtype:'displayfield'

Answer 2

短篇小说。不，Sencha Touch 中没有这样的组件。

但我相信您可以轻松地将其替换为简单的纯 HTML。

Answer 3

您可以使用文本字段并禁用他：

yourTextField.setReadOnly(false);