主文件:
<?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>
2、素材
指针图片:
3、最后运行的效果图: