积少成多Flash ActionScript 3.0(5) - 实例之闹钟(自定义事件, 画图, 动画)_积少成多flash(5) - actionscript 3.0 实例之闹钟(自定-程序员宅基地

技术标签: date  button  timer  string  Flash ActionScript  actionscript  flash  

[源码下载]


积少成多Flash ActionScript 3.0(5) - 实例之闹钟(自定义事件, 画图, 动画)


作者: webabcd


介绍
通过一个经典示例,即闹钟,对使用Flash ActionScript 3.0 画图、做动画有一个大概的了解,并通过此示例学习自定义事件的开发
  • 自定义事件 - 继承自 Event ,一个 public static const 定义事件类型,其他 public 变量定义事件属性
  • 画图 - 通过 Shape 对象的 graphics 属性来执行矢量绘图命令 
  • 动画 - 通过 Timer 对象或监听 Event.ENTER_FRAME 事件 


1、自定义事件(闹钟到点后所触发的自定义事件)
AlarmEvent.as
package 
{
    import flash.events.Event;
    
    public class AlarmEvent extends Event 
    
{
        
// 定义事件类型
        public static const ALARM:String = "alarm";
        
        
// 定义闹钟在响铃时所显示的信息
        public var alermMessage:String;
        
        
// 构造函数,msg 为提醒信息
        public function AlarmEvent(msg:String = "ALARM!")
        
{
            
// 调用父类的构造函数。参数为事件类型,可以作为 Event.type 访问
            super(ALARM);
    
            alermMessage 
= msg;
        }

        
        
// 重写 Event 的 clone() 方法
        public override function clone():Event
        
{
            
return new AlarmEvent(alermMessage);
        }

        
        
// 重写 Event 的 toString() 方法
        public override function toString():String
        
{
            
// Event.formatToString() - 在自定义 Event 类中实现 toString() 方法的 utility 函数
            return formatToString("AlarmEvent""type""bubbles""cancelable""eventPhase""message");
        }

    }

}


2、画图(绘制表盘,刻度,时分秒针等)
ClockUI.as
package
{
    import flash.display.Shape;
    import flash.display.Sprite;
    import flash.display.StageAlign;
    import flash.display.StageScaleMode;
    import flash.text.StaticText;
    import flash.events.
*;
    import flash.text.TextField;
    import flash.text.TextFormat;
    import flash.display.Sprite;
    
    
// 绘制表盘 UI
    public class ClockUI extends Sprite 
    
{
        
// 表盘半径
        public var radius:uint;
        
        
// 表盘中心点的 X 坐标和 Y 坐标
        public var centerX:int;
        public 
var centerY:int;
        
        
// 时, 分, 秒指针的形状
        public var hourHand:Shape;
        public 
var minuteHand:Shape;
        public 
var secondHand:Shape;
        
        
// 表盘背景颜色,以及时, 分, 秒指针颜色(0x代表16进制)
        public var bgColor:uint = 0xEEEEFF;
        public 
var hourHandColor:uint = 0x003366;
        public 
var minuteHandColor:uint = 0x000099;
        public 
var secondHandColor:uint = 0xCC0033;
        
        
// 构造函数,r 为表盘半径
        public function ClockUI(r:uint) 
        
{
            
this.radius = r;
                    
            
this.centerX = r;
            
this.centerY = r;
        }

        
        
// 初始化表盘
        public function init():void 
        
{
            
// 画表盘的边框
            drawBorder();
            
            
// 画表盘上的小时的标记
            drawHourLabel();

            
// 画时, 分, 秒指针
            drawHand();
        }

        
        public 
function drawBorder():void
        
{
            
// 指定线条样式,两个参数分别为线条的粗细(以磅为单位)和线条的颜色
            this.graphics.lineStyle(0.50x999999);
            
// 以指定的颜色开始填充,在调用 endFill() 后才会呈现填充
            this.graphics.beginFill(bgColor);
            
// 画园,三个参数分别为圆心的 X 坐标、圆心的 Y 坐标和园的半径。之前调用的 beginFill() 方法将填充此园
            this.graphics.drawCircle(centerX, centerY, radius);
            
// 呈现上次的 beginFill() 的结果
            this.graphics.endFill();
        }

  
        public 
function drawHourLabel():void
        
{
            
for (var i:Number = 1; i <= 12; i++)
            
{
                
// 表盘的刻度标识,1 到 12
                var lbl:TextField = new TextField();
                lbl.text 
= i.toString();
                
                
// 小时刻度标识所需旋转的弧度(使用弧度是为了方便之后的 sin() 和 cos() 计算)
                var angle:Number = i * 30 * (Math.PI / 180);
                
                
// 计算刻度标识的位置
                lbl.x = centerX + (0.9 * radius * Math.sin(angle)) - 5;
                lbl.y 
= centerY - (0.9 * radius * Math.cos(angle)) - 9;
                
                
// 格式化刻度标识的文本样式
                var tf:TextFormat = new TextFormat();
                
// tf.font = "Arial";
                tf.bold = "true";
                tf.size 
= 12;
                lbl.setTextFormat(tf);
                
                
// 在 Container 中添加指定的 DisplayObject ,返回值为被添加到 Container 后的 DisplayObject
                this.addChild(lbl);
            }

        }

        
        public 
function drawHand():void
        
{       
            hourHand 
= new Shape();
            hourHand.graphics.lineStyle(
3, hourHandColor);
            
// 移动当前的绘画起点到指定的位置
            hourHand.graphics.moveTo(0-radius * 0.5);
            
// 画直线到指定位置,起点位置由 moveTo() 决定
            hourHand.graphics.lineTo(00);
            hourHand.x 
= centerX;
            hourHand.y 
= centerY;        
            addChild(hourHand);
                     
              minuteHand 
= new Shape();
            minuteHand.graphics.lineStyle(
2, minuteHandColor);
            minuteHand.graphics.moveTo(
0-radius * 0.8);
            minuteHand.graphics.lineTo(
00);
             minuteHand.x 
= centerX;
            minuteHand.y 
= centerY;
            addChild(minuteHand);
 
             secondHand 
= new Shape();
            secondHand.graphics.lineStyle(
0.5, secondHandColor);
            secondHand.graphics.moveTo(
0-radius * 0.9);
            secondHand.graphics.lineTo(
00);
            secondHand.x 
= centerX;
            secondHand.y 
= centerY;
            addChild(secondHand);
        }

        
        
// 以当前系统时间刷新表盘的呈现
        public function refresh():void
        
{
            
// new Date() - Flash 宿主的系统时间
            var currentTime:Date = new Date();
            
            
var hour:uint = currentTime.getHours();
            
var minute:uint = currentTime.getMinutes();
            
var second:uint = currentTime.getSeconds();
    
            
// 时, 分, 秒指针做相应的旋转。单位:度数
            this.hourHand.rotation = hour * 30 + minute * 0.5;
            
this.minuteHand.rotation = minute * 6;
            
this.secondHand.rotation = second * 6;
        }

    }

}


3、动画(让时,分,秒针动起来)
SimpleClock.as
package 
{
    import flash.display.Sprite;

    public class SimpleClock extends Sprite
    
{
        import flash.events.TimerEvent;
        import flash.utils.Timer;
        
        private 
var timer:Timer;
        private 
var clockUI:ClockUI;
        
        
// 构造函数,radius 为表盘半径
        public function SimpleClock(radius:Number = 100):void 
        
{            
            
// 实例化一个 ClockUI 对象,并将其添加到舞台上
            clockUI = new ClockUI(Math.max(20, radius));
            clockUI.init();
            addChild(clockUI);
        
            
// 刷新表盘 UI
            clockUI.refresh();

            
// 实例化一个计时器,每 1 秒 tick 一次
            timer = new Timer(1000);       
            timer.addEventListener(TimerEvent.TIMER, onTick);
            timer.start();
        }


        private 
function onTick(e:TimerEvent):void 
        
{
            
// 刷新表盘 UI
            clockUI.refresh();
        }
        
    }

}


4、组装以上各个类,以成为一个完整的闹钟对象(这里来确定如何触发我们开始写的那个自定义事件)
AlarmClock.as
package 
{
    public class AlarmClock extends SimpleClock 
    
{
        import flash.events.MouseEvent;
        import flash.events.TimerEvent;
        import flash.utils.Timer;
            
        private 
var alarmHour:Number = -1
        private 
var alarmMinute:Number = -1;
        private 
var alarmMessage:String;
        private 
var timer:Timer;
        
        
// 构造函数, radius 为表盘半径
        public function AlarmClock(radius:Number = 100):void
        
{
            
// 调用父类的构造函数
            super(radius);

            
// 计时器,每 1 秒 tick 一次
            timer = new Timer(1000);
            timer.addEventListener(TimerEvent.TIMER, onTick);
            timer.start();
        }


        
/*
         * 设置提醒时间
         * @param hour        提醒时间的小时数
         * @param minute    提醒时间的分钟数
         * @param message    提醒信息
         * @return 无返回值
         
*/

        public 
function setAlarm(hour:Number = 0, minute:Number = 0, message:String = "Alarm!"):void
        
{          
            alarmHour 
= hour;
            alarmMinute 
= minute;
             alarmMessage 
= message;
        }

        
        
/*
         * 清除提醒时间
         
*/

        public 
function clearAlarm()
        
{
            alarmHour 
= alarmMinute = -1;
        }


        private 
function onTick(e:TimerEvent):void 
        
{
            
var date:Date = new Date();
            
            
if (alarmHour == date.hours && alarmMinute == date.minutes)
            
{
                
// 如果到了提醒时间则实例化 AlarmEvent,并通过 dispatchEvent() 触发该事件
                var alarm:AlarmEvent = new AlarmEvent(alarmMessage);
                dispatchEvent(alarm);
            }

        }

    }

}


5、将闹钟对象显示到 UI 上,通过用户操作设置闹钟时间
在 UI 上放置两个 NumericStepper ,分别取名为 txtHour 和 txtMinute ,用来设置响铃的时间。再放置两份名称分别为 txtSet 和 txtClear 的 Button ,用来设置闹铃和取消闹铃。再放置一个名为 txtMessage 的 TextArea ,用来显示闹铃信息
Clock.as
package
{
    import flash.display.MovieClip;
    import flash.events.MouseEvent;
    
    public class Clock extends MovieClip 
    
{
        
var alarmClock:AlarmClock;
        
        public 
function Clock():void
        
{
            btnSet.addEventListener(MouseEvent.CLICK, onSetAlarm);
            btnClear.addEventListener(MouseEvent.CLICK, onClearAlarm);
            txtHour.maximum 
= 23;
            txtMinute.maximum 
= 59;
            txtHour.value 
= new Date().hours;
            txtMinute.value 
= new Date().minutes;

            
// 实例化 AlarmClock,并在舞台上添加此对象
            alarmClock = new AlarmClock(80);
            alarmClock.x 
= 200;
            alarmClock.y 
= 200;
            alarmClock.addEventListener(AlarmEvent.ALARM, onAlarm);
            addChild(alarmClock);
        }

        
        
function onSetAlarm(e:MouseEvent):void
        
{
            alarmClock.setAlarm(txtHour.value, txtMinute.value, 
"起床啦");
        }

        
        
function onClearAlarm(e:MouseEvent):void
        
{
            alarmClock.clearAlarm();
            txtMessage.text 
= "";
        }

        
        
function onAlarm(e:AlarmEvent):void
        
{
            txtMessage.text 
+= e.alermMessage + " " + new Date().toString() + "/n";
            txtMessage.verticalScrollPosition 
= txtMessage.maxVerticalScrollPosition;    
        }

    }

}



OK
[源码下载]
版权声明:本文为博主原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明。
本文链接:https://blog.csdn.net/webabcd/article/details/4608353

智能推荐

Eclipse中配置WebMagic(已配置好Maven)_使用eclipse搭建webmagic工程-程序员宅基地

文章浏览阅读364次。1.WebMagicWebMagic是一个简单灵活的Java爬虫框架。基于WebMagic,你可以快速开发出一个高效、易维护的爬虫。2.在Eclipse中配置WebMagic1.首先需要下载WebMagic的压缩包官网地址为:WebMagic官网最新版本为:WebMagic-0.7.3,找到对应版本,打开下载界面,注意,下载要选择Source code(zip)版本,随便下载到哪里都可以;2.下载好的压缩包需要解压,此时解压到的位置即为后续新建的Eclipse的project位置,比如我的Ecli_使用eclipse搭建webmagic工程

linux启动mysql_linux如何启动mysql服务_linux启动mysql服务命令是什么-系统城-程序员宅基地

文章浏览阅读1.9k次。mysql数据库是一种开放源代码的关系型数据库管理系统,有很多朋友都在使用。一些在linux系统上安装了mysql数据库的朋友,却不知道该如何对mysql数据库进行配置。那么linux该如何启动mysql服务呢?接下来小编就给大家带来linux启动mysql服务的命令教程。具体步骤如下:1、首先,我们需要修改mysql的配置文件,一般文件存放在/etc下面,文件名为my.cnf。2、对于mysql..._linux中 mysql 启动服务命令

php实现在线oj,详解OJ(Online Judge)中PHP代码的提交方法及要点-程序员宅基地

文章浏览阅读537次。详解OJ(Online Judge)中PHP代码的提交方法及要点Introduction of How to submit PHP code to Online Judge SystemsIntroduction of How to commit submission in PHP to Online Judge Systems在目前常用的在线oj中,codeforces、spoj、uva、zoj..._while(fscanf(stdin, "%d %d", $a, $b) == 2)

java快捷键调字体_设置MyEclipse编码、补全快捷键、字体大小-程序员宅基地

文章浏览阅读534次。一、设置MyEclipse编码(1)修改工作空间的编码方式:Window-->Preferences-->General-->Workspace-->Text file encoding(2)修改一类文件的编码方式:Window-->Preferences-->General-->content Types-->修改default Encoding(..._java修改快捷缩写内容

解析蓝牙原理_蓝牙原理图详解-程序员宅基地

文章浏览阅读1.4w次,点赞19次,收藏76次。1.前言市面上关于Android的技术书籍很多,几乎每本书也都会涉及到蓝牙开发,但均是上层应用级别的,而且篇幅也普遍短小。对于手机行业的开发者,要进行蓝牙模块的维护,就必须从Android系统底层,至少框架层开始,了解蓝牙的结构和代码实现原理。这方面的文档、网上的各个论坛的相关资料却少之又少。分析原因,大概因为虽然蓝牙协议是完整的,但是并没有具体的实现。蓝牙芯片公司只负责提供最底层的API_蓝牙原理图详解

从未在一起更让人遗憾_“从未在一起和最终没有在一起哪个更遗憾”-程序员宅基地

文章浏览阅读7.7k次。图/源于网络文/曲尚菇凉1.今天早上出门去逛街,在那家冰雪融城店里等待冰淇淋的时候,听到旁边两个女生在讨论很久之前的一期《奇葩说》。那期节目主持人给的辩论题是“从未在一起和最终没有在一起哪个更遗憾”,旁边其中一个女生说,她记得当时印象最深的是有个女孩子说了这样一句话。她说:“如果我喜欢一个人呢,我就从第一眼到最后一眼,把这个人爱够,把我的感觉用光,我只希望那些年让我成长的人是他,之后的那些年他喝过..._从未在一起更遗憾

随便推点

Spring Cloud Alibaba 介绍_sprngcloud alba-程序员宅基地

文章浏览阅读175次。Spring Cloud Alibaba 介绍Sping体系Spring 以 Bean(对象) 为中心,提供 IOC、AOP 等功能。Spring Boot 以 Application(应用) 为中心,提供自动配置、监控等功能。Spring Cloud 以 Service(服务) 为中心,提供服务的注册与发现、服务的调用与负载均衡等功能。Sping Cloud介绍官方介绍​ Tools for building common patterns in distributed systems_sprngcloud alba

测试 数据类型的一些测试点和经验_基础字段的测试点-程序员宅基地

文章浏览阅读3.2k次,点赞4次,收藏21次。我这里是根据之前在测试数据类项目过程中的一些总结经验和掉过个坑,记录一下,可以给其他人做个参考,没什么高深的东西,但是如果不注意这些细节点,后期也许会陷入无尽的扯皮当中。1 需求实现的准确度根据产品需求文档描述发现不明确不详细的或者存在歧义的地方一定要确认,例如数据表中的一些字段,与开发和产品确认一遍,如有第三方相关的,要和第三方确认,数据类项目需要的是细心,哪怕数据库中的一个字段如果没有提前对清楚,后期再重新补充,会投入更大的精力。2 数据的合理性根据业务场景/常识推理,提..._基础字段的测试点

一文看懂:行业分析怎么做?_码工小熊-程序员宅基地

文章浏览阅读491次。大家好,我是爱学习的小xiong熊妹。在工作和面试中,很多小伙伴会遇到“对XX行业进行分析”的要求。一听“行业分析”四个字,好多人会觉得特别高大上,不知道该怎么做。今天给大家一个懒人攻略,小伙伴们可以快速上手哦。一、什么是行业?在做数据分析的时候,“行业”两个字,一般指的是:围绕一个商品,从生产到销售相关的全部企业。以化妆品为例,站在消费者角度,就是简简单单的从商店里买了一支唇膏回去。可站在行业角度,从生产到销售,有相当多的企业在参与工作(如下图)在行业中,每个企业常常扮._码工小熊

LLaMA 简介:一个基础的、650 亿参数的大型语言模型_llma-程序员宅基地

文章浏览阅读1.6w次,点赞2次,收藏2次。还需要做更多的研究来解决大型语言模型中的偏见、有毒评论和幻觉的风险。我们在数万亿个令牌上训练我们的模型,并表明可以仅使用公开可用的数据集来训练最先进的模型,而无需诉诸专有和不可访问的数据集。在大型语言模型空间中训练像 LLaMA 这样的小型基础模型是可取的,因为它需要更少的计算能力和资源来测试新方法、验证他人的工作和探索新的用例。作为 Meta 对开放科学承诺的一部分,今天我们公开发布 LLaMA(大型语言模型元 AI),这是一种最先进的基础大型语言模型,旨在帮助研究人员推进他们在 AI 子领域的工作。_llma

强化学习在制造业领域的应用:智能制造的未来-程序员宅基地

文章浏览阅读223次,点赞3次,收藏5次。1.背景介绍制造业是国家经济发展的重要引擎,其产能和质量对于国家经济的稳定和发展具有重要意义。随着工业技术的不断发展,制造业的生产方式也不断发生变化。传统的制造业通常依赖于人工操作和手工艺,这种方式的缺点是低效率、低产量和不稳定的质量。随着信息化、智能化和网络化等新技术的出现,制造业开始向智能制造迈出了第一步。智能制造的核心是通过大数据、人工智能、计算机视觉等技术,实现制造过程的智能化、自动化...

ansible--安装与使用_pip安装ansible-程序员宅基地

文章浏览阅读938次。系列文章目录文章目录系列文章目录 前言 一、ansible是什么? 二、使用步骤 1.引入库 2.读入数据 总结前言菜鸟一只,刚开始使用,仅作以后参考使用。边学习,边记录,介绍一下最基础的使用,可能会有理解不到位的地方,可以共同交流,废话不多说,走起。一、ansible 简介?ansible是自动化运维工具的一种,基于Python开发,可以实现批量系统配置,批量程序部署,批量运行命令,ansible是基于模块工作的,它本身没有批量部署的能力,真正.._pip安装ansible

推荐文章

热门文章

相关标签