当前位置: 代码迷 >> Web前端 >> (转)应用web浏览器的“后退”和“前进”在flex程序中导航。HistoryManager实例
  详细解决方案

(转)应用web浏览器的“后退”和“前进”在flex程序中导航。HistoryManager实例

热度:95   发布时间:2012-10-11 10:16:10.0
(转)使用web浏览器的“后退”和“前进”在flex程序中导航。HistoryManager实例
转:http://blog.csdn.net/xiang08/archive/2009/09/15/4555290.aspx
借助历史记录管理,用户可以使用 Web 浏览器的“后退”和“前进”导航命令在 Flex 应用程序中导航。

通常情况下,应使用 BrowserManager 类和深层链接来维护应用程序中的状态并处理 URL 和浏览器历史记录,但 HistoryManager 类在某些情况下会很有用,如维护旧版 Flex 应用程序时。无法在同一个 Flex 应用程序中同时使用 HistoryManager 类和 BrowserManager 类,即使二者使用同一组支持文件也不例外。

默认情况下,对 Accordion 和 TabNavigator 容器启用历史记录管理功能。这意味着,如果用户选择了 Accordion 控件中的某个窗格,则可以使用浏览器的“后退”按钮或后退导航命令返回到前一个窗格。默认情况下,对 ViewStack 导航器容器禁用历史记录管理功能。

可通过将导航器容器的 historyManagementEnabled 属性设置为 false 来禁用历史记录管理。

还可以向 HistoryManager 注册应用程序中的其它对象,从而对这些对象启用历史记录管理功能。要向 HistoryManager 类注册一个组件,需要调用 HistoryManager 类的 register() 方法,同时引用实现 IHistoryManagerClient 接口的组件实例。在以下示例中,在初始化 Application 组件 (this) 时将向 HistoryManager 类注册此组件:

<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
    implements="mx.managers.IHistoryManagerClient"
    initialize="mx.managers.HistoryManager.register(this);">
还必须实现 IHistoryManagerClient 接口的 saveState() 和 loadState() 方法才能完成组件的注册。扩展 UIComponent 的组件会自动继承 loadState() 方法。
HistoryManager 中的所有方法和属性都是静态的,因此不需要为其创建实例。

以下是一个简单的例子:
<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" implements= "mx.managers.IHistoryManagerClient" creationComplete="initApp();">
<!-- 实现IHistoryManagerClient接口 -->
<mx:Script>
<!--[CDATA[
	import mx.managers.HistoryManager;
	public function loadState(state:Object):void {
		//对视图模式进行判断,若没有指定视图模式则进入基本视图模式
		if (state) {
			currentState = state.currentState;
			searchString = searchInput.text = state.searchString;
		}
		else {
			currentState = '';
		}
	}
	public function saveState():Object {
		//保存视图模式,记录当前状态
		var state:Object = {};
		state.currentState = currentState;
		state.searchString = searchString;
		return state;
	}
	[Bindable]
	public var searchString:String;
	public function initApp():void {
		HistoryManager.register(this);
		//注册到HistoryManager
	}
	public function doSearch():void {
		currentState = "results";
		searchString = searchInput.text;
		HistoryManager.save();
		//视图模式切换后执行状态保存
	}
	public function reset():void {
		currentState = '';
		searchInput.text = "";
		searchString = "";
		HistoryManager.save();
		//视图模式切换后执行状态保存
	}
]]-->
</mx:Script>
<mx:states>
	<mx:State name="results">
		<mx:SetProperty target="{p}" name="width" value="400" />
		<mx:SetProperty target="{p}" name="height" value="300" />
		<mx:SetProperty target="{p}" name="title" value="搜索结果页" />
		<mx:AddChild relativeTo="{searchFields}">
			<mx:Button label="返回" click="reset()" />
		</mx:AddChild>
		<mx:AddChild relativeTo="{p}">
			<mx:Label text="搜索结果: {searchString}" />
		</mx:AddChild>
	</mx:State>
</mx:states>
<mx:Panel id="p" title="搜索引擎首页" resizeEffect="Resize" fontSize="12">
	<mx:HBox id="searchFields" defaultButton="{b}">
		<mx:TextInput id="searchInput" />
		<mx:Button id="b" label="搜索" click="doSearch();" />
	</mx:HBox>
</mx:Panel>
</mx:Application>

Flex4中ViewStack与浏览器历史记录整合不起作用的解决方法
那个“historyManagementEnabled”属性不起作用的原因是因为它使用了HistoryManager类。这个类在Flex4里面是不建议使用的,Adobe推荐使用BrowserManager类来进行历史记录整合。
在Application中增加一句:
<fx:Script>  
        <![CDATA[ public var historyManagementEnabled : Boolean=true; ]]>  
</fx:Script>