Ext JS 6近代的なツールキットタイムピッカーフィールド？

Question

Datetimepickerのようなtime picker fieldフィールドがExt JS 6の最新のツールキットにありますか？私はSencha touch 2 Time Pickerフィールドをコピーしましたが、Ext JS 6の現代的なアプリケーションでは機能しません。どんな解決策ですか？だからここ

Answer 1

は、私は今、ファイル

で怒鳴るのコードを貼り付けEXT /現代/近代/ SRC /フィールド/ TimePicker.jsに

をファイルを作成します

思い付いたものです

Ext.define('Ext.field.TimePicker', { 
extend: 'Ext.field.Text', 
alternateClassName: 'Ext.form.TimePicker', 
xtype: 'timepickerfield', 

requires: [ 
    'Ext.field.trigger.Clear' 
], 
setMe: function(t){ 
    this.val = t; 
}, 
getMe: function(){ 
    return this.val; 
}, 
initialize: function (a, b, c) { 
    var me = this; 
    me.getComponent().on({ 
     keyup: 'onKeyUp', 
     input: 'onInput', 
     focus: 'onFocus', 
     blur: 'onBlur', 
     paste: 'onPaste', 
     mousedown: 'onMouseDown', 
     scope: this 
    }); 
}, 

listeners: { 
    focus: function (a, b, c, d) { 
     var me = this, 
      hours = new Array(), 
      minutes = new Array(), 
      seconds = new Array(), 
      i=0; 
     // for hours 
     while(i < 24){ 
      var j = i; 
      if(i < 10) j = '0'+''+j; 
      hours.push({ 
       text: j, 
       value: j 
      }); 
      i++ 
     } 

     // for minutes 
     i = 0; 
     while(i < 60){ 
      var j = i; 
      if(i < 10) j = '0'+''+j; 
      minutes.push({ 
       text: j, 
       value: j 
      }); 
      i += 5; 
     } 

     // for Seconds 
     i = 0; 
     while(i < 60){ 
      var j = i; 
      if(i < 10) j = '0'+''+j; 
      seconds.push({ 
       text: j, 
       value: j 
      }); 
      i += 5; 
     } 

     var picker = Ext.create('Ext.Picker', { 
      useTitles: true, 
      listeners: { 
       change: function (picker, value, eOpts) { 

        me.setValue(value.hour + ':' + value.minute + ':' + value.second); 
       } 
      }, 
      align: 'center', 
      slots: [{ 
       xtype: 'spacer' 
      },{ 
       name: 'hour', 
       title: 'Hour', 
       data: hours 
      }, { 
       name: 'minute', 
       title: 'Minute', 
       data: minutes 
      },{ 
       name: 'second', 
       title: 'Second', 
       data: minutes 
      },{ 
       xtype: 'spacer' 
      }] 
     }); 

     picker.show(); 
    } 
} 

}); 

、他の分野と同様に

{ 
xtype: 'timepickerfield', 
name: 'time', 
label: 'Time', 
    // other field options 
}, 

をどこでそれを使用します