Flash与位图：woderfl案例（一）
发布时间：2020-12-15 07:03:10 所属栏目：百科 来源：网络整理
导读：原文地址：http://news.9ria.com/2013/1008/33039.html ? woderfl 里面有着很多as3的制作技巧，其中有一本书里面介绍着很多相关的解说。里面大部分好的代码都是来自wonderfl里面的人兴趣编写出来的。这本书只有亚马逊才有得购买，而且只有外购才能。所以没办
|
原文地址：http://news.9ria.com/2013/1008/33039.html ? woderfl 里面有着很多as3的制作技巧，其中有一本书里面介绍着很多相关的解说。里面大部分好的代码都是来自wonderfl里面的人兴趣编写出来的。这本书只有亚马逊才有得购买，而且只有外购才能。所以没办法看到里面的介绍和解说。不过好运的事，里面解说的代码在beautifl都有收录进去，所以很方便进行对里面代码阅读。因为这本书据说只是解说偏多，理论的东西不是很多。 ? 这本书的目录可以上亚马逊进行阅读，第一章节里面解说是采用HelloWorld开头进行解说。 案例一可以参考这里：http://wonderfl.net/c/nCFQ 案例中采用的技巧如下：（采用两层循环遍历位图数据，获取颜色值，并根据坐标信息产生运动效应） 过程： 创建一个文本，通过一个位图进行复制。 获取到位图对其进行遍历，获取不同的颜色。然后采用Tweener的类库对其产生不规则的运动。 本次使用的位图API 不多，获取颜色是采用getPixel 这个函数，整体看起来这个案例并不复杂，但是里面采用的技巧也是很普遍的一种手法。 如 随机位置，扫描像素值，延迟时间产生运动过程，这些手法也是在as3里面常用到。在这本书里面收录很多案例。 [java]?
package{
import flash.display.*;
import flash.text.*;
import flash.filters.*;
import flash.geom.*;
import caurina.transitions.Tweener;
public class Foo extends Sprite{
private var bd:BitmapData;
public function Foo():void{
var tf:TextField = new TextField();
tf.textColor = 0x000000;
tf.text = "HellonWorld!!!";
tf.;
bd = new BitmapData(tf.width,tf.height,false,0x3399ff);
bd.draw(tf);
bd.applyFilter(bd,bd.rect,new Point(),new BlurFilter());
bd.draw(tf);
for(var i:int = 0; i < bd.width; i++){
for(var j:int = 0; j < bd.height; j++){
Tweener.addTween(
randomize(addChild(new Circle(bd.getPixel(i,j)))),{
x: i * 10,y: j * 10,alpha: 1,delay: (i + j) * .2 * Math.random(),time: 1
}
);
}
}
}
private function randomize(d:DisplayObject):DisplayObject{
d.x = 400 * Math.random();
d.y = 300 * Math.random();
d.alpha = 0;
return d;
}
}
}
import flash.display.Sprite;
class Circle extends Sprite{
public function Circle(color:uint):void{
graphics.beginFill(color);
graphics.drawCircle(0,6);
graphics.endFill();
}
}
你可以改成其他文本，进行复制，产生的效果也会不一样。 第二案例，收录一个牛人制作飘雪字的技巧。效果看起来很漂亮
收录的地址在这里：? 代码收录如下 当中采用了一个闪星的制作技巧，用法很特别。当中也比较核心的一点是采用粒子运动的方式来进行。让整个程序看起来就像一个艺术品那样子。整本书的目录里面可以看到，这些程序都是比较有技巧性而且想法比较独特。看这些代码也是一种享受。 [java]?
package {
import flash.display.Bitmap;
import flash.display.BitmapData;
import flash.display.BlendMode;
import flash.display.PixelSnapping;
import flash.display.Sprite;
import flash.events.Event;
import flash.filters.BlurFilter;
import flash.geom.Matrix;
import flash.geom.Point;
import flash.text.TextField;
import flash.text.TextFieldAutoSize;
import flash.text.TextFormat;
import net.hires.debug.Stats;
[SWF(width=465,height=465,backgroundColor=0x0,frameRate=120)]
public class Saq001 extends Sprite {
private static const GRAVITY:Number = 20;
private static const DRAG:Number = 0.3;
private var _canvas:BitmapData;
private var _glow:BitmapData;
private var _glowMtx:Matrix;
private var _forceMap:BitmapData;
private var _snow:Array;
public function Saq001() {
this._canvas = new BitmapData(465,465,0x0); // カンバスをつくる。ここに 1 pixel ずつ描いていくよ
this.addChild(new Bitmap(this._canvas)) as Bitmap; // stage に配置
this._glow = new BitmapData(465 / 4,465 / 4,0x0); // キラキラを描く用のん。カンバスの 4 分の 1 のサイズ
var bm:Bitmap = this.addChild(new Bitmap(this._glow,PixelSnapping.NEVER,true)) as Bitmap; // smoothing を true にして配置
bm.scaleX = bm.scaleY = 4; // 4 倍にする。
bm.blendMode = BlendMode.ADD; // 加算モードで合成
this._glowMtx = new Matrix(0.25,0.25);
// 雪を積もらせるかたちを BitmapData に描く。
var tf:TextField = new TextField();
tf.defaultTextFormat = new TextFormat('Verdana',64,0xffffff,true);
tf.autoSize = TextFieldAutoSize.LEFT;
tf.text = 'Wonderfl!!';
tf.x = (465 - tf.width) / 2;
tf.y = (465 - tf.height) / 2;
this._forceMap = new BitmapData(465,0x0);
this._forceMap.draw(tf,tf.transform.matrix);
this._forceMap.applyFilter(this._forceMap,this._forceMap.rect,new Point(0,0),new BlurFilter(8,8));
this._snow = []; // 雪パーティクルはここにいれておくよ。
this.addChild(new Stats());
this.addEventListener(Event.ENTER_FRAME,this.update); // 毎フレーム update を呼ぶよ
}
// 雪を 1 粒発生させる関数
public function emitParticle(ex:Number,ey:Number,s:Number = 1,c:int = 0xffffff,vx:Number = 0,vy:Number = 0):void {
var p:SnowParticle = new SnowParticle(); // 作って
// パラメータ設定して
p.x = ex;
p.y = ey;
p.vx = vx;
p.vy = vy;
p.s = s;
p.c = c;
this._snow.push(p); // 保存
}
// 雪を動かすよーー
public function update(e:Event):void {
this._canvas.lock(); // いっぱい setPixel するときは必ず lock しよう
this._canvas.fillRect(this._canvas.rect,0x0); // カンバスをクリア
var n:int = this._snow.length;
var d:Number;
var gravity:Number = GRAVITY / 1000; // あらかじめ計算しとく
while (n--) {
var p:SnowParticle = this._snow[n];
p.vy += gravity * p.s; // まず重力を加える
p.vx *= 0.99; // 空気抵抗
p.vy *= 0.99; // y 方向にも
d = 1 - (this._forceMap.getPixel(p.x,p.y) / 0xffffff) * DRAG; // forceMap にもとづいて抵抗値を計算。伽ぁ住Wい。
p.vx *= d; // forceMap から得た抵抗値を適用
p.vy *= d; // y 方向にも
p.x += p.vx; // 動かす
p.y += p.vy;
this._canvas.setPixel(p.x,p.y,p.c); // 雪 1 粒描く
if (p.y > this.stage.stageHeight) { // もし画面外にでちゃったら
this._snow.splice(n,1); // とりのぞく
}
}
this._canvas.unlock(); // lock したやつは必ず unlock
this._glow.draw(this._canvas,this._glowMtx); // キラキラを描く
// 雪を発生させますよ
n = 10;
while (n--) {
this.emitParticle(Math.random() * this.stage.stageWidth,Math.random() + 0.5);
}
}
}
}
class SnowParticle {
public var x:Number;
public var y:Number;
public var vx:Number;
public var vy:Number;
public var s:Number;
public var c:int;
public function SnowParticle() {
this.x = 0;
this.y = 0;
this.vx = 0;
this.vy = 0;
this.s = 1;
this.c = 0xffffff;
}
}
（编辑：李大同） 【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容! |
