积少成多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.5, 0x999999);

// 以指定的颜色开始填充，在调用 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(0, 0);

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(0, 0);

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(0, 0);

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
[源码下载]

本文链接：https://blog.csdn.net/webabcd/article/details/4608353

原作者删帖不实内容删帖广告或垃圾文章投诉

智能推荐

软件测试流程包括哪些内容？测试方法有哪些？_测试过程管理中包含哪些过程-程序员宅基地

文章浏览阅读2.9k次，点赞8次，收藏14次。测试主要做什么？这完全都体现在测试流程中，同时测试流程是面试问题中出现频率最高的，这不仅是因为测试流程很重要，而是在面试过程中这短短的半小时到一个小时的时间，通过测试流程就可以判断出应聘者是否合适，故在测试流程中包含了测试工作的核心内容，例如需求分析，测试用例的设计，测试执行，缺陷等重要的过程。..._测试过程管理中包含哪些过程

政府数字化政务的人工智能与机器学习应用：如何提高政府工作效率-程序员宅基地

文章浏览阅读870次，点赞16次，收藏19次。1.背景介绍政府数字化政务是指政府利用数字技术、互联网、大数据、人工智能等新技术手段，对政府政务进行数字化改革，提高政府工作效率，提升政府服务质量的过程。随着人工智能(AI)和机器学习(ML)技术的快速发展，政府数字化政务中的人工智能与机器学习应用也逐渐成为政府改革的重要内容。政府数字化政务的人工智能与机器学习应用涉及多个领域，包括政策决策、政府服务、公共安全、社会治理等。在这些领域，人工...

ssm+mysql+微信小程序考研刷题平台_mysql刷题软件-程序员宅基地

文章浏览阅读219次，点赞2次，收藏4次。系统主要的用户为用户、管理员，他们的具体权限如下：用户：用户登录后可以对管理员上传的学习视频进行学习。用户可以选择题型进行练习。用户选择小程序提供的考研科目进行相关训练。用户可以进行水平测试，并且查看相关成绩用户可以进行错题集的整理管理员：管理员登录后可管理个人基本信息管理员登录后可管理个人基本信息管理员可以上传、发布考研的相关例题及其分析，并对题型进行管理管理员可以进行查看、搜索考研题目及错题情况。_mysql刷题软件

根据java代码描绘uml类图_Myeclipse8.5下JAVA代码导成UML类图-程序员宅基地

文章浏览阅读1.4k次。myelipse里有UML1和UML2两种方式，UML2功能更强大，但是两者生成过程差别不大1.建立Test工程，如下图，uml包存放uml类图package com.zz.domain;public class User {private int id;private String name;public int getId() {return id;}public void setId(int..._根据以下java代码画出类图

Flume自定义拦截器-程序员宅基地

文章浏览阅读174次。需求：一个topic包含很多个表信息，需要自动根据json字符串中的字段来写入到hive不同的表对应的路径中。发送到Kafka中的数据原本最外层原本没有pkDay和project，只有data和name。因为担心data里面会空值，所以根同事商量，让他们在最外层添加了project和pkDay字段。pkDay字段用于表的自动分区，proejct和name合起来用于自动拼接hive表的名称为 ..._flume拦截器自定义开发 kafka

java同时输入不同类型数据,Java Spring中同时访问多种不同数据库-程序员宅基地

文章浏览阅读380次。原标题：Java Spring中同时访问多种不同数据库多样的工作要求，可以使用不同的工作方法，只要能获得结果，就不会徒劳。开发企业应用时我们常常遇到要同时访问多种不同数据库的问题，有时是必须把数据归档到某种数据仓库中，有时是要把数据变更推送到第三方数据库中。使用Spring框架时，使用单一数据库是非常容易的，但如果要同时访问多个数据库的话事件就变得复杂多了。本文以在Spring框架下开发一个Sp..._根据输入的不同连接不同的数据库