Flex中如何利用标签使一张图片围绕任意X,Y点旋转的例子

By Minidxer | January 1, 2009

接下来的例子演示了Flex中如何利用标签,使一张图片围绕任意X,Y点旋转。

让我们先来看一下Demo可以右键View Source或点击这里察看源代码):


下面是完整代码(或点击这里察看):

Download: main.mxml
  1. <?xml version="1.0" encoding="utf-8"?>
  2. <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
  3.         layout="vertical"
  4.         verticalAlign="middle"
  5.         backgroundColor="white">
  6.  
  7.     <mx:Rotate id="rotate"
  8.             target="{img}"
  9.             angleFrom="0"
  10.             angleTo="360"
  11.             duration="1000"
  12.             originX="{imgOriginX.value}"
  13.             originY="{imgOriginY.value}" />
  14.  
  15.     <mx:ApplicationControlBar dock="true">
  16.         <mx:Form styleName="plain">
  17.             <mx:FormItem label="originX:">
  18.                 <mx:NumericStepper id="imgOriginX"
  19.                         minimum="0"
  20.                         maximum="{img.width}"
  21.                         value="0" />
  22.             </mx:FormItem>
  23.             <mx:FormItem label="originY:">
  24.                 <mx:NumericStepper id="imgOriginY"
  25.                         minimum="0"
  26.                         maximum="{img.height}"
  27.                         value="0" />
  28.             </mx:FormItem>
  29.             <mx:FormItem>
  30.                 <mx:Button label="Rotate"
  31.                         click="rotate.play();" />
  32.             </mx:FormItem>
  33.         </mx:Form>
  34.     </mx:ApplicationControlBar>
  35.  
  36.     <mx:Image id="img" source="@Embed('images/flex_logo.jpg')" />
  37.  
  38. </mx:Application>
代码:Peter deHaan 翻译/整理/编译:中文Flex例子

Topics: Other | 2 Comments » | 1,237 views Tags: , , , ,

你可能还对下列文章感兴趣:

2 comments | Add One

  1. money - 01/1/2009 at 10:10 pm

    这个功能一般在网站上的使用是如何体现的呢?

  2. dennis - 01/5/2009 at 3:52 pm

    可以在用户点击过后.出现一个旋转的动画..或者在某个event执行的时候..

Leave a Comment

Name(*):

E-Mail(*) :

Website :

Comments :

Search Posts