11.7.用HistoryManagement整合States視圖

2024-04-27 13:52:12

字體：大中小

供稿：網(wǎng)友

11.7.1. 問題
我想用Flex 框架的HistoryManagement 機(jī)制整合states。
11.7.2. 解決辦法
創(chuàng)建擴(kuò)展自IHistoryManagerClient 接口的應(yīng)用程序或組件。使用HistoryManagement 注冊應(yīng)用程序，當(dāng)state 改變時使用HistoryManager.save 方法保存當(dāng)前state。
11.7.3. 討論
IHistoryManager client 定義了以下方法：
loadState(state:Object):void
加載此對象的狀態(tài)
saveState():Object
保存此對象的狀態(tài)
toString():String
將此對象轉(zhuǎn)換為唯一的字符串

這些方法允許組件能正確的保存State 的任何信息，在需要時進(jìn)行還原。loadState 方法從存儲的URL 載入State 信息：

-ActionScript

public function saveState():Object {
trace(" save state ");
var state:Object = {};
state.lastSearch = lastSearch;
state.currentState = currentState;
return state;
}

loadState 方法接受和讀取從HistoryManager 中傳過來的object 中的State，并設(shè)置組件的currentState：

-ActionScript

public function loadState(state:Object):void {
if (state) {
trace(" last search "+state.lastSearch);
lastSearch = searchInput.text = state.lastSearch;
currentState = state.currentState;
}
}

完整代碼如下：

-XML

<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
implements="mx.managers.IHistoryManagerClient"
creationComplete=" HistoryManager.register(this)"
currentState="search">
<mx:Script>
<![CDATA[
import mx.managers.HistoryManager;
public function loadState(state:Object):void {
if (state!=null) {
trace(" last search "+state.lastSearch);
lastSearch = searchInput.text = state.lastSearch;
currentState = state.currentState;
}
}
// Save the current state and the searchString value.
public function saveState():Object {
trace(" save state ");
var state:Object = {};
state.lastSearch = lastSearch;
state.currentState = currentState;
return state;
}
// The search string value.
[Bindable]
public var lastSearch:String;
public function search():void {
lastSearch = searchInput.text;
currentState = "display";
HistoryManager.save();
}
public function reset():void {
trace(" reset ");
currentState = 'search';
searchInput.text = "";
lastSearch = "";
HistoryManager.save();
}
]]>
</mx:Script>
<mx:states>
<mx:State name="display">
<mx:SetProperty target="{panel}" name="title"
value="Results"/>
<mx:AddChild relativeTo="{panel}">
<mx:VBox id="results">
<mx:Text text="Getting Results"/>
<mx:Button label="Reset" click="reset()"/>
</mx:VBox>
</mx:AddChild>
</mx:State>
<mx:State name="search">
<mx:SetProperty target="{panel}" name="title"
value="Search"/>
<mx:AddChild relativeTo="{panel}">
<mx:HBox id="searchFields" defaultButton="{btn}">
<mx:TextInput id="searchInput" />
<mx:Button id="btn" label="Find"
click="search();" />
</mx:HBox>
</mx:AddChild>
</mx:State>
</mx:states>
<mx:Panel id="panel" title="Results" resizeEffect="Resize">
</mx:Panel>
</mx:Application>