当前位置: 首页 > 图文教程 > Flash动画 > ActionScript > Flash AS3实例教程:制作旋转的菜单动画

ActionScript
FLASH 3D相册之利用BitmapData类制作
Flash 脚本游戏开发教程 第一课
Flash 脚本游戏开发教程第二课
Flash 脚本游戏开发教程第三课
Flash 脚本游戏开发教程第四课
Flash 脚本游戏开发教程第五课
Flash 脚本游戏开发教程第六课
Flash 脚本游戏开发教程第七课
Flash 脚本游戏开发教程第八课
Flash AS实现的蝌蚪摆尾动画的教程
从基础开始深入学Flash AS3教程(4)(译文)
从基础开始深入学Flash AS3教程(5)(译文)
从基础开始深入Flash AS3教程(2)(译文)
从基础开始深入学Flash AS3教程(3)(译文)
Flash AS3对单个图片进行角色动作化处理
从基础开始深入Flash AS3教程(1)(译文)
Flash教程:if条件语句的用法
Flash AS教程:_visible属性的详细讲解
Flash AS教程:图片环绕旋转效
Flash教程:trace()的使用

ActionScript 中的 Flash AS3实例教程:制作旋转的菜单动画


出处:互联网   整理: 软晨网(RuanChen.com)   发布: 2010-01-30   浏览: 112 ::
收藏到网摘: n/a

演示:



1、新建一个Flash文件,宽550高400像素,背景为黑色。保存文件。

2、用椭圆工具,画一个边框白色,填充为红色的27*27的圆形。图1:

3、按F8键,把圆形转换成影片剪辑,如下设置:图2。

4、按Ctrl+L组合键,打开库双击Item影片剪辑进入编辑状态。锁定图层1,添加图层2。在圆形的中心添加一个动态文本。图3:

5、在属性面板中命名为“itemText”并输入一个数字,颜色为白色,大小为14至17左右。点击“字符嵌入”按钮,设置如图4:

6、效果。

7、新建一个ActionScript文件,编写一个名为“Item.as”的外部类文件。代码如下:
    package { 

            import flash.display.MovieClip; 

            public dynamic class Item extends MovieClip { 

                    public function Item() { 

                    } 

            } 

    }

保存在fla文件的同一目录下。

8、返回到场景1,在图层1的第一帧输入代码:

//Save the center coordinates of the stage

var centerX:Number = stage.stageWidth / 2;

var centerY:Number = stage.stageHeight / 2;

//The number of items we will have (feel free to change!)

var NUMBER_OF_ITEMS:uint = 15;

//Radius of the menu circle (horizontal and vertical)

var radiusX:Number = 200;

var radiusY:Number = 100;

//Angle difference between the items (in radians)

var angleDifference:Number = Math.PI * (360 / NUMBER_OF_ITEMS) / 180;

//How fast a single circle moves (we calculate the speed

//according to the mouse position later on...)

var angleSpeed:Number = 0;

//Scaling speed of a single circle

var scaleSpeed:Number = 0.0002;

//This vector holds all the items

//(this could also be an array...)

var itemVector:Vector.<Item> = new Vector.<Item>  ;

//This loop creates the items and positions them

//on the stage

for (var i:uint = 0; i < NUMBER_OF_ITEMS; i++) {

                 //Create a new menu item

        var item:Item = new Item();

                 //Get the angle for the item (we space the items evenly)

        var startingAngle:Number = angleDifference*i;

                 //Set the x and y coordinates

        item.x = centerX + radiusX * Math.cos(startingAngle);

        item.y = centerY + radiusY * Math.sin(startingAngle);

                  //Save the starting angle of the item.

        //(We have declared the Item class to be dymamic. Therefore,

        //we can create new properties dynamically.)

        item.angle = startingAngle;

                 //Add an item number to the item’s text field

        item.itemText.text = i.toString();

                 //Allow no mouse children

        item.mouseChildren = false;

                 //Add the item to the vector

        itemVector.push(item);

                 //Add the item to the stage

        addChild(item);

}

//We use ENTER_FRAME to animate the items

addEventListener(Event.ENTER_FRAME, enterFrameHandler);

//This function is called in each frame

function enterFrameHandler(e:Event):void {

                 //Calculate the angle speed according to mouse position

        angleSpeed = (mouseX - centerX) / 5000;

                //Loop through the vector

        for (var i:uint = 0; i < NUMBER_OF_ITEMS; i++) {

                                   //Save the item to a local variable

                var item:Item = itemVector[i];

                                   //Update the angle

                item.angle += angleSp

                                   //Set the new coordinates

                item.x = centerX + radiusX * Math.cos(item.angle);

                item.y = centerY + radiusY * Math.sin(item.angle);

                                   //Calculate the vertical distance from centerY to the item

                var dy:Number = centerY - item.y;

                                   //Scale the item according to vertical distance

                item.scaleY = (dy / radiusY);

                                   //If we are above centerY, double the y scale

                if (item.y<centerY) {

                        item.scaleY *= 2;

                }

                                   //Set the x scale to be the same as y scale

                item.scaleX = item.scaleY;

                                   //Adjust the alpha according to y scale

                item.alpha = item.scaleY + 1.1;

                  }

}
9、好了,测试影片。

附件下载:菜单.rar