Flex中如何利用Matrix类的rotate函数对图片进行旋转操作的例子

  1. <?xml version="1.0" encoding="utf-8"?>
  2. <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
  3.         layout="horizontal"
  4.         verticalAlign="middle"
  5.         backgroundColor="white">
  6.     <mx:String id="deg">&#0176;</mx:String>
  7.     <mx:Script>
  8.         <![CDATA[
  9.             import mx.core.UIComponent;
  10.             private function img1_effectEnd():void {
  11.                 /* Set the appropriate Label text. */
  12.                 lbl1.text = "img1.rotation = " + img1.rotation.toString() + deg;
  13.             }
  14.             private function img2_creationComplete():void {
  15.                 /* "Copy" the existing matrix. */
  16.                 var m1:Matrix = img2.transform.matrix;
  17.                 /* Rotate the matrix 45 degrees (note that we have to
  18.                    convert from degrees to radians since the rotate()
  19.                    method expects radians. */
  20.                 m1.rotate(degreesToRadians(45));
  21.                 /* Concatenate the original matrix onto the rotated
  22.                    matrix so we don't lose the original X and Y
  23.                    coordinates and any other effects. */
  24.                 m1.concat(img2.transform.matrix);
  25.                 /* "Copy" the new matrix over the existing matrix. */
  26.                 img2.transform.matrix = m1;
  27.                 /* Set the appropriate Label text. */
  28.                 lbl2.text = "img2.rotation = " + img2.rotation.toString() + deg;
  29.             }
  30.             private function img_rollOver(cTarget:UIComponent):void {
  31.                 cTarget.toolTip = cTarget.name + ".rotation = " + cTarget.rotation.toString();
  32.             }
  33.             private function radiansToDegrees(radians:Number):Number {
  34.                 var degrees:Number = radians * (180 / Math.PI);
  35.                 return degrees;
  36.             }
  37.             private function degreesToRadians(degrees:Number):Number {
  38.                 var radians:Number = degrees * (Math.PI / 180);
  39.                 return radians;
  40.             }
  41.         ]]>
  42.     </mx:Script>
  43.     <mx:Rotate id="rotate" angleFrom="0" angleTo="45" duration="1" />
  44.     <mx:ApplicationControlBar dock="true">
  45.         <mx:Label id="lbl1" />
  46.         <mx:Spacer width="50" />
  47.         <mx:Label id="lbl2" />
  48.     </mx:ApplicationControlBar>
  49.     <mx:Image id="img1"
  50.             source="http://www.helpexamples.com/flash/images/logo.png"
  51.             creationCompleteEffect="{rotate}"
  52.             effectEnd="img1_effectEnd();"
  53.             rollOver="img_rollOver(UIComponent(event.currentTarget));" />
  54.     <mx:Spacer width="50" />
  55.     <mx:Image id="img2"
  56.             source="http://www.helpexamples.com/flash/images/logo.png"
  57.             creationComplete="img2_creationComplete();"
  58.             rollOver="img_rollOver(UIComponent(event.currentTarget));" />
  59. </mx:Application>
posted @ 2010-04-23 09:54  北京Net老牛队  阅读(1664)  评论(0编辑  收藏  举报