AS3で背景イメージ等のオブジェクトを全画面表示する「screenFit」クラス

screenFit

screenFit

ActionScript3.0で背景イメージ等のオブジェクトを全画面に表示する「screenFit」クラスを作成しました。

サンプルではオブジェクトのオリジナル縦横比を無視して全画面にフィットさせていますが、デフォルトではオブジェクトのオリジナル縦横比を保持します。

下記のボタンより、ソースのダウンロード及びサンプルの閲覧ができます。

Sample Download

【使用例】

scope(DisplayObjectContainer)を、オリジナルの縦横比を保持して全画面表示


var $screenFit:screenFit = new screenFit(
stage,
scope
);

scope(DisplayObjectContainer)を、オリジナルの縦横比を無視して 1:1.6のアスペクト比で全画面表示(フルスクリーン時には無条件で全画面にフィットさせる)


var $screenFit:screenFit = new screenFit(
stage,
scope,
false,
1.6,
stage.displayState == StageDisplayState.FULL_SCREEN
);

【パラメータ説明】

stage


stageへの参照を渡す
[Stage][省略不可]

$scope


全画面表示する対象オブジェクト
[DisplayObject][省略不可]

aspectReferenceSource


オリジナルの縦横比を保持する
[規定値:true][省略可]

aspect


アスペクト比の指定
[規定値:1.6][省略可]

absolutelyFit


アスペクト比を無視して全画面にフィットさせる
[規定値:false][省略可]

ソースコード

import jp.atziluth.gui.screenFit;


package jp.atziluth.gui{
import flash.display.DisplayObjectContainer;
import flash.display.Sprite;
import flash.display.Stage;
import flash.geom.Point;
public class screenFit extends Sprite {
private var _stage:Stage;
private var sw:uint;
private var sh:uint;
private var $scope:DisplayObjectContainer;
private var aspectReferenceSource:Boolean;
private var aspect:Number;
private var absolutelyFit:Boolean;
public function screenFit(
stage:Stage,
$scope:DisplayObjectContainer,
aspectReferenceSource:Boolean=true,
aspect:Number=1.6,
absolutelyFit:Boolean=false
):void {
if ($scope == null) {
throw new ArgumentError(
"screenFit クラスのターゲットが存在しません。"
);
return;
}
this._stage = stage;
this.$scope = $scope;
this.aspectReferenceSource =
aspectReferenceSource;
this.aspect = aspect;
this.absolutelyFit = absolutelyFit;
init();
}
private function init():void {
sw = _stage.stageWidth;
sh = _stage.stageHeight;
if (absolutelyFit) {
$scope.width = sw;
$scope.height = sh;
} else {
if (aspectReferenceSource) {
aspect = $scope.width / $scope.height;
}
$scope.width = sw;
$scope.height = sw / aspect;
if ($scope.height < sh) {
$scope.height = sh;
$scope.width = sh * aspect;
}
centering($scope);
}
/*
trace("$scope.x: "+$scope.x+" | "+
"$scope.y: "+$scope.y+" | "+
"$scope.width: "+$scope.width+" | "+
"$scope.height: "+$scope.height+" | "+
"aspectReferenceSource: "+
aspectReferenceSource+" | "+
"aspect: "+aspect+" | "+
"absolutelyFit: "+absolutelyFit
);
*/

}
private function centering(
$scope:DisplayObjectContainer
):void {
if ($scope.width >= sw) {
$scope.x = (sw-$scope.width)/2;
}
if ($scope.height >= sh) {
$scope.y = (sh-$scope.height)/2;
}
}
}
}

サンプルソースコード】

Sample.as


package {
import flash.display.MovieClip;
import flash.events.Event;
import flash.display.StageAlign;
import flash.display.StageScaleMode;
import flash.display.StageDisplayState;
import flash.system.Capabilities;
import jp.atziluth.gui.screenFit;
public class Sample extends MovieClip {
private var scope:_Sample=new _Sample();
public function Sample():void {
super();
this.addEventListener(
Event.ADDED_TO_STAGE, init
);
}
private function init(e:Event):void {
this.removeEventListener(
Event.ADDED_TO_STAGE, init
);
this.addChildAt(scope,0);
stage.scaleMode = StageScaleMode.NO_SCALE;
stage.align = StageAlign.TOP_LEFT;
stage.addEventListener(
Event.RESIZE, initResize
);
layout();
}
private function initResize(e:Event=null):void {
layout();
}
private function layout():void {
var $screenFit:screenFit = new screenFit(
stage,
scope,
false,
aspect(),
stage.displayState ==
StageDisplayState.FULL_SCREEN
);
}
private var sw:uint = stage.stageWidth;
private var sh:uint = stage.stageHeight;
private var userResolutionX:uint =
Capabilities.screenResolutionX;
private var userResolutionY:uint =
Capabilities.screenResolutionY;
private function aspect():Number {
var $aspect:Number;
if (stage.displayState ==
StageDisplayState.FULL_SCREEN) {
userResolutionX =
Capabilities.screenResolutionX;
userResolutionY =
Capabilities.screenResolutionY;
$aspect =
getSourceAspect(
userResolutionX,
userResolutionY
);
} else {
sw = stage.stageWidth;
sh = stage.stageHeight;
$aspect = getSourceAspect(sw,sh);
}
return $aspect;
}
private function getSourceAspect(
screenResolutionX:Number,
screenResolutionY:Number
):Number {
return Number(
screenResolutionX/screenResolutionY
);
}
}
}

【懸念事項】

ステージの幅を取得するため、引数に stageへの参照を渡さなくてはならないのが不便に感じています。

あらかじめドキュメントクラス等から public Objectにステージの幅と高さを代入しておけば省略可能になると思うのですが、単体のクラスファイルではそうもいきません。

他の stageを参照するクラスファイルに関しても同様の処理が必要になっているので、この辺りもっと良い方法はないかと頭を抱えています。

また、今回のクラスファイルに関しては Singleton/staticで充分に実現可能なような気もしています。

もし良い方法をご存知の方がおりましたら、こちらのコメント欄か info[at]atziluth.jp宛のメールでご教示いただければ嬉しいです。

Download

AS3でテクスチャを描画する「drawTexture」クラス

drawTexture

drawTexture

ActionScript3.0で任意の大きさ・デザインのテクスチャを描画する「drawTexture」クラスを作成しました。

ボタンのベースデザインや、フルスクリーン表示のムービー補正用テクスチャとして使用できるかもしれません。

サンプルでは、210px四方のテクスチャを 4個ステージ上に配置しています。

下記のボタンより、ソースのダウンロード及びサンプルの閲覧ができます。

Sample Download

【使用例】

1px四方の黒いテクスチャを、横幅:210px*縦幅:210pxの範囲に描画


drawTexture.init(texture, 0x000000, 210, 210);

10px四方の赤いテクスチャを、横幅:200px*縦幅:40pxの範囲に描画


drawTexture.init(texture, 0xCC0000, 200, 40, 10, 10);

1px四方の黒いテクスチャを、横幅:200px*縦幅:40pxの範囲へ縦横3px置きに半透明で描画


drawTexture.init(texture, 0x000000, 200, 40, 1, 1,
3, 3, 0.5);

【パラメータ説明】


$scope : テクスチャを描画するターゲット [DisplayObject] [省略不可]
$color : テクスチャの描画色 [初期値: 0x000000] [省略可]
col : テクスチャを描く横範囲 [初期値: 100] [省略可]
row : テクスチャを描く縦範囲 [初期値: 100] [省略可]
w : テクスチャの横幅 [初期値: 1] [省略可]
h : テクスチャの縦幅 [初期値: 1] [省略可]
intervalX : テクスチャ毎の横間隔 [初期値: 2] [省略可]
intervalY : テクスチャ毎の縦間隔 [初期値: 2] [省略可]
$alpha : テクスチャの不透明度 [初期値: 1] [省略可]

ソースコード

import jp.atziluth.gui.drawTexture;


package jp.atziluth.gui{
import flash.display.DisplayObject;
import flash.display.Sprite;
import flash.display.Shape;
import flash.display.Graphics;
import jp.atziluth.utils.cleaner;
public class drawTexture extends Sprite {
public static function init(
$scope:DisplayObject,
$color:uint=0x000000,
col:uint=100,
row:uint=100,
w:uint=1,
h:uint=1,
intervalX:uint=2,
intervalY:uint=2,
$alpha:Number=1
):void {
if ($scope == null) {
return;
}
var shape:Shape = new Shape();
var scope:Sprite = Sprite($scope);
var g:Graphics = shape.graphics;
function _beginFill():void {
g.beginFill($color, $alpha);
}
function _drawRect():void {
function drawTextureY():void {
for (var Y:uint; Y<(row/h); Y++) {
drawTextureX(Y);
}
}
function drawTextureX(Y:uint):void {
for (var X:uint; X<(col/w); X++) {
if (X % intervalX == Y % intervalY) {
g.drawRect(X*w, Y*h, w, h);
}
}
}
drawTextureY();
}
function addShape(
$scope:Sprite,
$shape:Shape
):void {
if ($scope) {
cleaner.deleteSprite($scope, 0, null);
}
$scope.addChild($shape);
$scope.cacheAsBitmap = true;
}
_beginFill();
_drawRect();
addShape(scope, shape);
}
}
}

サンプルソースコード】

Sample.as


package {
import flash.display.MovieClip;
import jp.atziluth.gui.drawTexture;
public class Sample extends MovieClip {
private var texture1:_container = new _container();
private var texture2:_container = new _container();
private var texture3:_container = new _container();
private var texture4:_container = new _container();
public function Sample():void {
this.addChildAt(texture1, 0);
with (texture1) {
x = 0;
y = 0;
}
drawTexture.init(
texture1, 0x000000, 210, 210
);
this.addChildAt(texture2, 0);
with (texture2) {
x = 210;
y = 0;
}
drawTexture.init(
texture2, 0x000000, 210, 210, 3, 3
);
this.addChildAt(texture3, 0);
with (texture3) {
x = 0;
y = 210;
}
drawTexture.init(
texture3, 0x000000, 210, 210, 10, 10
);
this.addChildAt(texture4, 0);
with (texture4) {
x = 210;
y = 210;
}
drawTexture.init(
texture4, 0x000000, 210, 210, 1, 1, 4, 4
);
}
}
}

Download

xmlPhotogallery: Flash Photo Gallery Template

xmlPhotogallery

xmlPhotogallery

画像ギャラリーを XMLの編集で表示できる Flashテンプレート 「xmlPhotogallery」 を作成しました。*1

ギャラリータイトルや画像のタイトル、画像クリック時のリンク先を指定可能で、オートプレイやフルスクリーン表示に対応しています。

HTMLファイルを編集することにより、詳細設定を変更できます。

Sample Sample [fullscreen] Download

【使用方法】 *2

1. 画像とサムネイルを既定のフォルダ(変更可)へ保存

既定のフォルダ:

・画像: images\
 ・サムネイル: images\thumb\

2. xmlフォルダの "xmlPhotogallery.xml"に、「画像のファイル名」、「タイトル(任意)」、「画像クリック時のリンク先(任意)」を記述

記述例:

<slideNode jpegURL="angelsbone.jpg" title="天使の骨" linkURL="http://atziluth.jp/images/thumb/dca.jpg" />

ex. HTMLファイル 14〜60行目の設定(flashvars)か variables.asを必要に応じて変更

flashvars:

// タイトル・コピーライト表示 ------------------------------------------------
 title:"xmlPhotogallery", //ギャラリータイトル
 isViewTitle:true, //ヘッダーの表示/非表示
 isViewCopyright:true, //コピーライトの表示/非表示
 // xml -----------------------------------------------------------------------
 xmldir:"xml", //XMLフォルダ名
 xmlfile:"xmlPhotogallery.xml", //XMLファイル名
 // image ---------------------------------------------------------------------
 dir:"images", //画像フォルダ名
 thumbdir:"images/thumb", //サムネイル画像フォルダ名
 num:0, //読み込む画像の枚数を指定 (0か未指定の場合は全て読み込む)
 sec:1, //写真のフェードイン秒数
 isshuffle:true, //画像の順番を読み込む度にシャッフルする
 israndom:true, //true で最初に表示される画像がランダムになる
 autoplay:true, //オートプレイモード ON(true)/OFF(false)切替
 interval:5, //オートプレイ時に画像が切り替わる秒間
 // thumbnail -----------------------------------------------------------------
 thumbwidth:72, //サムネイル画像の横幅
 thumbheight:72, //サムネイル画像の縦幅
 margin:20, //サムネイル間の間隔
 cell:0, //サムネイルの折り返し枚数 (0か未指定の場合はステージサイズに応じて可変となる)
 stagemag:"2", //ステージサイズに応じて可変とした場合、ステージサイズの何分の1で折り返すか指定
 // layout: 画像 --------------------------------------------------------------
 photoposition:"right", //画像を表示する位置
 photomarginx:0, //画像と画面端の横間隔
 photomarginy:0, //画像と画面端の縦間隔
 // layout: サムネイル --------------------------------------------------------
 thumbposition:"lefttop", //サムネイル画像を表示する位置
 thumbmarginx:18, //サムネイル画像と画面端の横間隔
 thumbmarginy:108, //サムネイル画像と画面端の縦間隔
 // layout: ナビゲーター ------------------------------------------------------
 navigatorposition:"bottom", //ナビゲーターを表示する位置
 navigatormarginx:0, //ナビゲーターと画面端の横間隔
 navigatormarginy:18, //ナビゲーターと画面端の横間隔
 // layout: 画像タイトル ------------------------------------------------------
 phototitleposition:"lefttop", //画像タイトルを表示する位置
 phototitlemarginx:15, //画像タイトルと画面端の横間隔
 phototitlemarginy:"", //画像タイトルと画面端の横間隔
 // layout: ヘッダー ----------------------------------------------------------
 headerposition:"lefttop", //ヘッダーを表示する位置
 headermarginx:15, //ヘッダーと画面端の横間隔
 headermarginy:8, //ヘッダーと画面端の横間隔
 // layout: コピーライト ------------------------------------------------------
 copyrightposition:"lefttop", //コピーライトを表示する位置
 copyrightmarginx:18, //コピーライトと画面端の横間隔
 copyrightmarginy:52 //コピーライトと画面端の横間隔

【注意事項】

1. アニメーションの動作には、MosesSupposesより配布されている Fuse Kitが必要になります。ご使用の際は下記の手順に従いインストールを進めてください。

[Fuse Kitのダウンロードとインストール]

1. Fuse Kitのサイトにある "Download Fuse 2.1.4"(2009年9月現在)というリンクをクリックし、Fuse Kitをダウンロードします。
2. ダウンロードした zipファイルを解凍し、その中にある "FuseKit2.1.mxp"(Windowsの場合)をダブルクリックして展開します。
3. Adobe® Extension Managerが起動しインストールが開始されますので、完了したら "有効"のチェックボックスをオンにします。

2. サムネイルの画像サイズは、72ピクセル×72ピクセル以上推奨です。デザインの変更は、ライブラリ直下にある "thumbnail"ムービークリップの編集で行うことができます。

【更新履歴】

  • 2009.10.01: 詳細設定を variables.asだけでなく HTMLファイルでも行えるようにした (via id:sshi)
  • 2009.10.01: ギャラリータイトルを変更できるようにした
  • 2009.10.01: ギャラリータイトル・コピーライトの表示/非表示を選択できるようにした
  • 2009.10.14: フルスクリーン時のプリローダー表示不具合を修正

Download

*1:デザインの改変、コピーライト表記の削除共に可能です。

*2:ご使用にあたり不明な点や改善点などありましたら、こちらのコメント欄にてお聞かせください。

Interactive Movie: Synapse

Synapse

Interactive Movie: Synapse
Preview Source

10000回の分裂を行った後、背景に滲んで染み込むという動作をするインタラクティブムービーです。構造体をもう1つ括ればこれを繰り返すことが可能です。*1

シナプス*2細胞分裂/細胞死、バクテリア等、タイトルを付けるまでこれらの特徴と関連性について様々なことを考えましたが、後からなら何とでも言えると思いやめにしました。
でもこういった正邪の区別や正負の概念に縛られないもの、個人の意図を感じさせないものを、もっとより汎用性のある形で書き出していくことは目標の一つです。
自己表現なら日常で既に間に合っているし、それを持て余した人が嬉しい時や寂しい時、何かに向かって一心にそれを行うのもまた理に適っていると思います。

ソースファイル説明書】

1. variables.as: 変数の定義

#include "variables.as"

var sw:Number = Stage.width;//ステージサイズ:横幅指定
 var sh:Number = Stage.height;//ステージサイズ:縦幅指定
 /*-----------------------------------------------------------------*/
 var leftBounds:Number = 20;//左端からの距離
 var topBounds:Number = 20;//上端からの距離
 var rightBounds:Number = sw-leftBounds;//右端からの距離
 var bottomBounds:Number = sh-topBounds;//下端からの距離
 var basemax:Number = 6;//円同士の距離:倍率指定
 var randommin:Number = 2;//乱数の最小値
 var randommax:Number = 6;//乱数の最大値
 var linemax:Number = 10000;//円・ラインを複製する総回数
 var linebackup:Number = 18;//何個前のラインを削除するか
 var scalemag:Number = .4;//円の大きさ:倍率指定
 /*-----------------------------------------------------------------*/
 var fadeoutsec:Number = 3;//フェードアウト:秒数
 var fadeoutdelay:Number = 0;//フェードアウト:待機秒数
 var fadeoutease:String = Strong.easeInOutExpo;//フェードアウト:イージング
 var fadeoutBlur:Number = 48;//フェードアウト:ぼかしフィルタ

2. synapse.as: 円とラインの生成

#include "as/synapse.as"

function init():Void {
  var x:Number = leftBounds;
  var y:Number = topBounds;
  var c:Number = 0;
  function makeLineFunction():Void {
   var line:MovieClip = synapse.attachMovie("line", c+linemax, c+linemax);
   var pastline:MovieClip = eval("synapse."+int(c+linemax-linebackup));
   var circle:MovieClip = synapse.attachMovie("circle", c, c);
   line._x = circle._x=x;
   line._y = circle._y=y;
   distancemax = basemax*randRange(0, randommax);
   distancemin = randommin;
   direction = randRange(0, 1) ? -1 : 1;
   endx = x+(direction*(distancemin+distancemax));
   direction = randRange(0, 1) ? -1 : 1;
   endy = y+(direction*(distancemin+distancemax));
   circle._xscale = distancemax*scalemag;
   circle._yscale = distancemax*scalemag;
   if (endx<leftBounds) endx = leftBounds;
   if (endx>rightBounds) endx = rightBounds;
   if (endy<topBounds) endy = topBounds;
   if (endy>bottomBounds) endy = bottomBounds;
   line._xscale = endx-x;
   line._yscale = endy-y;
   x = endx;
   y = endy;
   pastline.removeMovieClip();
   if (c>linemax) {
    fadeout(synapse, fadeoutsec, fadeoutdelay, fadeoutease, fadeoutBlur, null, null, 100);
    delete synapse.onEnterFrame;
   }
   c++;
  }
  makeLine = makeLineFunction;
  synapse.onEnterFrame = makeLine;
 }
 init();

3. gradFill.as: 背景グラデーションの描画

#include "as/gradFill.as"

var gradationColor:Array = new Array(0x996600, 0x999900);//背景グラデーションの色(上, 下)
 var gradationAngle:Array = new Array(randRange(0, 90), randRange(90, 180));//グラデーションの回転角度
 if (sw==undefined) sw = Stage.width;
 if (sh==undefined) sh = Stage.height;
 function gradFill():Void {
  gradation.createEmptyMovieClip("fill",this.getNextHighestDepth());
  colors = [gradationColor[0], gradationColor[1]];
  alphas = [100, 100];
  ratios = [0, 255];
  matrix = {matrixType:"box", x:0, y:0, w:sw, h:sh/1.618, r:(gradationAngle[0]/gradationAngle[1])*Math.PI};
  gradation.fill.beginGradientFill("linear",colors,alphas,ratios,matrix);
  gradation.fill.moveTo(0,0);
  gradation.fill.lineTo(sw,0);
  gradation.fill.lineTo(sw,sh);
  gradation.fill.lineTo(0,sh);
  gradation.fill.lineTo(0,0);
  gradation.fill.endFill();
 }
 gradFill();

a. initResize.as: ウィンドウリサイズ時の修正

#include "as/initResize.as"

Stage.align = "TL";
 Stage.scaleMode = "noScale";
 function initResize():Void {
  sw = Stage.width;
  sh = Stage.height;
  rightBounds = sw-leftBounds;
  bottomBounds = sh-topBounds;
  gradFill();
 }
 resizeListener = new Object();
 resizeListener.onResize = initResize;
 Stage.addListener(resizeListener);

b. commonFuse.as: フェードアウト時に使用 [Fuse Kit 共通関数]

#include "as/commonFuse.as"

import com.mosesSupposes.fuse.*;
 ZigoEngine.simpleSetup(Shortcuts,PennerEasing);
 ZigoEngine.simpleSetup(Shortcuts,FuseFMP);
 Fuse.AUTOCLEAR = true;
function fadeout(fadeout_mc:MovieClip, s:Number, d:Number, e:String, blur:Number, aimx:Number, aimy:Number, aimalpha:Number, xsc:Number, ysc:Number) {
  s = correctParam(s, 1);
  d = correctParam(d, 0);
  if (e==undefined) e = Strong.easeInOutExpo;
  blur = correctParam(blur, 0);
  aimx = correctParam(aimx, null);
  aimy = correctParam(aimy, null);
  aimalpha = correctParam(aimalpha, 0);
  xsc = correctParam(xsc, 100);
  ysc = correctParam(ysc, 100);
  //trace("s: "+s+" | "+"d: "+d+" | "+"e: "+e+" | "+"blur: "+blur+" | "+"aimx: "+aimx+" | "+"aimy: "+aimy+" | "+"aimalpha: "+aimalpha+" | "+"xsc: "+xsc+" | "+"ysc: "+ysc)
  var fout:Fuse = new Fuse();
  fout.target = fadeout_mc;
  fout.push({Blur_blur:blur, alpha:aimalpha, x:aimx, y:aimy, xscale:xsc, yscale:ysc, ease:e, seconds:s, delay:d});
  fout.start();
 }
 function correctParam(p:Number, n:Number):Number {
  if (p==undefined || isNaN(p)) {
   return (n);
  } else {
   return (p);
  }
 }

c. randRange.as: 乱数の生成 [©Adobe Systems Incorporated]

#include "as/randRange.as"

//Copyright © 2009 Adobe Systems Incorporated. All Rights Reserved.
 function randRange(min, max):Number {
  var i = Math.floor(Math.random()*(max-min+1))+min;
  return (i);
 }

Source

*1:Xbox360が壊れて暇だったから作ったのだと思います。。・゚・(*ノД`*)・゚・。ゲームのない日常なんて月のない夜と同じです…。

*2:シナプス(Synapse)は、神経細胞間あるいは筋繊維(筋線維)、ないし神経細胞と他種細胞間に形成される、シグナル伝達などの神経活動に関わる接合部位とその構造である。via:http://ja.wikipedia.org/wiki/%E3%82%B7%E3%83%8A%E3%83%97%E3%82%B9

Screen Saver: Squall

Squall

Screen Saver: Squall

Preview for Windows for Macintosh

強風や嵐、混沌をコンセプトに作成したスクリーンセーバーです。

Screen Saver: Shineと同じメソッドを使用しています。変更した箇所を下記ソースコード内、黒字で示しています。

1. 基本設定

Stage.align = "TL";
 Stage.scaleMode = "noScale";

 _quality = "LOW";

2. 変数の定義

var sw:Number = Stage.width;//ステージサイズ
 var linemax:Number = 192;//ライン最大複製個数
 var xmin:Number = getXposition();//x座標最小値
 var xmax:Number = sw;//x座標最大値

 var rotationmin:Number = -15;//回転角度最小値
 var rotationmax:Number = 30;//回転角度最大値
 var alphamin:Number = 5;//アルファ最小値

 var alphamax:Number = 30;//アルファ最大値
 
 var c:Number;//ライン複製回数
 var d:Number;//繰り返し回数
 var r:Boolean;//true:偶数回 / false:奇数回 | 繰り返す毎に切り替え

3. ラインを複製

function iterate():Void {
  if (c<linemax) {

   eval("squall_mc.line_mc").duplicateMovieClip("line"+c,c);
   var newline_mc:MovieClip = eval("squall_mc.line"+c);
   var pastline_mc:MovieClip = eval("squall_mc.line"+(c-1));
   newline_mc._x = pastline_mc._x+randRange(xmin, xmax);
   newline_mc._rotation = pastline_mc._rotation+randRange(rotationmin, rotationmax);
   newline_mc._alpha = randRange(alphamin, alphamax);
   if (newline_mc._x<xmin) {
    newline_mc._x = xmin;
   }
   if (newline_mc._x>xmax) {
    newline_mc._x = xmax;
   }
   c++;
  } else {
   xmax = randRange(0, sw);

   xmin = getXposition();
   //r ? r=false : r=true;
   d++;
   c = 0;
  }
 }
 squall_mc.onEnterFrame = iterate;

a. X座標を返す

function getXposition():Number {
  return -1*(sw/5);
 }

b. ウィンドウリサイズ時の修正

resizeListener = new Object();
 resizeListener.onResize = function() {
  sw = Stage.width;
  xmin = getXposition();
  xmax = sw;
 };
 Stage.addListener(resizeListener);
 resizeListener.onResize();

c. 乱数の生成 [©Adobe Systems Incorporated]

//Copyright © 2009 Adobe Systems Incorporated. All Rights Reserved.
 function randRange(min, max) {
  var i = Math.floor(Math.random()*(max-min+1))+min;
  return (i);
 }

Source

Screen Saver: Shine

Shine

Screen Saver: Shine

Preview for Windows for Macintosh

光彩の重なりや目の錯覚をコンセプトに、CMYK+WHの5色を用いて作成したスクリーンセーバーです。

下記のソースコードでは、変更する場合のある箇所を黒字で示しています。*1

1. 基本設定

Stage.align = "TL";
 Stage.scaleMode = "noScale";
 _quality = "MIDDLE";

2. 変数の定義

var sw:Number = Stage.width;//ステージサイズ
 var linemax:Number = 192;//ライン最大複製個数
 var xmin:Number = getXposition();//x座標最小値
 var xmax:Number = sw;//x座標最大値
 var rotationmin:Number = -30;//回転角度最小値
 var rotationmax:Number = 30;//回転角度最大値
 var alphamin:Number = 5;//アルファ最小値
 var alphamax:Number = 45;//アルファ最大値
 var c:Number;//ライン複製回数
 var d:Number;//繰り返し回数
 var r:Boolean;//true:偶数回 / false:奇数回 | 繰り返す毎に切り替え

3. ラインを複製

function iterate():Void {
  if (c<linemax) {

   eval("squall_mc.line"+randRange(1, 4)+"_mc").duplicateMovieClip("line"+c,c);
   //eval("squall_mc.line"+0+"_mc").duplicateMovieClip("line"+c,c);//モノクロームラインへ変更
   var newline_mc:MovieClip = eval("squall_mc.line"+c);
   var pastline_mc:MovieClip = eval("squall_mc.line"+(c-1));

   newline_mc._x = pastline_mc._x+randRange(xmin, xmax);
   newline_mc._rotation = pastline_mc._rotation+randRange(rotationmin, rotationmax);
   newline_mc._alpha = randRange(alphamin, alphamax);
   if (newline_mc._x<xmin) {
    newline_mc._x = xmin;
   }
   if (newline_mc._x>xmax) {
    newline_mc._x = xmax;
   }
   c++;
  } else {
   //r ? r=false : r=true; //奇数回/偶数回の判定
   xmax = randRange(0, sw);
   //r ? xmin=xmax : xmin=getXposition(); //偶数回に x座標最小値変更
   xmin = getXposition();
   d++;
   c = 0;
  }
 }
 squall_mc.onEnterFrame = iterate;

a. X座標を返す

function getXposition():Number {
  
return sw;
 }

b. ウィンドウリサイズ時の修正

resizeListener = new Object();
 resizeListener.onResize = function() {

  sw = Stage.width;
  xmin = getXposition();
  xmax = sw;
 };
 Stage.addListener(resizeListener);
 resizeListener.onResize();

c. 乱数の生成 [©Adobe Systems Incorporated]

//Copyright © 2009 Adobe Systems Incorporated. All Rights Reserved.
 function randRange(min, max) {
  var i = Math.floor(Math.random()*(max-min+1))+min;
  return (i);
 }

Source

*1:ソースファイルの _root[asレイヤー]:5〜12行目の変数書き換えや、line1〜4_mcのデザイン/塗りカラーを変更することで全く印象の異なるムービーを書き出すことができます。ご興味のある方はぜひお試しください。

MovieClip 相対配置関数: relativeLayout.as

全画面表示 Flashにおいて、ウィンドウがリサイズされた際に〈下付き〉や〈右付き〉など、ムービークリップを相対配置する関数 [relativeLayout.as] を作成しました。((改善点/改修ファイルのご提示や、ご意見・ご要望などお寄せいただけると助かります。こちらのコメント欄か、hirokawa[at]atziluth.jp までお願いいたします。 ))

Sample Download

【使用方法】

1. flaファイル任意の箇所に [relativeLayout.as] をインクルード

#include "relativeLayout.as"

2. [relativeLayout.as] 12行目以降の setPosition関数内に、下記 replace関数を記述

【replace関数 使用例】

a. center_mcを、画面中央下から12ピクセルの間隔を持って配置

replace(center_mc,"center",0,-12);

b. rightbottom_mcを、画面右下右から24ピクセルの間隔を持って配置

replace(rightbottom_mc,"rightbottom",24,0);

[パラメータ説明]

replace(
    ムービークリップ名,
    "配置箇所",
    X間隔,
    Y間隔
  );

[配置箇所]

中央: "center"
  上 : "top"
  右 : "right"
  下 : "bottom"
  左 : "left"
  右上: "righttop"
  右下: "rightbottom"
  左下: "leftbottom"
  左上: "lefttop"

Sample
Download