EXT Primary UI Design

Ext.button

Description: This component replaces the traditional Submit,reset,buuton HTML control
Construction Parameters:
Text: Name on the button
Handler: Specifies a function handle that is invoked when the default event is triggered, at which point the default event is click
Listeners: the means by which a series of events are defined before object initialization is particularly useful in component programming

Property:
Text: Gets the name on the current button
MinWidth: Minimum width of the button
Renderto: Stores the HTML object generated by the current object into the specified object

Method:
SetText: Set the name on the button
Event:
Click: triggers when Clicked

Ext.form.TextField

Description: This component replaces the traditional text component

Property:
Fieldlabel: Label name for text box

Method:
GetValue (): Gets the value of the current text box

Form. The topic of TextField generation

Ext.layout.FormLayout:
The label name of the file frame can be displayed correctly only under some layouts, and the host object of the layout must be a subclass of Ext.container or Ext.container
When you apply a formlayout layout, simply specify layout in the constructor parameters of the host object: "Form"
EXT.GETCMP (string _id):
Get the Component object with ID _id

Ext.panel

Description: In a sense, it completely changed the Web interface is the history of HTML table.

Property:
Title: The label name of the panel
Width: thickness of panel
Heigth: Height of panel
Frame: turns Four corners into rounded corners, true when
Xtype: There is a xtype mechanism in the visual component deployment of ExtJS that initializes the containing component, such as xtype: "TextField", by specifying the value of the xtype to initialize with Ext.form.TextField

Method:
AddButton (String/object_config,function _handler,object_scope): Add a Button object to the panel
Add (ext.component/object_component): Adds a component to the panel

Event:
Render: Fires when the current object is correctly constructed

Comprehensive examples

Structuring by constructing parameter methods

Defaults: Default Parameters
Items: Specify the configuration array for the components contained in the panel
Buttons: Specifies the configuration array of the buttons contained in the toilet

As follows:

      Ext.onready (function  () {        varnew  ext.panel ({        "personnel Information",         true ,         "Form",        "TextField", "width:200"                         }, "name"}, {fieldlabel: "Address"}],        "OK"}, {text: "Cancel"}]);                 _panel.append (Ext.getbody ());     });

Ext.window

Description: This component is the basis for implementing forms development
Construction Parameters:
Title: Form Name
Minimizable: Whether to display the Minimize button
Maximizable: Whether to display the Maximize button

Method:
Show: Make the window display
Hide: Hiding windows

Event:
Hide: triggered when window is hidden
Show: Trigger When window appears

Instance:

Ext.onready (function () {            var_window =NewExt.window ({title:Landing, Frame:true, Width:260, Height:130, layout:"Form", Labelwidth:45, Plain:true, resizable:false, Bodystyle:"Padding:3px", Buttonalign:"Center", Closeaction:"Hide", defaults: {xtype:"TextField", width:180}, items: [{fieldlabel:"Account"}, {fieldlabel: "password"}], buttons: [{text:"OK"}, {text: "Cancel", Handler:function() {_window.hide (); }}], listeners: {"Show":function() {alert ("Form Display"); },                    "Hide":function() {alert (Form Hide); },                    "Close":function() {alert ("Form Close");            }                }            });        _window.show (); });

Datefield Date Selection

Format: Generation format After date selection, such as: "y-m-d" equals "2012-08-05"
Value: Default value
ReadOnly: Whether read-only

ComboBox drop-down list

Mode: Data source model, local locally, remote as default
TriggerAction: Displays all values (all) or only the selected values (query) after clicking the drop-down box
Displayfield: The name of the underlying data item bound to the current Bombobox
Store: Data source

EXT Primary UI Design