Ext.Action
action實現一個脫離了容 器的事件,所有它可以在多個容器之間共享,不過好象只有Ext.Toolbar, Ext.Button 和 Ext.menu.Menu支持action接口:),因為容器要實現下面所有的方法setText(string), setIconCls(string), setDisabled(boolean), setVisible(boolean) and setHandler(function)

方法:
Action( Object config )
構造,config定義為{
disabled : Boolean,//禁止使用
handler : Function,//事件句柄
hidden : Boolean,//隱藏
iconCls : String,//樣式類
scope : Object, //handler將在哪個范圍內執行
text : String //文本
}

disable() : void
enable() : void
setDisabled( Boolean disabled ) : void
禁止/允許

each( Function fn, Object scope ) : void
為每個實現了此action的componet應用fn

hide() : void
show() : void
setHidden( Boolean hidden ) : void
顯示/隱藏

setHandler( Function fn, Object scope ) : void
setIconClass( String cls ) : void
setText( String text ) : void
重新設置config配置的屬性值

示例:



Ext.Button
簡單的按鈕類


公有屬性:
disabled : Boolean
允許?
hidden : Boolean
隱藏?
pressed : Boolean
按下?

方法 [繼承來的忽略]
Button( Object config )
構造可選config{
clickEvent : String,    //handler響應的事件,默認是click
cls : String,        //樣式
disabled : Boolean,    //禁止
enableToggle : Boolean,//允許在按下沒按下之間切換,添加移除x-btn-pressed樣式類
handleMouseEvents : Boolean,//允許使用移入移出按下事件,默認是真
handler : Function,    //響應clickEvent定義的事件
hidden : Boolean,    //隱藏
icon : String,        //圖標文件地址,如果修改x-btn-text-icon樣式類可以重定義默認icon
iconCls : String,    //和icon功能類似,但使用設定了background-image屬性的樣式定義
menu : Mixed        //如果需要,可以為按鈕定義菜單
menuAlign : String,    //菜單對齊方式,默認值是tl-bl
minWidth : Number,    //最小寬度
pressed : Boolean,    //是否按下
repeat : Boolean/Object,//是否需要重復定義鼠標按下事件,也可以是一個Ext.util.ClickRepeater配置對象
scope : Object,    //handler事件的范圍
tabIndex : Number,    //table鍵順序
text : String,        //文本
toggleGroup : String,    //如果定義一組enableToggle為真且toggleGroup值相同的button對象,這些對象同一時間內將只有一個處于按下狀態
tooltip : String/Object, //提示信息,可以是一個字符串或QuickTips的配置對象
tooltipType : String,    //可選值"qtip"(默認)或"title"之一
type : String        //可選值"submit"/"reset"/"button"(默認)之一
}


focus() : void
//得到焦點

getText() : String
//取得文本

hasVisibleMenu() : Boolean
//有可視的菜單?
hideMenu() : void
//隱藏菜單
initComponent() : void
//初始化容器
setHandler( Function handler, [Object scope] ) : void
//設置事件處理方法
setText( String text ) : void
//設置文本
showMenu() : void
//顯示菜單
toggle( [Boolean state] ) : void
//切換按下狀態


示例:


Ext.SplitButton
上例中的帶菜單按鈕還不專業,于是有了Ext.SplitButton,專門為帶有下拉菜單的按鈕設計的


方法:
SplitButton( Object config )
構造,config中加入了{
arrowHandler : Function,
arrowTooltip : String
}

setArrowHandler( Function handler, [Object scope] ) : void
設置下拉箭頭的點擊事件

事件:
arrowclick : ( MenuButton this, EventObject e )


使用示例:
比如上例中的菜單按鈕可以改為

function onItemCheck(item){
Ext.MessageBox.alert("點擊事件",String.format("您選擇了{0}",item.text));
}
function showMenu(obj){
Ext.MessageBox.alert("點擊下拉",obj.getXTypes() )
}

Ext.QuickTips.init();
var button=new Ext.SplitButton({
    renderTo:Ext.getBody(),
    arrowHandler : showMenu,
    handler: onItemCheck,
    arrowTooltip : "更多",
    text:'按我',
    menu:'mainMenu'
});

Ext.CycleButton
這是一個SplitButton的實用子類,用于在多個item之間切換狀態,當然它也會帶有menu可供選擇,也可以直接點擊按鍵在item之間切換




方法:
CycleButton( Object config )
構造,config新增配置項{
changeHandler : Function,    //狀態切換時的處理事件
items : Array, //items應該是menu item的數組
prependText : String,    //前導text
showText : Boolean,    //追加item的text到按鈕顯示
}

getActiveItem() : Ext.menu.CheckItem
setActiveItem( Ext.menu.CheckItem item, Boolean suppressEvent ) : void
得到/設置活動選項
toggleSelected() : void
切換選擇項,相當于點擊一次按鈕

示例

new Ext.CycleButton({
    renderTo:Ext.getBody(),
    showText: true,
    prependText: 'View as ',
    items: [{
        text:'text only',
        iconCls:'view-text',
        checked:true
    },{
        text:'HTML',
        iconCls:'view-html'
    },{
        text:'XML',
        iconCls:'view-html'
    }
    ],
    changeHandler:function(btn, item){
        Ext.MessageBox.alert('Change View', item.text);
    }
});