Ext Js（4.2）Form

      //Define window form
      var winform = Ext.create("Ext.form.Panel",
      {
         defaults: { anchor: '100%' },
         width: 300,//定义该Form的宽度
         fieldDefaults://定义该Form的字段默认配置
            {
               labelWidth: 80,//默认宽度80
               labelAlign: "left",//默认为左对齐
               flex: 1,//默认相对宽度
               margin: 5//默认边距为5
            },
         items: [//定义该Form的内容
                     {
                        xtype: "container",//定义容器
                        layout: "hbox",//定义布局为Hbox
                        items: [
                                    { xtype: "radio", name: 'radio', id: 'reRadio', boxLabel: "Rename",//定义Radio
                                       listeners://定义该Radio监听Change事件
                                             {
                                                change: function () {
                                                   var reRadio = Ext.getCmp('reRadio');
                                                   var newGroupName = Ext.getCmp('newGroupName');
                                                   var newSave = Ext.getCmp('newSave');
                                                   var reGroupName = Ext.getCmp('reGroupName');
                                                   var reSave = Ext.getCmp('reSave');
                                                   if (reRadio.getValue()) {
                                                      reGroupName.setDisabled(false);
                                                      newGroupName.setDisabled(true);
                                                      newSave.removeCls('visible');
                                                      newSave.addCls('hide');
                                                      reSave.removeCls('hide');
                                                      reSave.addCls('visible');
                                                      reGroupName.focus();
                                                   }
                                                }
                                             }
                                    },
                                    { xtype: "textfield", id: 'reGroupName', disabled: true },//定义Text
                                    { xtype: 'label', id: 'reSave', cls: 'hide', html: '<a  οnclick="' + _.friendsName + '.reGroupName()">Save</a>', margin: '10 50 0 5' }//定义Label
                                 ]
                     },
                        {
                           xtype: "container",
                           layout: "hbox",
                           items: [
                                       { xtype: "radio", name: 'radio', id: 'newRadio', checked: true, boxLabel: "New",
                                          listeners:
                                                {
                                                   change: function () {
                                                      var newRadio = Ext.getCmp('newRadio');
                                                      var newGroupName = Ext.getCmp('newGroupName');
                                                      var newSave = Ext.getCmp('newSave');
                                                      var reGroupName = Ext.getCmp('reGroupName');
                                                      var reSave = Ext.getCmp('reSave');
                                                      if (newRadio.getValue()) {
                                                         reGroupName.setDisabled(true);
                                                         newGroupName.setDisabled(false);
                                                         reSave.removeCls('hide');
                                                         newSave.addCls('visible');
                                                         reSave.removeCls('visible');
                                                         reSave.addCls('hide');
                                                         newGroupName.focus();
                                                      }
                                                   }
                                                }
                                       },
                                       { xtype: "textfield", id: 'newGroupName', disabled: false },
                                       { xtype: 'label', id: 'newSave', cls: 'visible', html: '<a οnclick="' + _.friendsName + '.newGroupName()">Save</a>', margin: '10 50 0 5' }
                                    ]
                        }
                  ]
      });

Ext.create("Ext.form.Panel",{}):定义Form，在｛｝中添加Form的配置；
defaults:定义Form的默认设置；
width:定义Form的宽度；
fieldDefaults:定义Form字段的默认设置；
items: [ ]定义Form包含的内容；
xtype:定义类型；
layout: 定义布局；
listeners:定义该监听事件；

更多学习内容，可参考本人的博文：《学习博客、网站》