运用flex编写一个模拟表盘
发布时间:2020-12-15 01:10:17 所属栏目:百科 来源:网络整理
导读:主文件: ?xml version="1.0" encoding="utf-8"?s:Application xmlns:fx="http://ns.adobe.com/mxml/2009" xmlns:s="library://ns.adobe.com/flex/spark" xmlns:mx="library://ns.adobe.com/flex/mx" minWidth="955" minHeight="600" xmlns:demo="demo.*"s:l
主文件: <?xml version="1.0" encoding="utf-8"?> <s:Application xmlns:fx="http://ns.adobe.com/mxml/2009" xmlns:s="library://ns.adobe.com/flex/spark" xmlns:mx="library://ns.adobe.com/flex/mx" minWidth="955" minHeight="600" xmlns:demo="demo.*"> <s:layout> <s:VerticalLayout verticalAlign="middle" horizontalAlign="center"/> </s:layout> <fx:Declarations> <!-- 将非可视元素(例如服务、值对象)放在此处 --> </fx:Declarations> <demo:demo_watchComp verticalScrollPolicy="off" horizontalScrollPolicy="off"/> </s:Application>
? 1、demo.mxml <?xml version="1.0" encoding="utf-8"?> <mx:Canvas xmlns:fx="http://ns.adobe.com/mxml/2009" creationComplete="canvas1_creationCompleteHandler(event)" xmlns:s="library://ns.adobe.com/flex/spark" xmlns:mx="library://ns.adobe.com/flex/mx" width="300" height="280"> <fx:Script> <![CDATA[ import mx.events.FlexEvent; [Bindable] private var af:Number = 0; [Bindable] private var at:Number = 0; [Bindable] private var timer:Timer = new Timer(1000); protected function canvas1_creationCompleteHandler(event:FlexEvent):void { timer.addEventListener(TimerEvent.TIMER,timerHandle); //定时器事件注册 timer.start();//启动定时器 //处理图片为bitmap并设置为光滑效果 (bg.content as Bitmap).smoothing = true; (pt.content as Bitmap).smoothing = true; } private function timerHandle(event:TimerEvent):void { at = Number((Math.random()*120)); rotate1.play(); //启动旋转 af = at; } ]]> </fx:Script> <fx:Declarations> <!-- 将非可视元素(例如服务、值对象)放在此处 --> <!--旋转组件--> <mx:Rotate id="rotate1" target="{hg}" angleFrom="{af}" angleTo="{at}"/> </fx:Declarations> <mx:Image id="bg" x="0" y="0" width="300" height="280" source="images/watch.png"/> <s:HGroup x="0" y="140" width="300" height="10" id="hg"> <mx:Image width="150" height="5" source="images/poiter.png" id="pt"/> </s:HGroup> </mx:Canvas>
指针图片: ? 3、最后运行的效果图: (编辑:李大同) 【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容! |