快精灵印艺坊 您身边的文印专家
广州名片 深圳名片 会员卡 贵宾卡 印刷 设计教程
产品展示 在线订购 会员中心 产品模板 设计指南 在线编辑
 首页 名片设计   CorelDRAW   Illustrator   AuotoCAD   Painter   其他软件   Photoshop   Fireworks   Flash  

 » 彩色名片
 » PVC卡
 » 彩色磁性卡
 » 彩页/画册
 » 个性印务
 » 彩色不干胶
 » 明信片
   » 明信片
   » 彩色书签
   » 门挂
 » 其他产品与服务
   » 创业锦囊
   » 办公用品
     » 信封、信纸
     » 便签纸、斜面纸砖
     » 无碳复印纸
   » 海报
   » 大篇幅印刷
     » KT板
     » 海报
     » 横幅

Flash编程绘画的简朴运用

  Flash MX又增强了其绘图功能,现在,可以使用AS影片对象中的绘画方式让Flash根据程序绘制图形,十分的方便。本文中笔者将通过几个实例来给大家讲解如何使用绘画方式来绘制图形及其相关的知识和技巧。

    效果预览:

« Full Screen »

点击这里下载

  为了使读者很好的理解下面的内容,我们先来做一个简朴的例子――画一条直线。可能有的朋友会说,画一条直线谁不会啊。不是的,是让Flash自己画一条直线。

  打开Flash,点选第1帧,按F9打开“动作面板”,输入如下代码:

// 设置线条样式
_root.lineStyle(3,0xF12345,100);
// 设置线条起点
_root.moveTo(50,0);
// 绘制线条
_root.lineTo(100,0);

  执行一下代码,你将会看到,Flash自动从点(50,0)开始,到点(100,0)结束,绘制一条线宽为3个像素的红色横线。

  现在,我们深入些,让Flash画一个圆。设计这个实例不需要做任何元件,只需要编写几段简朴的代码即可。打开Flash MX,分别点选第2、第3帧,按F7插入空白要害帧,如图1所示。

 图1

  分别点选第1、2、3帧,按F9打开“动作”面板,键入如下代码。其实,这三帧中的代码可以和到一帧中,但为了能使大家更清晰地了解这些代码是如何工作的,笔者把这些代码拆分开来讲解。

  第1帧代码:

// 指定一个线条样式
i=-Math.PI;
_root.lineStyle(2,0x000000,50);
_root.moveTo(50,100);

  代码解析:

  绘画方式lineStyle的用法为myMovieClip.lineStyle ([thickness[,rgb[,alpha]]])。其作用是指定一个线条样式,以便lineTo和curveTo方式的后续调用,直到使用其他参数调用lineStyle为止。也可以在绘制路径的中间调用lineStyle方式来为路径中的不同线条段指定不同的样式。

  其中,thickness是一个整数,以磅为单位指示线条的粗细,有效值为0到255。假如未指定数值,或者该参数为undefined,则不绘制线条。

  rgb是线条的十六进制颜色值(如,红色为 0xFF0000,蓝色为 0x0000FF)。如未指示该值,则默认使用0x000000(黑色)。

  alpha也是一个整数,该参数控制线条颜色的Alpha值,有效值为0到100。假如设置该值,则使用100(纯色)。假如该值小于0,则使用0;假如该值大于100,则使用100。

  绘画方式moveTo的用法是myMovieClip.moveTo (x,y)。其作用是将当前绘画位置移到(x,y),也就是设置绘制图像的原点。假如缺少任何一个参数,则此方式将失败,并且当前绘画位置不改变。参数x(y)是一个整数,指示相对于父影片剪辑的注册点的水平(垂直)位置。_root.moveTo(50,100)就是在x坐标为50个单位,y坐标为100个单位的地方作为起点开始绘制图形。

  第2帧代码:

// 绘制线条
_root.lineTo(100+50*Math.cos(i),100+50*Math.sin(i));
i+=0.05;

  代码分析:

  绘画方式lineTo可以使用线条样式从当前绘画位置向点(x,y)绘制线条;当前绘画位置随后被设置为(x,y)。假如正在其中绘制的影片剪辑包含用绘画工具创建的内容,则调用lineTo将在该内容下面进行绘制。假如在对moveTo方式进行任何调用之前调用了lineTo方式,则当前绘画位置默认为(0,0)。假如缺少任何一个参数,则此方式将失败,并且当前绘画位置不改变。参数x(y)是一个整数,指示相对于父影片剪辑的注册点的水平(垂直)位置。

  Math.sin(x)计算并返回以弧度为单位指定的角度的正弦值。参数x是以弧度为单位的角度值。

  第3帧代码:

// 循环
if (i<Math.PI) {
    gotoAndPlay(2);
} else {
    stop();
}

  Math.PI是一个常数,代表一个圆的周长与其直径的比值的数学常数,也就是3.1415……。

  代码到这里就编写完毕了。当测试的时候,大家可以看到,Flash从点(50,100)开始,绘制一个线宽为2个单位,黑色,半径为50个单位的圆。如图2所示。

  假如你想在1帧中完成所有的事情,编写如下代码即可:

_root.lineStyle(2, 0x000000, 50);
_root.moveTo(150, 100);
function c() {
    _root.lineTo(100+50*Math.cos(i), 100+50*Math.sin(i));
    i += 0.05;
}
if (i<Math.PI) {
// 每隔50毫秒执行一次函数c
    setInterval(c, 50);
} else {
    stop();
}

  教个大家这段代码,主要有两个用意。其一,学习setInterval()的使用方式。该动作在播放影片时,每隔一定的时间间隔,就调用函数、方式或对象。使用这个动作还可以用来更新来自数据库的变量或更新时间显示。其二、笔者把圆形绘制的起点改动了一下,如图3所示。这样,绘制线条的位置就变动了。在绘制图形时,图形的位置控制和预知是很重要的,否则将会一团糟。

  大家已经学习了如何绘制图形了,那,怎么给绘制的图形着色呢?下面,我们来给一个矩形着色。打开Flash,点选第1帧,按F9打开“动作面板”,输入如下代码:

// 设置填充色
beginFill(0xFF0000,100);
lineStyle(3,0xFF9900,100);
moveTo(100,50);
lineTo(200,50);
lineTo(200,150);
lineTo(100,150);
lineTo(100,50);
// 结束着色
endFill();

  代码分析:

  绘画方式beginFill:指示新的绘画路径的开始。myMovieClip.beginFill([rgb[,alpha]])。参数gb是一个十六进制颜色值(例如0xFF0000)。假如未提供或未定义该值,则不创建填充。参数alpha是介于0到100之间的整数,指定填充的Alpha值。假如未提供该值或值大于100,则使用100(纯色)。假如该值小于0,则使用0。

  与beginFill相似的绘画方式BeginGradientFill决定了填色形式、色彩、透明度、比例和矩阵值。用法为:myMovieClip.beginGradientFill (fillType, colors, alphas, ratios, matrix)。其中,fillType为字符串linear或字符串radial。Colors是一个数组,包括要在渐变中使用的RGB十六进制颜色值。Alphas也是一个数组,包括与 colors 数组中颜色相对应的Alpha值。ratios颜色配额的数组;有效值为0到255。该值按100% 定义了对颜色进行采样处的宽度的百分比。Matrix是一个变形矩阵。



  好了,本文到这里就结束了。希望能对喜好使用Flash绘画的朋友有所帮助。




返回类别: Flash教程
上一教程: Flash MX 2004 ActionScript图文教程(八)
下一教程: 用Flash 8 制作燃烧的香烟动画(5)

您可以阅读与"Flash编程绘画的简朴运用"相关的教程:
· Flash绘画教程:漫画中光影的简朴研究
· Flash实用编程五---下雨动画的制作
· Flash实用编程四---下雪动画的制作
· Flash AS编程菜鸟教程下载
· FLASH入门及学AS编程的准确途径
    微笑服务 优质保证 索取样品