Ext问题，请各位帮帮忙

Question

这是一个现有系统用Ext JS做出来的效果，我不会做啊，据说是用xtype为numberfield做出来的。请各位大虾帮帮忙。

Answer 1

这个很简单, 每次生成控件的时候可以都不用new, 我是这样认为的. 因为 框架升级的时候方便一点. 不用改创建方式var textname = {xtype : 'numberfield' ,
 text  : '100'
 }new Ext.Panel ({
 
 appto : 'xxxx' ,
 items : textname 
})

Answer 2

补充 : xtype 就是渲染成什么样子. 没什么特别的. 用 json 和 用new 的效率是一样的. 但是升级框架的时候. 创建控件的方式可能不一样,. 就是Ext 3.3  升 到4.01 一样但是xtype 就不一样的. 这个 在3.3  , 4.01 都可以用.. 只是有一些木头了

Answer 3

可能我写的不是太详细，我就是要那个最右边点一下增加1再点一下减小1的效果，我用的是ext-2.3.0版本的。

Answer 4

这个控件是  ux 扩展控件. 不能用xtype 出来的呀

Answer 5

那需要引用ux中的哪个js文件呢？

Answer 6

Ext 2.3 我没有接触过.但是在3.3 里面是有这样的玩意的{
             xtype: 'spinnerfield',
             fieldLabel: 'Test',
             name: 'test',
             minValue: 0,
             maxValue: 100,
             allowDecimals: true,
             decimalPrecision: 1,
             incrementValue: 0.4,
             alternateIncrementValue: 2.1,
             accelerate: true
            }
但是你需要引用 SpinnerField.js  和 Spinner.js  还有 Spinner.css

Answer 7

官方 demo 的代码    var simple = new Ext.FormPanel({
        labelWidth: 40, // label settings here cascade unless overridden
        frame: true,
        title: 'Simple Form',
        bodyStyle: 'padding:5px 5px 0',
        width: 210,
        defaults: {width: 135},
        defaultType: 'textfield',        items: [
            new Ext.ux.form.SpinnerField({
                fieldLabel: 'Age',
                name: 'age'
            }),
            {
             xtype: 'spinnerfield',
             fieldLabel: 'Test',
             name: 'test',
             minValue: 0,
             maxValue: 100,
             allowDecimals: true,
             decimalPrecision: 1,
             incrementValue: 0.4,
             alternateIncrementValue: 2.1,
             accelerate: true
            }
        ]
    });

Answer 8

这个控件叫SpinnerField 
xtype 是 'spinnerfield'
可以通过这么引用
{
  xtype: 'spinnerfield',
  fieldLabel: 'Test',
  name: 'test',
  minValue: 0,
  maxValue: 100,
  allowDecimals: true,
  decimalPrecision: 1,
  incrementValue: 0.4,
  alternateIncrementValue: 2.1,
  accelerate: true
  }
引用的同时需要引入相关的js 和css 
  <link rel="stylesheet" type="text/css" href="../ux/css/Spinner.css" />
  <script type="text/javascript" src="../ux/Spinner.js"></script>
  <script type="text/javascript" src="../ux/SpinnerField.js"></script>