重点介绍views:ControlBar
组件分析:
一、
相当于注册一个新的自定义事件,事件类型查找到包net.shangle.events下的NavEvent。<fx:Metadata> [Event(name="navChanged",type="net.shangle.events.NavEvent")] </fx:Metadata>
二、
<fx:Script> <![CDATA[ //导入包略 //变量声明略 private function init() : void { getMusicList(); } private function createToolTips(event : ToolTipEvent) : void { //创建按钮ToolTip并设置过渡效果 } private function mouseMoveHandler(event : MouseEvent) : void { //鼠标移动时ToolTip的坐标 } private function positionToolTips(event : ToolTipEvent) : void { //ToolTip显示时的定位 } private function getMusicList() : void { //设置音乐播放列表并播放 } private function randomMusic() : String { //随机播放音乐列表中的某条 } private function musicToggle() : void { //音乐的关闭和开启 } private function playMusic(event : Event) : void { //音乐播放事件实现 } private function clickHandler(event : MouseEvent , value : String) : void { //按钮的CLICK事件响应,根据传进来的value进行不同的处理 //以下两行代码比较重要,根据前面fx:MetaData的事件注册来生成新的事件,并做了dispatchEvent广播该事件,用来在Home.mxml中响应 //Home.mxml的对应代码是:private function navChangedHandler(event : NavEvent) : void var e : NavEvent = new NavEvent("navChanged" , value); dispatchEvent(e); } private function screenToggle() : void { //根据当前屏幕状态来设定新的屏幕状态 } private function qMe() : void { //发起QQ对话 } private function screenHandler(event : FullScreenEvent) : void { //全屏按钮相关 } private function mouseDownOutsideHandler(event : MouseEvent) : void { //鼠标点在登陆弹窗的外部并且不在登陆按钮上则渐隐 } private function closePopUp() : void { //关闭登陆窗 } private function closePopUpHandler(event : Event) : void { //登陆弹窗渐隐,该函数事件在views:LoginDialog中注册声明 } ]]> </fx:Script>
三、
主要设置一些过渡特效,其中s:Parallel主要设定效果组合。通过id、target等来与下面的组件视图来进行关联<fx:Declarations> <!-- 将非可视元素(例如服务、值对象)放在此处 --> <s:Fade id="fadeIn" alphaFrom="0" alphaTo="1" duration="200"/> <s:Fade id="fadeOut" alphaFrom="1" alphaTo="0" duration="200"/> <s:Parallel id="loginFadeIn" target="{loginDialog}"> <s:Fade alphaFrom="0" alphaTo="1" duration="1000"/> <s:Move yFrom="0" yTo="80" duration="1000"/> </s:Parallel> <s:Parallel id="loginFadeOut" target="{loginDialog}"> <s:Fade alphaFrom="1" alphaTo="0" duration="1000"/> <s:Move yFrom="80" yTo="0" duration="1000"/> </s:Parallel> </fx:Declarations>
四、主要是一些常规的组件,如图像(LOGO)、按钮(日记、相册、视频...)等,这里关注两个组件s:ToggleButton和s:PopUpAnchor,在官网中的两个组件的说明分别如下:
ToggleButton 组件定义切换按钮。单击该按钮会在弹起状态和按下状态之间进行切换【详细】
PopUpAnchor 组件用于定位布局中的弹出控件或下拉控件【详细】
其中在s:PopUpAnchor组件中加载了一个views:LoginDialog(见views包中的LoginDialog.mxml),该组件视图就是登陆窗口。
【待续……】
Flex实例【Shangle.net】解析【三】
最新推荐文章于 2015-04-29 20:25:57 发布