sencha-touch-2 - Sencha Touch 2にxtypeディスプレイフィールドがないのはなぜですか？

Question

Extのドキュメントを見ると、xtypeの表示フィールドがありますが、SenchaTouchにはありません。Sencha Touch2のディスプレイフィールドに代わるものはありますか？

Answer 1

短編小説。いいえ、SenchaTouchにはそのようなコンポーネントはありません。

しかし、単純な純粋なHTMLに簡単に置き換えることができると確信しています。

Answer 2

テキストフィールドを使用して、彼を無効にすることができます。

yourTextField.setReadOnly(false);

Answer 3

' Ext.field.Field 'を拡張し、' Ext.Component 'を使用して、独自の表示フィールドを作成できます。ビューを作成する' 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;
    }
});

別のビューを作成する' 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
            }
        ];
    },
   });

アプリ構成のビューオブジェクトに「 DisplayField 」を追加します

views:[
'DisplayField'
]

xtype：'displayfield'を指定して、他のビューで使用します。