home > April 2007
my site
April 28, 2007
仕事を辞めて、1週間。そろそろ暇なのにも飽きてしまい、過去の自分の作品集を見直しながら、見せれるものを整理しました。それで作品を3つ追加しました。
1.EXPANSION CIRCLE
4つの円の拡大率を変更できるサンプル。
2.SPIN MOVIE
昔のSONYのやつを自分なりに再現したサンプル。
3.CLOCK COLOR
クリックした時の時間をRGBにして色を記録していくサンプル。
GoogleMapとマッシュアップしたものをアップするつもりでしたが、どうもうまくいかずに残念しました。
Tweet
GoogleMap
April 19, 2007
久しぶりにGoogleMapをいじってみる。コントロールボタン設定はmap.addControl(new GLargeMapControl());、表示画面をコントロールする設定はmap.addControl(new GMapTypeControl());をJavaScript内に書く。また、初めから衛星写真にするにはmap.setMapType(G_SATELLITE_MAP);を書いておけば大丈夫。忘れないようにメモ。
その他の詳細は、ここが詳しく載ってます。↓
http://www.geekpage.jp/web/google-maps-api/
MovableTypeでGoogleMapを表示しようと思ったのですが、どうしても表示されなかったのでいらいらして一時的に諦める。しばらくしてネットで確かめると “どうもロードされるタイミングの問題らしく、スクリプト部分をHeadに持っていって、functionにして、BodyのOnLoadイベントで呼ぶようにしたら見事エラーがも無くなりちゃんと表示されました。” と書いてありました。これでいけるそうですがソースが汚くなるのでやりたくないです。誰かいい方法知りませんでしょうか?
結局、ポップアップ形式になりましたが、データをアップしました。GoogleMapの上にFlashデータをレイヤーにして上に重ねています。AID-DCCの「さあ、新しいエイドへ行こう。」もこの方法でやってるみたいですね。分かってしまえば、それほど難しい事はしてないんですが…。ひらめきとそれを実行に移してしまう行動力はすばらしいです。
※どうやらサンプルはＷｉｎのIE7.0以上でないとちゃんと表示されないようです。Flashのレイヤーを表示するJavaScriptが原因っぽい。
Tweet
crossdomain.xml
April 16, 2007
Flash Playerでは、セキュリティ上外部ドメインからデータを受信することはできません。その時に必要なのがcrossdomain.xmlです。これがロードしたいドメインのルートに入っていればできます。つまりcrossdomain.xmlはFlash Playerに外部サーバへの情報アクセス権限を与える設定ファイルのことです。
ファイル内容は下記です。
＜?xml version="1.0"?＞
＜!DOCTYPE cross-domain-policy SYSTEM
"http://www.macromedia.com/xml/dtds/cross-domain-policy.dtd"＞
＜cross-domain-policy＞
＜allow-access-from domain="外部ファイルを読み込む方のドメイン" /＞
＜/cross-domain-policy＞
Tweet
画像の色取得
April 15, 2007
○ 初期設定
import flash.display.BitmapData;
import flash.geom.ColorTransform;var pict_bd:BitmapData = BitmapData.loadBitmap("hand.jpg");
bitmap_mc.attachBitmap(pict_bd, 0);
○ マウスをマウスをスポイト画像に変更する
this.attachMovie("pointer", "pointer", 1);
pointer._visible = false;
var mouseListener:Object = new Object();
mouseListener.onMouseMove = function():Void {
var xMouse:Number = bitmap_mc._xmouse;
var yMouse:Number = bitmap_mc._ymouse;
if (xMouse >= 0 && xMouse < 663 && yMouse >= 0 && yMouse < 200) {
Mouse.hide();
pointer._visible = true;
pointer._x = _xmouse;
pointer._y = _ymouse;
var clr:Number = pict_bd.getPixel(xMouse, yMouse);
showInfo([xMouse+1, yMouse+1], clr);
} else {
Mouse.show();
pointer._visible = false;
}
updateAfterEvent();
};
Mouse.addListener(mouseListener);
○ カラー設定する
var clrTrans:ColorTransform = new ColorTransform(0, 0, 0, 1, 0, 0, 0, 0);showInfo([0, 0], 0xFFFFFF);
function showInfo(pos:Array, clr:Number):Void {
picker.xPos.text = pos[0];
picker.yPos.text = pos[1];
var obj:Object = colorToRGB(clr);
kpicer.rgb.text = colorToStrRGB(clr);//RGBを表示clrTrans.rgb = clr;
picker.clr.transform.colorTransform = clrTrans;
//カラーイメージに色を設定
var myColor: Color = new Color( colorimg );
myColor.setRGB( clr );
}
○ カラー関数
function colorToRGB(clr:Number):Object {
var r:Number = (clr & 0xFF0000) >> 16;
var g:Number = (clr & 0x00FF00) >> 8;
var b:Number = clr & 0x0000FF;
var obj:Object = {r: r, g: g, b: b};
return obj;
}
//カラーを16進数に
function colorToStrRGB(clr:Number):String {
var rgb:String = ("00000" + clr.toString(16)).substr(-6).toUpperCase();
return rgb;
}
Tweet
setRGB()
April 14, 2007
Flashのカラー設定。まずnew Color（）でカラーオブジェクトを作成してからsetRGB（）で色を設定する。色は16進数で0ｘ＋16進数となる。
var myColor: Color = new Color(myMC);// myColorというカラーオブジェクトを作成
myColor.setRGB(0xFF0000); // myMCが赤になる
そこでこんなのを作ってみました。時間の数字が背景のカラーに反映されている。つまり今の時間色は‥みたいな感じですかね。
ClockColor
ルートに下記のASを記入して、それぞれ数字のMCを作成しておく。
Dateobj = new Date();
var hh = Dateobj.getHours(); //時の取得
var mm = Dateobj.getMinutes(); //分の取得
var ss = Dateobj.getSeconds(); //秒の取得
var mon = Dateobj.getMonth();//週//1の位と10の位を分割
if(hh<=9){
hour1.num = 0;
hour2.num = substring(hh, 1, 1);
}else{
hour1.num = substring(hh, 1, 1);
hour2.num = substring(hh, 2, 1);
}
if(mm<=9){
min1.num = 0;
min2.num = substring(mm, 1, 1);
}else{
min1.num = substring(mm, 1, 1);
min2.num = substring(mm, 2, 1);
}
if(ss<=9){
sec1.num = 0;
sec2.num = substring(ss, 1, 1);
}else{
sec1.num = substring(ss, 1, 1);
sec2.num = substring(ss, 2, 1);
}
var ClockID ="0x" + hour1.num + hour2.num + min1.num + min2.num + sec1.num + sec2.num;
trace(ClockID);//背景に色を設定
var myColor: Color = new Color( myObj );
myColor.setRGB( ClockID );
Tweet
画面中央に配置
April 10, 2007
htmlで画像を画面の中央に配置する方法。分かってるつもりがなかなかできないのでメモ。
body{
margin:0px;
padding:0px;
}
div#main{
overflow:auto;
height:400px;//オブジェクト高さ
width:600px;//オブジェクト幅
position:absolute;
top:50%;
left:50%;
margin-top:-200px;//オブジェクト高さの半分
margin-left:-300px;//オブジェクト幅の半分
}
＜div id="main"＞〜＜/div＞
これで〜部分がブラウザー中央に配置されています。
参考はここ
Tweet
画面解像度
April 06, 2007
ユーザーの画面解像度が分かるASがあるみたい。どういう場合に使うかわ良く分かりませんが一応メモ。
trace(System.capabilities.screenResolutionX);
trace(System.capabilities.screenResolutionY);
Tweet
Flashの透過
やり方は、すごく簡単なんですがすぐに忘れてしまうのでメモしときます。
＜object＞部分に
＜param name="wmode" value="transparent"＞
＜embed＞部分に
＜embed 〜 wmode="transparent"＞
を追加する。
【追記】03/06/2009
wmodeには
opaque 不透明表示と
transparent 透明表示があります。
ただし、Flash Player9以前では不透明opaqueにすると日本語入力にバグが生じます。
その他もfpsにも影響があるようです。
Flash Player10から解消されているようです。
詳しくはこちら
http://d.hatena.ne.jp/jedisystemer/20090227/1235754536
Tweet
Flex
April 03, 2007
最近よく目にするFlexなんですが、正直ハッキリとは意味を理解していなかったのでここでメモしておきます。Flexは、XMLを拡張したMXMLとActionScriptを利用してFlashアプリケーションを作成するフレームワークです。また、Flashでは基本の時間（タイムライン）ベース開発から、イベントベース開発となっています。発売当初は、1CPU当たり150万円という高額ライセンスがネックとなっていたようですが、Flex 2ではライセンス体系が大きく変更され、非常に利用しやすくなっているようです。
Tweet
Gmail
みなさん、知ってましたか？Gmailはユーザ名の後に+を付けていろんな文字列を足しても自分のところに届くことを。例えば、UserName@gmail.comで登録している方はUserName+○○○○@gmail.comでも届きます。これかなり便利です。スパムで困ってる方はお使いください。
元ネタはthebadtimingさんです。
Tweet
Smoothing
ビットマップフォントなど、ドットで構成される文字を拡大したときに見える輪郭のギザギザ（シャギー、エイリアシング）を滑らかに補正する機能のこと。ライブラリーからビットマッププロパティを開いて、スムージングにチェックをすればOK。また、ASでもできるのでそれについてメモしておきます。
import flash.display.BitmapData;
var imgLoader:MovieClipLoader = new MovieClipLoader();
var imgListener:Object = new Object();
imgListener.onLoadInit = function(target_mc:MovieClip):Void {
var _mc:MovieClip = target_mc._parent;
bitmapSmoothing(target_mc, _mc.photo);
_mc.onRelease = function():Void {
(中略)
};
};
imgLoader.addListener(imgListener);
base_mc.createEmptyMovieClip("loader", 1);
base_mc.loader._x = -120;
base_mc.loader._y = -90;
imgLoader.loadClip("cat.jpg", base_mc.loader);
function bitmapSmoothing(loader, holder):Void {
var _bd:BitmapData = new BitmapData
(loader._width, loader._height, true);
_bd.draw(loader);
holder.attachBitmap(_bd, 0, "auto", true);
loader.removeMovieClip();
}
外部からロードしたJPEGに、ビットマップスムージングをかけるには、ロードした画像をonInitのタイミングでBitmapDataにコピーし、コピーのほうをスムージングtrueでアタッチしてオリジナル画像を消去する。
imgLoader.loadClip("frog.png", base_mc.loader);
function bitmapSmoothing(loader, holder):Void {
var _bd:BitmapData = new BitmapData
(loader._width, loader._height, true, 0x00000000);
_bd.draw(loader);
holder.attachBitmap(_bd, 0, "auto", true);
loader.removeMovieClip();
}
Tweet
BitmapData
import flash.display.BitmapData;var data_bd:BitmapData;
createBitmapData();
function createBitmapData():Void {
data_bd = new BitmapData(240, 180, true);
}
function drawPict():Void {
data_bd.draw(pict_mc);
}
function attachDisplay():Void {
display_mc.attachBitmap(data_bd, 0);
}drawBtn.onRelease = function():Void {
drawPict();
};
attachBtn.onRelease = function():Void {
this.enabled = false;
attachDisplay();
};
resetBtn.onRelease = function():Void {
resetBitmapData();
};
function resetBitmapData():Void {
data_bd.dispose();
attachBtn.enabled = true;
createBitmapData();
}
// BitmapData オブジェクトを生成
var data_bd:BitmapData = new BitmapData(240, 180, true);
↓
// ソースイメージを BitmapData オブジェクト上に描画
data_bd.draw(pict_mc);
↓
// BitmapData オブジェクトをムービークリップに関連付け
display_mc.attachBitmap(data_bd, 0);
BitmapData オブジェクト(data_bd)を生成して、draw() すると、
BitmapData オブジェクト(data_bd)上に、ソースイメージ(pict_mc)が描画される。
そこで、MovieClip.attachBitmap() を用いて、
BitmapData オブジェクト(data_bd)をムービークリップ(display_mc)と関連付けすると、
display_mc に描画したソースイメージが表示される。
----------------------------------------------------------
BitmapData コンストラクタ
public BitmapData(width:Number, height:Number, [transparent:Boolean], [fillColor:Number])
指定された幅と高さでBitmapDataオブジェクトを作成します。fillColor パラメータに値を指定した場合、ビットマップのすべてのピクセルにその色が設定されます。
パラメータ
width:Number
ビットマップイメージの幅(ピクセル単位)です。
height:Number
ビットマップイメージの高さ(ピクセル単位)です。
transparent:Boolean (オプション)
ビットマップイメージがピクセル単位の透明度をサポートするかどうかを定義します。デフォルト値は true です(透明)。完全に透明なビットマップを作成するには、transparent パラメータの値を true に、fillColor パラメータの値を 0x00000000(または0) に設定します。
fillColor:Number (オプション)
ビットマップイメージ領域を塗りつぶすのに使用する32ビット ARGB カラー値です。デフォルト値は 0xFFFFFFFF(白) です。
----------------------------------------------------------
attachBitmap (MovieClip.attachBitmap メソッド)
public attachBitmap(bmp:BitmapData, depth:Number, [pixelSnapping:String], [smoothing:Boolean]) : Void
ビットマップイメージをムービークリップに割り当てます。
パラメータ
bmp:flash.display.BitmapData
透明または不透明なビットマップイメージ。
depth:Number
ビットマップイメージを配置するムービークリップ内の深度を指定する整数。
pixelSnapping:String (オプション)
ピクセルへの吸着モード。auto、 always、never のいずれかを指定できます。デフォルトのモードは auto です。
smoothing:Boolean (オプション)
スムージングモードを有効にする場合は true 、無効にする場合は false を指定します。スムージングモードはデフォルトでは有効です。
Tweet
