使用頻度大のものをコピー&ペーストで使えるよう 「覚え書」 としたものです。 参考になれば喜。 動作確認は自責で。 | |||
JavaScript の覚え書 | Javaアプレット の覚え書 | ActionScript3 および FlexによるSWF作成 の覚え書 | |
Perl の覚え書 | |||
おもちゃ箱---HTML5作品(JavaScript)、Javaアプレット作品、FLASH作品(ActionScript) を多数置いています | |||
package { import flash.display.*; import flash.text.*; //(テキストフィールド) import flash.media.Sound; //(サウンド) import flash.net.URLRequest; //(外部ファイルから読み込み) import flash.events.*; //(マウスイベント、キーイベント) import flash.events.TimerEvent; //(タイマー) import flash.utils.Timer; //(タイマー) //========================================================================== public class Sample extends Sprite { private var flag6:Boolean=false; //(マウスイベント用) private var textName6:TextField=new TextField(); //(マウスイベント用) private var textName7:TextField=new TextField(); //(キーイベント用) private var textName8:TextField=new TextField(); //(タイマー用) private var flag9:Boolean=false; //(ボタン用) private var textName9:TextField=new TextField(); //(ボタン用) //------------------------------------------------------------ public function Sample() { // ■テキストフィールド----------------------------------- var textName1:TextField=new TextField(); stage.addChild(textName1); textName1.x=10; // 表示位置(x座標) textName1.y=10; // 表示位置(y座標) textName1.width=200; // 表示サイズ(幅) textName1.height=25; // 表示サイズ(幅) textName1.text="Hello World."; var textName2:TextField=new TextField(); stage.addChild(textName2); textName2.x=10; // 表示位置(x座標) textName2.y=60; // 表示位置(y座標) textName2.width=100; // 表示サイズ(幅) textName2.height=80; // 表示サイズ(幅) textName2.textColor=0xff0000; // 文字色 textName2.border=true; // 枠の有無(true:有 false:無) textName2.borderColor=0xff0000; // 枠の色 textName2.background=true; // 背景色の有無(true:有 false:無) textName2.backgroundColor=0x00ff00; // 背景色 textName2.multiline=true; // 複数行表示 textName2.wordWrap=true; // 行の末尾に収まらない単語のとき、単語を丸ごと次の行に送る textName2.autoSize=TextFieldAutoSize.LEFT; // width,heightがテキスト領域の幅に追従する textName2.text="はじめてのActionScript はいかがですか。はじめてのActionScript はいかがですか。"; var textName3:TextField=new TextField(); stage.addChild(textName3); textName3.x=10; // 表示位置(x座標) textName3.y=200; // 表示位置(y座標) textName3.width=220; // 表示サイズ(幅) textName3.height=30; // 表示サイズ(幅) textName3.border=true; // 枠の有無(true:有 false:無) textName3.borderColor=0xff0000; // 枠の色 textName3.text="こんなやり方もあります。"; var format3:TextFormat=new TextFormat(); format3.size=16; // 文字サイズ format3.color=0x0000ff; // 文字色 format3.font="Arial"; // 文字フォント format3.bold=true; // 太字(デフォルトfalse) format3.italic=true; // 斜体(デフォルトfalse) format3.underline=true; // 下線(デフォルトfalse) format3.align="center"; // 表示位置の指定 textName3.setTextFormat(format3); // ■図形(直線、曲線、多角形、円)を描く----------------- var shape:Shape=new Shape(); stage.addChild(shape); var figName1:Graphics=shape.graphics; // 2点 A(x1, y1)、 B(x2, y2) を結ぶ直線を描く figName1.lineStyle(1, 0xff0000, 1.0); //(線の太さ, 線色, 透明度) figName1.moveTo(220, 50); // A点の座標(x1, y1) figName1.lineTo(320, 80); // B点の座標(x2, y2) // 2点 A(x1, y1)、C(x3, y3) を結び、途中、点B(x2, y2) に近づいた曲線を描く figName1.lineStyle(1, 0x00ff00, 1.0); //(線の太さ, 線色, 透明度) figName1.moveTo(140, 50); // A点の座標(x1, y1) figName1.curveTo(200, 110, 250, 80); // B点、C点の座標 (x2, y2, x3, y3) // 3点 A(x1, y1)、 B(x2, y2)、 C(x3, y3) を結ぶ多角形を描く figName1.lineStyle(1, 0x0044ff, 1.0); //(線の太さ, 線色, 透明度) figName1.moveTo(270, 30); // A点の座標 figName1.lineTo(400, 110); // B点の座標 figName1.lineTo(250, 120); // C点の座標 figName1.lineTo(270, 30); // A点の座標 // 3点 A(x1, y1)、 B(x2, y2)、 C(x3, y3) を結ぶ多角形を描く figName1.lineStyle(1, 0x0044ff, 1.0); //(線の太さ, 線色, 透明度) figName1.beginFill(0xff00ff, 1.0); //(塗りつぶす色, 透明度) figName1.moveTo(430, 30); // A点の座標 figName1.lineTo(560, 110); // B点の座標 figName1.lineTo(410, 120); // C点の座標 figName1.lineTo(430, 30); // A点の座標 // 矩形を描く figName1.lineStyle(1, 0x0044ff, 1.0); //(線の太さ, 線色, 透明度) figName1.beginFill(0xff00ff, 1.0); //(塗りつぶす色, 透明度) figName1.drawRect(300, 130, 120, 75); //(300,130)を左上として、幅120、高さ75 の矩形 // 矩形を描く figName1.lineStyle(1, 0x0044ff, 1.0); //(線の太さ, 線色, 透明度) figName1.beginFill(0xff00ff, 1.0); //(塗りつぶす色, 透明度) figName1.drawRoundRect(460, 140, 80, 50, 10 , 10); //(460,140)を左上として幅 80、高さ 50 、角丸部分が 幅 10 高さ 10 でできる角丸矩形 // 円を描く figName1.lineStyle(1, 0x0000ff, 1.0); //(線の太さ, 線色, 透明度) figName1.beginFill(0xff00ff, 0.5); //(塗りつぶす色, 透明度) figName1.drawCircle(640, 80 , 50); //(中心のx座標,y座標,半径) // 楕円を描く figName1.lineStyle(1, 0xff00ff, 1.0); //(線の太さ, 線色, 透明度) figName1.beginFill(0xffff00, 1.0); //(塗りつぶす色, 透明度) figName1.drawEllipse(620, 140, 150, 70); //(620,140)を左上として、幅150、高さ70 の楕円 // 描いた絵を消すには、 figName1.clear(); とすれば、描いた絵がすべて消える。 // ■イメージ(図、写真)を外部ファイルから読み込んで配置する------- //(img/sample.jpg を読み込んで配置する。 img/sample.jpg を自分で用意しておくこと) var image1URL:URLRequest=new URLRequest("img/sample.jpg"); var image1:Loader=new Loader(); image1.load(image1URL); stage.addChild(image1); image1.x=80; // 配置する image1 の左上のx座標 image1.y=220; // 配置する image1 の左上のy座標 image1.scaleX=0.4; // 横倍率 image1.scaleY=0.4; // 縦倍率 image1.rotation=30; // 回転角(度) image1.alpha=0.8; // 透明度 // ■ビットマップ(1)----------------------------------- var bmpData1:BitmapData=new BitmapData(256, 50); // ビットマップのサイズ(幅、高さ) var bmp1:Bitmap=new Bitmap(bmpData1); bmp1.x=400; bmp1.y=400; stage.addChild(bmp1); for(var i:int=0; i<256*50; i++) { var px1:int=i%256; var py1:int=Math.floor(i/256); bmpData1.setPixel(px1, py1, 0x000100*px1+0x000001*py1); // セットピクセル } // ■ビットマップ(2)------------------------------------ var bmpData2:BitmapData=new BitmapData(256, 100, true, 0xaacccccc); // ビットマップのサイズ(幅、高さ、true:32ビットカラー false:24ビットカラー、α値(trueのとき)RGB) var bmp2:Bitmap=new Bitmap(bmpData2); bmp2.x=400; bmp2.y=460; stage.addChild(bmp2); for(var j:int=0; j<256*50; j++) { var px2:int=j%256; var py2:int=Math.floor(j/256); bmpData2.setPixel(px2, py2, 0x000100*px2+0x000001*py2); // セットピクセル } // ■サウンドを外部ファイルから読み込んで配置する( ****.mp3 ファイルのみ)------- //(sound/sample.mp3 を読み込んで配置する。 sound/sample.mp3 を自分で用意しておくこと) var sound1URL:URLRequest=new URLRequest("sound/sample.mp3"); var sound1:Sound=new Sound(sound1URL); sound1.play(); // ■現在の年月日を取得する------------------------------- var today:Date=new Date(); var year:Number=today.getFullYear(); // 年の取得 var month:Number=today.getMonth()+1; // 月の取得 var day:Number=today.getDate(); // 日の取得 var wday:Number=today.getDay(); // 曜日の取得 var weeks:Array=new Array("Sun","Mon","Tue","Wed","Thu","Fri","Sat"); var week:String=weeks[wday]; var textName4:TextField=new TextField(); stage.addChild(textName4); textName4.x=400; textName4.y=250; textName4.width=200; textName4.height=40; textName4.text=month+"/"+day+"/"+week; var format4:TextFormat=new TextFormat(); format4.size=24; format4.color=0x0000aa; format4.font="Times Roman"; textName4.setTextFormat(format4); // ■現在の日時を取得する----------------------------------------------- var today2:Date=new Date(); var hour:Number=today2.getHours(); // 時間の取得 var min:Number=today2.getMinutes(); // 分の取得 var sec:Number=today2.getSeconds(); // 秒の取得 var textName5:TextField=new TextField(); stage.addChild(textName5); textName5.x=400; textName5.y=270; textName5.width=200; textName5.height=40; textName5.text=hour+":"+min+":"+sec; var format5:TextFormat=new TextFormat(); format5.size=24; format5.color=0x0000aa; format5.font="Times Roman"; textName5.setTextFormat(format5); // ■マウスイベント--------------------------------------- stage.addEventListener(MouseEvent.MOUSE_DOWN, onMouseDown); // マウスボタンを押したとき stage.addEventListener(MouseEvent.MOUSE_UP, onMouseUp); // マウスボタンを離したとき stage.addEventListener(MouseEvent.MOUSE_MOVE, onMouseMove); // マウスを移動したとき stage.addEventListener(MouseEvent.MOUSE_WHEEL, onMouseWheel); // マウスホイールを回転させたとき stage.addChild(textName6); textName6.x=300; textName6.y=350; textName6.width=200; textName6.height=30; textName6.border=true; textName6.borderColor=0xff0000; textName6.text="マウスを押してみてください。"; var format6:TextFormat=new TextFormat(); format6.size=15; format6.color=0xff00ff; textName6.setTextFormat(format6); // ■ボタン(テキストフィールドをボタンにする)----------- stage.addChild(textName9); textName9.x=530; textName9.y=350; textName9.width=280; textName9.height=40; textName9.multiline=true; textName9.wordWrap=true; textName9.border=true; textName9.borderColor=0xff0000; textName9.text="テキストフィールドをボタンにしています。 この枠内をマウスクリックしてみてください。"; var format9:TextFormat=new TextFormat(); format9.size=15; format9.color=0xff00ff; textName9.setTextFormat(format9); textName9.addEventListener(MouseEvent.CLICK, onMouseClick); // マウスボタンをクリックしたとき // ■キーイベント----------------------------------------- stage.addEventListener(KeyboardEvent.KEY_DOWN, onKeyDown); // キーを押したとき stage.addEventListener(KeyboardEvent.KEY_UP, onKeyUp); // キーを離したとき stage.addChild(textName7); textName7.x=300; textName7.y=390; textName7.width=200; textName7.height=30; textName7.text="キーコード : "; var format7:TextFormat=new TextFormat(); format7.size=16; format7.color=0xaaaa00; textName7.setTextFormat(format7); // ■タイマー(一定間隔で処理を行う)------------------- var timer1:Timer=new Timer(1000, 3600); //(1000ミリ秒間隔で onTimer1() を呼び出し、3600回処理を行う) timer1.addEventListener(TimerEvent.TIMER, onTimer1); timer1.start(); } // ■マウスボタンを押したとき--------------------------------- private function onMouseDown(evt:MouseEvent):void { if(!flag6) { flag6=true; textName6.text="マウスが押されました。"; } else { flag6=false; textName6.text="マウスを押してみてください。"; } } // ■マウスボタンを離したとき--------------------------------- private function onMouseUp(evt:MouseEvent):void { } // ■マウスを移動したとき------------------------------------- private function onMouseMove(evt:MouseEvent):void { } // ■マウスホイールを回転させたとき--------------------------- private function onMouseWheel(evt:MouseEvent):void { } // ■ボタン(テキストフィールドをボタンにする)--------------- private function onMouseClick(evt:MouseEvent):void { if(!flag9) { flag9=true; textName9.text="テキストフィールドをボタンにしています。 この枠内がクリックされました。"; } else { flag9=false; textName9.text="テキストフィールドをボタンにしています。 この枠内をマウスクリックしてみてください。"; } } // ■キーを押したとき----------------------------------------- private function onKeyDown(evt:KeyboardEvent):void { textName7.text="キーコード:"+evt.keyCode.toString(); var format7:TextFormat=new TextFormat(); format7.size=16; format7.color=0xaaaa00; textName7.setTextFormat(format7); } // ■キーを離したとき----------------------------------------- private function onKeyUp(evt:KeyboardEvent):void { } // ■タイマー------------------------------------------------------------ private function onTimer1(evt:TimerEvent):void { // (ここに一定間隔で行う処理を記述する、例えば以下のように) var today3:Date=new Date(); var hour3:Number=today3.getHours(); // 時間の取得 var min3:Number=today3.getMinutes(); // 分の取得 var sec3:Number=today3.getSeconds(); // 秒の取得 stage.addChild(textName8); textName8.x=500; textName8.y=270; textName8.width=200; textName8.height=40; textName8.text=hour3+":"+min3+":"+sec3; var format8:TextFormat=new TextFormat(); format8.size=30; format8.color=0xcc0000; format8.font="Times Roman"; textName8.setTextFormat(format8); } } } |
■データをHTMLから受け取る ◆このページのトップへ | 更新日 | |
ActionScript3 |
(例)(すべてのファイルを、エンコードの種類を Unicode(UTF-8) として作成すれば日本語文字も可) Sample.as ……… ActionScript3 で書かれたソースコードファイル Sample.swf ……… Sample.as をコンパイルして作られる swf ファイル Sample.html ……… Sample.swf ファイルを表示する html ファイル。 とする。 HTMLから受け取るデータは、str=この文章などを送ります&a=777&b=888" とする。(複数個のデータを扱う場合には、このように & で区切る) (例) まず、 Sample.as のコードは次のようにする。 //************************************************ // Sample.as (データ str,a,b を HTMLから受け取る) //************************************************ package { import flash.display.*; import flash.text.*; //---------------------------------------------------------------- public class Sample extends Sprite { //------------------------------------------------------------ public function Sample() { var flashvars:Object=LoaderInfo(loaderInfo).parameters; // HTMLからデータを受け取る--- var str:String=flashvars["str"]; var a:int=parseInt(flashvars["a"]); // 数字を数値化する var b:int=parseInt(flashvars["b"]); // 数字を数値化する var txt:TextField=new TextField(); // 受け取ったデータを表示する--- stage.addChild(txt); txt.x=100; txt.y=100; txt.width=300; txt.height=20; txt.text="str="+str+" a="+a+" b="+b; var ft:TextFormat=new TextFormat(); ft.size=14; ft.color=0xff0000; txt.setTextFormat(ft); } } } Sample.html は、例えば次のようにする。 <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <title>Sample</title> </head> <body> <object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,29,0" width="400" height="300"> <param name="movie" value="Sample.swf" /> <param name="base" value="." /> <param name="quality" value="high" /> <param name="FlashVars" value="str=この文章などを送ります&a=777&b=888" /> <embed src="Sample.swf" base="." quality="high" pluginspage="http://www.macromedia.com/shockwave/download/index.cgi?P1_Prod_Version=ShockwaveFlash" type="application/x-shockwave-flash" width="400" height="300"></embed> </object> </body> </html> |
2009.01.10 |
■データをCGIへ送信する ◆このページのトップへ | 更新日 | |
ActionScript3 |
「送信」 ボタンをクリックしたらデータを送信し、そのデータを別ファイルに書き込む、ことをやってみる。 (例)(すべてのファイルを、エンコードの種類を Unicode(UTF-8) として作成すれば日本語文字も可) Sample.as ……… ActionScript3 で書かれたソースコードファイル Sample.swf ……… Sample.as をコンパイルして作られる swf ファイル Sample.cgi ……… Sample.swf ファイルを表示する cgi ファイル Save.cgi ……… 送られてきたデータを書き込む cgi ファイル txt.data ……… データを上書きするファイル(なければ勝手に作る) とする。 送信するデータは、str="この文章を送信します" とする。 まず、 Sample.as のコードは次のようにする。 //************************************************ // Sample.as (データ str を Save.cgi に送信する) //************************************************ package { import flash.display.*; import flash.text.*; import flash.events.*; import flash.net.*; //---------------------------------------------------------------- public class Sample extends Sprite { private var str:String; //------------------------------------------------------------ public function Sample() { str="この文章を送信します"; var txtSave:TextField=new TextField(); // 送信ボタンを設置する stage.addChild(txtSave); txtSave.x=100; txtSave.y=120; txtSave.width=80; txtSave.height=20; txtSave.background=true; txtSave.backgroundColor=0xffdddd; txtSave.border=true; txtSave.borderColor=0x888888; txtSave.text="送信"; var ft:TextFormat=new TextFormat(); ft.size=12; ft.color=0x000000; ft.align="center"; txtSave.setTextFormat(ft); txtSave.addEventListener(MouseEvent.CLICK, botanSave); } //------------------------------------------------------------ private function botanSave(evt:MouseEvent):void { var req:URLRequest=new URLRequest(); req.url="Save.cgi"; req.data=str; req.method=URLRequestMethod.POST; navigateToURL(req, "_self"); return; } } } 次に Sample.swf を表示する Sample.cgi は、例えば次のようにする。 #************ # Sample.cgi #************ #!/usr/local/bin/perl print "Content-Type: text/html; charset=UTF-8P\n\n"; #=========================================== print <<"PAGE1"; <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <title>Sample</title> </head> <body> <object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,29,0" width="600" height="400"> <param name="movie" value="Sample.swf" /> <param name="base" value="." /> <param name="quality" value="high" /> <embed src="Sample.swf" base="." quality="high" pluginspage="http://www.macromedia.com/shockwave/download/index.cgi?P1_Prod_Version=ShockwaveFlash" type="application/x-shockwave-flash" width="600" height="400"></embed> </object> </body> </html> PAGE1 exit; さらに、Save.cgi は、例えば次のようにする。 #************ # Save.cgi #************ #!/usr/local/bin/perl print "Content-Type: text/html; charset=UTF-8P\n\n"; #==================================================== read(STDIN, $buffer, $ENV{'CONTENT_LENGTH'}); # 入力データの読み込み if($buffer) { open(OUT, ">txt.dat"); flock(OUT,2); print(OUT "$buffer\n"); close(OUT); flock(OUT,8); #--------------------------------------------- $check_msg="「txt.dat」ファイルに保存しました。"; &check_hyouzi; } else { $check_msg="保存できませんでした。"; &check_hyouzi; } exit; #********************************************************************* sub check_hyouzi{ print <<"HYOUZI"; <HTML> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <BODY> $check_ms </BODY> </HTML> HYOUZI exit; } |
2009.01.10 |