Swiz-快速上手
简单配置
再视图中可以这样声明swiz：定义BeanProvider和一些配置属性
<s:Application
xmlns:fx="http://ns.adobe.com/mxml/2009" xmlns:s="library://ns.adobe.com/flex/spark"
xmlns:view="org.swizframework.quickswiz.view.*" xmlns:config="org.swizframework.quickswiz.config.*"
xmlns:swiz="http://swiz.swizframework.org">
<fx:Declarations>
<swiz:Swiz>
<!-- 可以直接在beanProviders中定义bean，也可以定义非视图的bean组件 -->
<swiz:beanProviders>
<config:Beans />
</swiz:beanProviders>
<swiz:loggingTargets>
<swiz:SwizTraceTarget id="myTraceTarget" />
</swiz:loggingTargets>
<swiz:config>
<!-- The eventPackages 是事件类的包路径,and viewPackages 可选择项，是视图组件的包路径. -->
<swiz:SwizConfig
eventPackages="org.swizframework.quickswiz.event.*"
viewPackages="org.swizframework.quickswiz.view.*" />
</swiz:config>
</swiz:Swiz>
</fx:Declarations>
<s:layout>
<s:VerticalLayout horizontalAlign="center" paddingTop="20" />
</s:layout>
<view:UserForm id="userForm" />
</s:Application>
非视图组件可以这样声明swiz
<swiz:BeanProvider
xmlns:swiz="http://swiz.swizframework.org" xmlns:service="org.swizframework.quickswiz.service.*"
xmlns:controller="org.swizframework.quickswiz.controller.*">
<service:UserService id="userService"/>
<controller:UserController id="userController"/>
<!-- 通过servicehelper 与服务端 -->
<swiz:ServiceHelper id="serviceHelper" />
</swiz:BeanProvider>
依赖注入，事件控制，服务端交互
通过[Inject]标识 依赖注入
package org.swizframework.quickswiz.controller
{
import org.swizframework.quickswiz.model.User;
import org.swizframework.quickswiz.service.UserService;
public class UserController
{
[Inject]
public var userService : UserService;
[Bindable]
public var currentUser : User;
}
}
不仅可以注入一个类，还以注入类中自己的属性。下面的UserForm没有必要在BeanProvider中声明。因为先前已经在配置里面定义了视图的包路径，所以swiz会自动扫描处理注释。
<s:Panel
xmlns:fx="http://ns.adobe.com/mxml/2009" xmlns:s="library://ns.adobe.com/flex/spark"
xmlns:mx="library://ns.adobe.com/flex/mx">
<fx:Script>
<![CDATA[
import org.swizframework.quickswiz.event.UserEvent;
import org.swizframework.quickswiz.model.User;
[Bindable]
[Inject( source="userController.currentUser", bind="true" )]
/**
* 既可以注入整个controller实例，也可以注入controller实例中的currentUser属性
*/
public var user : User;
]]>
</fx:Script>
<mx:Form>
<mx:Text id="userId" text="{isNaN( user.id ) ? 'N/A' : user.id}" />
<s:TextInput id="firstName" text="{user.firstName}" />
<s:TextInput id="lastName" text="{user.lastName}" />
<s:TextInput id="email" text="{user.email}" />
<s:Button label="Save" />
</mx:Form>
</s:Panel>
派发和处理事件
<s:Panel
xmlns:fx="http://ns.adobe.com/mxml/2009" xmlns:s="library://ns.adobe.com/flex/spark"
xmlns:mx="library://ns.adobe.com/flex/mx">
<fx:Script>
<![CDATA[
import org.swizframework.quickswiz.event.UserEvent;
import org.swizframework.quickswiz.model.User;
[Bindable]
[Inject( source="userController.currentUser", bind="true" )]
/**
* We could inject the whole controller instance, but we only need
* one property from the controller, the current user, so we just
* inject that property.
*/
public var user : User;
/**
* 这里派发的是一个标准的Flex事件，不是swiz特有的。
*/
private function saveUser() : void
{
user.firstName = firstName.text;
user.lastName = lastName.text;
user.email = email.text;
var event : UserEvent = new UserEvent( UserEvent.SAVE_USER_REQUESTED );
event.user = user;
dispatchEvent( event );
}
]]>
</fx:Script>
<mx:Form>
<mx:Text id="userId" text="{isNaN( user.id ) ? 'N/A' : user.id}" />
<s:TextInput id="firstName" text="{user.firstName}" />
<s:TextInput id="lastName" text="{user.lastName}" />
<s:TextInput id="email" text="{user.email}" />
<s:Button label="Save" click="saveUser()" />
</mx:Form>
</s:Panel>
UserEvent的代码，唯一注意的是把bubbles设置为true，才可以让swiz捕获。在下面的例子中，controller中添加了一个事件处理方法。
package org.swizframework.quickswiz.event
{
import org.swizframework.quickswiz.model.User;
import flash.events.Event;
public class UserEvent extends Event
{
public static const SAVE_USER_REQUESTED : String = "saveUser";
public var user : User;
/**
* This is just a normal Flex event. The only thing to note is that we set 'bubbles' to true,
* so that the event will bubble up the display list, allowing Swiz to listen for your events.
*/
public function UserEvent( type:String )
{
super( type, true );
}
}
}
上面知道了如何派发事件，下面看下如何处理事件。swiz提供了[EventHandle]的注释。当有UserEvent.SAVE_USER_REQUESTED类型的事件发生时，swiz会自动调用controller中的saveuser的方法，并且会把user当做参数传入。
package org.swizframework.quickswiz.controller
{
import org.swizframework.quickswiz.model.User;
import org.swizframework.quickswiz.service.UserService;
public class UserController
{
[Inject]
public var userService : UserService;
[Bindable]
public var currentUser : User;
[PostConstruct]
/**
* [PostConstruct] 注释是表示所有依赖都注入完成后调用的方法。
* 这个例子表示所有依赖注入完成后会new user的实例
*/
public function createDefaultUser() : void
{
currentUser = new User();
}
[EventHandler( event="UserEvent.SAVE_USER_REQUESTED", properties="user" )]
/**
* Perform a server request to save the user
*/
public function saveUser( user : User ) : void
{
// TODO: Add server interaction
}
}
}
当非视图组件例如controller和service派发事件时，应该怎么做？swiz提供[Dispatcher]注释使用。
package org.swizframework.quickswiz.service
{
import org.swizframework.quickswiz.model.User;
import flash.events.IEventDispatcher;
import mx.rpc.AsyncToken;
import org.swizframework.utils.services.MockDelegateHelper;
public class UserService
{
[Dispatcher]
/**
* 通过[Dispatcher]注入一个事件派发器.
* 通过派发器触发相关的 [EventHandler].
*/
public var dispatcher : IEventDispatcher;
/**
* 避免与服务器的依赖 我们可以使用 Swiz helper class 创建一个模拟的AsyncTokens
*/
private var mockHelper : MockDelegateHelper;
public function UserService()
{
mockHelper = new MockDelegateHelper();
}
/**
* 一般在应用中，我们需要调用 RemoteObject, HTTPService, etc.
*/
public function saveUser( user : User ) : AsyncToken
{
user.id = Math.round( Math.random() * 100 );
return mockHelper.createMockResult( user );
}
}
}
与服务器交互
现在controller可以相应保存user的事件了，最后一步就是请求后台服务器包user保存到数据库中。一般来说是自己构造请求，并处理ResultEvent和FaulEvent事件。Swiz可以简化这些流程。下面的controller中你可以看到Swiz自己的类 ServiceHelper已经注入，可以调用executeServiceCall方法该方法将自动获得AsyncToken RPC调用和创建响应者对象。下面即调用userService中的saveUser方法
package org.swizframework.quickswiz.controller
{
import org.swizframework.quickswiz.model.User;
import org.swizframework.quickswiz.service.UserService;
import mx.controls.Alert;
import mx.rpc.events.ResultEvent;
import org.swizframework.utils.services.ServiceHelper;
public class UserController
{
[Inject]
public var userService : UserService;
[Inject]
public var serviceHelper : ServiceHelper;
[Bindable]
public var currentUser : User;
[PostConstruct]
/**
* [PostConstruct] methods are invoked after all dependencies are injected.
* In this example, we set up a default user after the bean is created.
*/
public function createDefaultUser() : void
{
currentUser = new User();
}
[EventHandler( event="UserEvent.SAVE_USER_REQUESTED", properties="user" )]
/**
* Perform a server request to save the user
*/
public function saveUser( user : User ) : void
{
serviceHelper.executeServiceCall( userService.saveUser( user ), handleSaveUserResult );// handleSaveUserResult 是成功请求后的回调函数
}
/**
* Handle the server call result
*/
private function handleSaveUserResult( event : ResultEvent ) : void
{
// Show an Alert just to make it obvious that the save was successful.
Alert.show( 'User saved successfully!' );
}
}
}