Flash CS4教程:详细解析抓喜庆游戏教程

阳光的晓宇哥

阳光的晓宇哥

2016-02-16 19:37

最近很多朋友喜欢上设计,但是大家却不知道如何去做,别担心有图老师给你解答,史上最全最棒的详细解说让你一看就懂。

本例应用了前几章节已经学习的产生随机对象和删除对应随机对象等知识,控制游戏过程中用户移动鼠标指针与创建的随机对象之间是否接触并执行相对应的程序块,显示用户通过移动鼠标指针所扑捉到的喜鹊数量。本实例还创建游戏的结束和重新开始程序,用户可进一步扩展,根据扑捉到的喜鹊数量来设置游戏关卡和游戏级别。通过本例的制作,读者可以掌握对简单基础游戏的创建全过程,停止游戏和重新开始游戏的控制。

本例思路:
1 创建实例背景图。
2 添加按钮和成绩单。
3 创建喜鹊动画和手型对象,将其转换为元件类。
4 编写喜鹊元件扩展类。
5 编写主程序类,控制游戏开始与结束,显示用户通过移动鼠标指针所扑捉到的喜鹊数量。
6 随机创建的喜鹊对象与用户鼠标指针接触所执行的控制程序。
7 停止游戏和重新开始游戏的控制。

实例步骤:

(1)新建一个空白文档,设置舞台大小为650*400,帧频设置为30,绘制游戏背景图或导入一张适合的背景图作为游戏背景,如下图13-1所示。

Flash CS4教程:详细解析抓喜庆游戏教程,PS教程,图老师教程网

 

(本文来源于图老师网站,更多请访问https://m.tulaoshi.com/flash/)(本文来源于图老师网站,更多请访问https://m.tulaoshi.com/flash/)

图13-1 实例背景

(2)新建一个图层,创建三个按钮元件,如下图2-所示,并命名实例名为start_btn 、help_btn、out_btn ,分别间隔放置于舞台右下角,如图13-2所示。

Flash CS4教程:详细解析抓喜庆游戏教程,PS教程,图老师教程网

 

(本文来源于图老师网站,更多请访问https://m.tulaoshi.com/flash/)(本文来源于图老师网站,更多请访问https://m.tulaoshi.com/flash/)

图13-2 控制按钮

(3)新建一个图层,创建成绩单,如下图13-3所示。创建一个动态文本,添加实例名为displayGrade_txt,将用于显示用户通过移动鼠标指针所扑捉到的喜鹊数量。

Flash CS4教程:详细解析抓喜庆游戏教程,PS教程,图老师教程网

 

(本文来源于图老师网站,更多请访问https://m.tulaoshi.com/flash/)(本文来源于图老师网站,更多请访问https://m.tulaoshi.com/flash/)

图13-3 缩放和绘制投影

(4)创建一个新影片剪辑并命名为Fly,扩展元件类也设为Fly。在Fly影片剪辑里创建喜鹊飞翔的动画,如下面演示图13-4 所示。

Flash CS4教程:详细解析抓喜庆游戏教程,PS教程,图老师教程网

(1)

Flash CS4教程:详细解析抓喜庆游戏教程,PS教程,图老师教程网

 

(本文来源于图老师网站,更多请访问https://m.tulaoshi.com/flash/)(本文来源于图老师网站,更多请访问https://m.tulaoshi.com/flash/)

(2)

图13-4 喜鹊和手型

(5)再创建一个影片剪辑,命名为gotgood_mc ,在该影片剪辑内插放3个关键帧,绘制3个手型,如图1- (1)、(2)所示。再创建一个影片剪辑,命名为MouseHand,同时设置扩展元件类也为MouseHand ,将影片剪辑gotgood_mc元件对象放置于此,并命名实例名为gotgood_mc,如图13-5所示。

Flash CS4教程:详细解析抓喜庆游戏教程,PS教程,图老师教程网

 

(本文来源于图老师网站,更多请访问https://m.tulaoshi.com/flash/)(本文来源于图老师网站,更多请访问https://m.tulaoshi.com/flash/)

(1)

Flash CS4教程:详细解析抓喜庆游戏教程,PS教程,图老师教程网

 

(本文来源于图老师网站,更多请访问https://m.tulaoshi.com/flash/)(本文来源于图老师网站,更多请访问https://m.tulaoshi.com/flash/)

(2)

Flash CS4教程:详细解析抓喜庆游戏教程,PS教程,图老师教程网

 

(本文来源于图老师网站,更多请访问https://m.tulaoshi.com/flash/)(本文来源于图老师网站,更多请访问https://m.tulaoshi.com/flash/)

(3)

图13-5 手型

(6)下面先编写已经创建的元件扩展类FLY ,该类接收一个Number类型参数,将其赋值作为该类产生对象的y轴方向上的递减值,如第16行代码所示,通过在构造函数中为其注册ENTER_FRAME事件侦听,使该类对象在被创建时便执行事件侦听器函数enterFrameHandler ,也就是所创建的每一只喜鹊都以某一速度(变量speed值)作向上运动。此外,该类还提供两个方法:removeTimerHandler()用于清除事件侦听器函数,这在该类对象被删除时会被调用(删除不必要的事件侦听);另一个方法flySpeed()是取得_speed值。

AS3代码

package {   
    import flash.display.MovieClip;   
    import flash.utils.Timer;   
    import flash.events.*;   
       
    public class Fly extends MovieClip {   
        private var _speed:Number;   
           
        public function Fly(speed) {   
               
            _speed = Math.round(speed);   
            this.addEventListener(Event.ENTER_FRAME,enterFrameHandler);   
        }   
           
        private function enterFrameHandler(event:Event):void{   
            this.y -= this._speed;   
        }   
           
        public function removeTimerHandler():void {   
            this.removeEventListener(Event.ENTER_FRAME,enterFrameHandler);   
            trace("清除实例事件");   
        }   
           
        public function get flySpeed():Number{   
            return this._speed;   
        }   
           
    }   
}

 

(本文来源于图老师网站,更多请访问https://m.tulaoshi.com/flash/)(本文来源于图老师网站,更多请访问https://m.tulaoshi.com/flash/)

(7)下面是主程序类的编写,我们在构造函数初始化舞台的宽度和高度,并创建存储所有喜鹊对象的容器,如第22到25行代码所示。在第27到31行代码隐藏系统鼠标并创建手型,通过侦听stage对象的MOUSE_MOVE和MOUSE_DOWN事件来控制手型的鼠标跟随stageMoveHandler()和状态stageDownHandler()。

 

(本文来源于图老师网站,更多请访问https://m.tulaoshi.com/flash/)(本文来源于图老师网站,更多请访问https://m.tulaoshi.com/flash/)

AS3代码

package {   
    import flash.display.*;   
    import flash.events.*;   
    import flash.utils.Timer;   
    import flash.text.TextField;   
    import flash.ui.Mouse;   
       
    public class Main extends Sprite {   
           
        private var _grade:Number;//得分值   
        public var displayGrade_txt:TextField;//得分显示   
        public var start_btn:SimpleButton;//开始按钮   
        private var stageW:Number;   
        private var stageH:Number;   
        private var content_mc:Sprite;//存储所有喜鹊对象的容器   
        private var hand_mc:MovieClip;//手型对象   
           
        private var _timer:Timer;   
           
        public function Main() {   
               
            this.stageW = stage.stageWidth;   
            this.stageH = stage.stageHeight;   
            this.content_mc = new Sprite();   
            addChild(content_mc);   
               
            Mouse.hide();   
            this.hand_mc = new MouseHand();   
            hand_mc.mouseEnabled = false;   
            hand_mc.gotgood_mc.mouseEnabled = false;   
            addChild(hand_mc);   
            stage.addEventListener(MouseEvent.MOUSE_MOVE, stageMoveHandler);   
            stage.addEventListener(MouseEvent.MOUSE_DOWN, stageDownHandler);   
               
            init();   
               
        }

(8)stageMoveHandler()方法是简单的鼠标跟随,stageDownHandler()方法是当用户鼠标点击时播放步骤(5)中的手型影片剪辑动画,产生抓的动作效果。 init()方法中开始初始化该游戏,主要是将displayGrade_txt显示文本的内容设置为0和为开始按钮注册事件侦听器函数。当用户单击start_btn按钮后,便调用startGame()方法,此时,将结束游戏按钮out_btn 设置为可见,并注册事件侦听器函数,如第59、60行代码所示。然后通过创建Timer类对象实例进行计时,每隔500毫秒执行一次copy()侦听器函数,也就是创建一只喜鹊对象,如第62到64行代码所示。第65行将start_btn按钮设置为不可见。

提示:关于计时器Timer类:Timer(delay:Number, repeatCount:int = 0)

参数 delay:Number 计时器事件间的延迟(以毫秒为单位)。

repeatCount:int (default = 0) 指定重复次数。 如果为 0,则计时器重复无限次数。 如果不为 0,则将运行计时器,运行次数为指定的次数,然后停止。

AS3代码

private function stageMoveHandler(e:MouseEvent):void {   
       
    this.hand_mc.x = stage.mouseX;   
    this.hand_mc.y = stage.mouseY;   
}   
private function stageDownHandler(event:MouseEvent):void {   
       
    hand_mc.gotgood_mc.gotoAndPlay(2);   
}   
  
private function init():void{   
       
    _grade = 0;   
    displayGrade_txt.text = "0";   
    start_btn.addEventListener(MouseEvent.CLICK,startGame);   
}   
  
private function startGame(event:MouseEvent):void {   
       
    trace("开始游戏!");   
    out_btn.visible = true;   
    out_btn.addEventListener(MouseEvent.CLICK,outGame);   
       
    _timer =new Timer(500,0);   
    _timer.addEventListener(TimerEvent.TIMER,copy);   
    _timer.start();   
    start_btn.visible =false;   
}

 

(本文来源于图老师网站,更多请访问https://m.tulaoshi.com/flash/)(本文来源于图老师网站,更多请访问https://m.tulaoshi.com/flash/)

(9) copy()侦听器函数中,创建喜鹊对象,设置1到11之间的随机数作为其随机速度值,如第70行代码所示。统一设置其y坐标为舞台底部位置,x坐标为随机舞台宽度值,如第71、72行代码所示。将创建的喜鹊对象统一添加到content_mc容器中,并注册ROLL_OVER和ENTER_FRAME事件侦听。当用户移动鼠标指针经过喜鹊对象时,便会调用downHandler()侦听器函数,清除其事件侦听和清除该对象本身,如第81到85行代码所示,同时也调用refreshGrade()方法累加计算用户抓到的喜鹊数量。removeDrop()函数只是判断喜鹊对象是否运动到舞台顶部,当运动到舞台顶部时,清除喜鹊对象的事件侦听和其本身,如第95到100行代码所示。

AS3代码

private function copy(event:TimerEvent) {   
       
    var mc = new Fly(Math.random() * 10 + 1);   
    mc.x = Math.random() * this.stageW;   
    mc.y = this.stageH;   
       
    content_mc.addChild(mc);   
    mc.addEventListener(MouseEvent.ROLL_OVER, downHandler);   
    mc.addEventListener(Event.ENTER_FRAME, removeDrop);   
}   
  
private function downHandler(event:MouseEvent) {   
       
    var mc = event.target;   
    mc.removeTimerHandler();   
    mc.removeEventListener(MouseEvent.MOUSE_DOWN, downHandler);   
    mc.removeEventListener(Event.ENTER_FRAME, removeDrop);   
    content_mc.removeChild(mc);   
       
    //refreshGrade(mc.flySpeed);//还可以通过扩展refreshGrade方法,按不同速度得分   
    refreshGrade();//按数量   
       
}   
  
private function removeDrop(event:Event) {   
    var _mc:MovieClip = event.target as MovieClip;   
       
    if (_mc.y = 0) {   
        _mc.removeTimerHandler();   
        _mc.removeEventListener(MouseEvent.MOUSE_DOWN, downHandler);   
        _mc.removeEventListener(Event.ENTER_FRAME, removeDrop);   
        content_mc.removeChild(_mc);   
    }   
       
}   
  
public function refreshGrade(grade:Number = 1):void {   
    this._grade += grade;   
    displayGrade_txt.text = this._grade.toString();   
}

(10)下面代码是对结束游戏的控制和重新开始初始化游戏。当用户单击结束游戏按钮便调用该方法,停止_timer对象的计时,将开始游戏按钮显示出来同时隐藏结束游戏按钮,如下面第111到113行代码所示。然后清除容器中的所有子项侦听和子项,如第116到124行代码所示,再重新调用init()方法。

AS3代码

        private function outGame(event:MouseEvent):void{   
               
            _timer.stop();   
            start_btn.visible = true;   
            out_btn.visible = false;   
               
            //下面清除容器中的所有子项侦听和子项   
            var num:uint = content_mc.numChildren;   
            var _mc:MovieClip;   
            for (var i:int = 0; i num; i++) {   
                   
                _mc = content_mc.getChildAt(0) as MovieClip;   
                _mc.removeEventListener(MouseEvent.MOUSE_DOWN, downHandler);   
                _mc.removeEventListener(Event.ENTER_FRAME, removeDrop);   
                content_mc.removeChild(_mc);   
            }   
               
            init();   
               
        }   
           
           
    }   
}

 

(本文来源于图老师网站,更多请访问https://m.tulaoshi.com/flash/)(本文来源于图老师网站,更多请访问https://m.tulaoshi.com/flash/)

展开更多 50%)
分享

猜你喜欢

Flash CS4教程:详细解析抓喜庆游戏教程

FLASH flash教程 autocad教程
Flash CS4教程:详细解析抓喜庆游戏教程

Flash cs4教程:经典简单的“填色”游戏-Flash实例教程

FLASH flash教程
Flash cs4教程:经典简单的“填色”游戏-Flash实例教程

s8lol主宰符文怎么配

英雄联盟 网络游戏
s8lol主宰符文怎么配

Flash CS4制作旋转立体字教程

FLASH flash教程 autocad教程
Flash CS4制作旋转立体字教程

Flash CS4制作伸展的树枝教程

FLASH flash教程 autocad教程
Flash CS4制作伸展的树枝教程

lol偷钱流符文搭配推荐

英雄联盟 网络游戏
lol偷钱流符文搭配推荐

Photoshop CS4教程:打造喜庆迎春炮竹贺新年

PS PS教程
Photoshop CS4教程:打造喜庆迎春炮竹贺新年

Flash CS4制作汽车广告条教程

FLASH flash教程 autocad教程
Flash CS4制作汽车广告条教程

lolAD刺客新符文搭配推荐

英雄联盟
lolAD刺客新符文搭配推荐

Flash CS4制作质感的水晶泡泡

Flash CS4制作质感的水晶泡泡

CorelDraw绘制超真实的手表教程

CorelDraw绘制超真实的手表教程
下拉加载更多内容 ↓