「原稿フォーマット」の編集履歴（バックアップ）一覧はこちら

「原稿フォーマット」(2009/06/03 (水) 10:11:34) の最新版変更点

追加された行は緑色になります。

削除された行は赤色になります。

<h1>原稿のフォーマット</h1>
<div>
<h2>デフォルトの表記</h2>
</div>
<ul><li>書式に、マニュアルと同じ表記をする</li>
</ul><ul><li>本文の解説に「デフォルトは○○である」と記述を追加してもよい</li>
</ul><h2>文末表現</h2>
<ul><li>である調で統一</li>
</ul><h1>例（関根さんより）</h1>
<p>
****************************************************************************</p>
<p>◎03 Graphics</p>
<p><br />
☆01 ★直線を描きたい</p>
<p><br />
●解説</p>
<p>
Sprite.graphicsプロパティはインスタンスのもつGraphicsオブジェクトを参照します。そのオブジェクトに対してGraphicsクラスの描画メソッドを使えば、さまざまなベクターシェイプが描けます。直線を引くには、Graphics.moveTo()およびGraphics.lineTo()メソッドを用います。また、線のスタイルはGraphics.lineStyle()メソッドで指定します。</p>
<p><br />
-------------------------------------------</p>
<p>graphics:Graphics</p>
<p><br />
インスタンスのもつGraphicオブジェクトを参照します。</p>
<p><br />
P</p>
<p>AIR 1.0/Flash Player 9</p>
<p><br />
プロパティ値・・・インスタンスがもつGraphicオブジェクト。Graphicsクラスの描画メソッドを使って、インスタンスにシェイプを描くことができます。読取り専用で、Graphicsインスタンスを設定することはできません。</p>
<p>-------------------------------------------</p>
<p><br />
-------------------------------------------</p>
<p>lineStyle(thickness:Number = NaN, color:uint = 0, alpha:Number = 1.0,
pixelHinting:Boolean = false, scaleMode:String = "normal", caps:String = null,
joints:String = null, miterLimit:Number = 3):void</p>
<p><br />
現在の描画位置以降の線のスタイルを指定する</p>
<p><br />
M</p>
<p>AIR 1.0/Flash Player 9</p>
<p><br />
thickness:Number・・・線の太さをポイントで示す整数。0～255までの値を指定する。0は極細線になる。／color:uint
・・・線の色を示す正の整数。通常は16進数で表し、たとえば赤は0xFF0000で指定します。デフォルト値は0の黒(0x000000)。／alpha:Number・・・線の色のアルファ値を示す数値。0が完全な透明で、1.0が完全な不透明。デフォルト値は1.0。／pixelHinting:Boolean
・・・trueに設定すると、ピクセルがフルに描線され、鮮明な線になりる。falseではこの調整が行われないため、たとえば直線と曲線の継ぎ目が途切れて見えることもある。デフォルト値はfalse。戻り値はなし。</p>
<p>-------------------------------------------</p>
<p><br />
-------------------------------------------</p>
<p>moveTo(x:Number, y:Number):void</p>
<p><br />
現在の描画位置を、指定したxy座標に移動する</p>
<p><br />
M</p>
<p>AIR 1.0/Flash Player 9</p>
<p><br />
x:Number・・・親インスタンスの基準点を原点とする水平ピクセル座標値。／y:Number・・・
親インスタンスの基準点を原点とする垂直ピクセル座標値。</p>
<p>戻り値はなし。</p>
<p>-------------------------------------------</p>
<p><br />
-------------------------------------------</p>
<p> lineTo(x:Number, y:Number):void</p>
<p> </p>
<p>現在の描画位置から指定されたxy座標まで直線を描く</p>
<p><br />
M</p>
<p>AIR 1.0/Flash Player 9</p>
<p><br />
x:Number・・・親インスタンスの基準点を原点とする水平ピクセル座標値。／y:Number
・・・親インスタンスの基準点を原点とする垂直ピクセル座標値。</p>
<p>戻り値はなし。</p>
<p>-------------------------------------------</p>
<p><br />
○記述例</p>
<p>以下のスクリプト03-01-001は、タイムラインに描画用のSpriteインスタンスを動的に配置し。座標(20,
20)を左上隅とする100ピクセル四方の正方形を直線で描きます。描画はGraphics.moveTo()メソッドで、(20,
20)の位置から始めています。線のスタイルはGraphics.lineStyle()メソッドにより、上と右の辺が2ポイントの赤(0xFF0000)、下と左の辺は8ポイントの青(0x0000FF)でアルファは50%(0.5)としました(図「直線で描画した正方形」参照)。</p>
<p><br />
△スクリプト「[ライブラリ]から動的に生成したビットマップをBitmapインスタンスで参照してタイムラインに配置」</p>
<p><br />
// フレームアクション</p>
<p>var mySprite:Sprite = new Sprite();</p>
<p>var myGraphics:Graphics = mySprite.graphics;</p>
<p>addChild(mySprite);</p>
<p>myGraphics.lineStyle(2, 0xFF0000);</p>
<p>myGraphics.moveTo(20, 20);</p>
<p>myGraphics.lineTo(120, 20);</p>
<p>myGraphics.lineTo(120, 120);</p>
<p>myGraphics.lineStyle(8, 0x0000FF, 0.5);</p>
<p>myGraphics.lineTo(20, 120);</p>
<p>myGraphics.lineTo(20, 20);</p>
<p><br />
△図「直線で描画した正方形」</p>
<p>【03_01_Graphics_lineTo_001.tif】</p>
<p><br />
タイムラインにシェイプを直接描くのでなく、上記スクリプトのように描画用のSpriteインスタンスを作成・配置して、そのGraphicsオブジェクトを操作する方が、描画と他の処理とを干渉し合わないように分けられるので便利でしょう。</p>
<p><br />
※［MEMO] Sprite.graphicsプロパティは変数に取る</p>
<p>
Sprite.graphicsプロパティで取得するGraphicsオブジェクトの参照は、上記スクリプトのようにGraphicsで型指定した変数に代入しましょう。変数に対してコードヒントが表示されますし、描画メソッドを使うたびにインスタンスのSprite.graphicsプロパティにアクセスするより処理が最適化されます。</p>
<p><br />
上記のスクリプトの処理を分けて、マウスボタンを押したとき（InteractiveObject.mouseDownイベントで）直線の描画を開始し、ボタンを放したときに(InteractiveObject.mouseUpイベントで）終了するようにすると、マウスのドラッグで直線が引けます。さらにドラッグしてマウスを動かしている間(InteractiveObject.mouseMoveイベント)にも描画を続ければ、短い直線の連続として自由な線を描くことができます（図「マウスでドラッグすると自由に線が描ける」参照)。そのように構成したのが、以下のスクリプトです。</p>
<p><br />
△スクリプト「マウスのドラッグで自由な線を描く」</p>
<p><br />
// フレームアクション</p>
<p>var mySprite:Sprite = new Sprite();</p>
<p>var myGraphics:Graphics = mySprite.graphics;</p>
<p>var nThickness:Number = 4;</p>
<p>var nColor:uint = 0x0000FF;</p>
<p>addChild(mySprite);</p>
<p>stage.addEventListener(MouseEvent.MOUSE_DOWN, xBeginLine);</p>
<p>stage.addEventListener(MouseEvent.MOUSE_UP, xEndLine);</p>
<p>function xBeginLine(eventObject:MouseEvent):void {</p>
<p>  myGraphics.lineStyle(nThickness, nColor);</p>
<p>  myGraphics.moveTo(mouseX, mouseY);</p>
<p>  stage.addEventListener(MouseEvent.MOUSE_MOVE, xDrawLine);</p>
<p>}</p>
<p>function xDrawLine(eventObject:MouseEvent):void {</p>
<p>  myGraphics.lineTo(mouseX, mouseY);</p>
<p>}</p>
<p>function xEndLine(eventObject:MouseEvent):void {</p>
<p>  myGraphics.lineTo(mouseX, mouseY);</p>
<p>  stage.removeEventListener(MouseEvent.MOUSE_MOVE, xDrawLine);</p>
<p>}</p>
<p><br />
△図「マウスでドラッグすると自由に線が描ける」</p>
<p>【03_01_Graphics_lineTo_002.tif】</p>
<p><br />
なお、ステージ上のどこでもマウスイベントを受取りたいときは、EventDispatcher.addEventListener()メソッドはStageオブジェクト(DisplayObject.stageプロパティ)に対してイベントリスナーを登録する必要があります。</p>
<p><br />
→関連項目</p>
<p>XX-XX「直線で塗りの図形を描きたい」、XX-XX「矩形を描きたい」、XX-XX「曲線を描きたい」</p>
<p>
****************************************************************************</p>
<p> </p>

<h1>原稿のフォーマット</h1>
<div>
<pre>
デフォルトの表記
</pre></div>
<ul><li>書式に、マニュアルと同じ表記をする</li>
</ul><ul><li>本文の解説に「デフォルトは○○である」と記述を追加してもよい</li>
</ul><pre>
文末表現
</pre>
<ul><li>である調で統一</li>
</ul><pre>
野中さんの原稿整理例（関根さんより）
</pre>
<p>
****************************************************************************</p>
<p>◎03 Graphics</p>
<p><br />
☆01 ★直線を描きたい</p>
<p><br />
●解説</p>
<p>
Sprite.graphicsプロパティはインスタンスのもつGraphicsオブジェクトを参照します。そのオブジェクトに対してGraphicsクラスの描画メソッドを使えば、さまざまなベクターシェイプが描けます。直線を引くには、Graphics.moveTo()およびGraphics.lineTo()メソッドを用います。また、線のスタイルはGraphics.lineStyle()メソッドで指定します。</p>
<p><br />
-------------------------------------------</p>
<p>graphics:Graphics</p>
<p><br />
インスタンスのもつGraphicオブジェクトを参照します。</p>
<p><br />
P</p>
<p>AIR 1.0/Flash Player 9</p>
<p><br />
プロパティ値・・・インスタンスがもつGraphicオブジェクト。Graphicsクラスの描画メソッドを使って、インスタンスにシェイプを描くことができます。読取り専用で、Graphicsインスタンスを設定することはできません。</p>
<p>-------------------------------------------</p>
<p><br />
-------------------------------------------</p>
<p>lineStyle(thickness:Number = NaN, color:uint = 0, alpha:Number = 1.0,
pixelHinting:Boolean = false, scaleMode:String = "normal", caps:String = null,
joints:String = null, miterLimit:Number = 3):void</p>
<p><br />
現在の描画位置以降の線のスタイルを指定する</p>
<p><br />
M</p>
<p>AIR 1.0/Flash Player 9</p>
<p><br />
thickness:Number・・・線の太さをポイントで示す整数。0～255までの値を指定する。0は極細線になる。／color:uint
・・・線の色を示す正の整数。通常は16進数で表し、たとえば赤は0xFF0000で指定します。デフォルト値は0の黒(0x000000)。／alpha:Number・・・線の色のアルファ値を示す数値。0が完全な透明で、1.0が完全な不透明。デフォルト値は1.0。／pixelHinting:Boolean
・・・trueに設定すると、ピクセルがフルに描線され、鮮明な線になりる。falseではこの調整が行われないため、たとえば直線と曲線の継ぎ目が途切れて見えることもある。デフォルト値はfalse。戻り値はなし。</p>
<p>-------------------------------------------</p>
<p><br />
-------------------------------------------</p>
<p>moveTo(x:Number, y:Number):void</p>
<p><br />
現在の描画位置を、指定したxy座標に移動する</p>
<p><br />
M</p>
<p>AIR 1.0/Flash Player 9</p>
<p><br />
x:Number・・・親インスタンスの基準点を原点とする水平ピクセル座標値。／y:Number・・・
親インスタンスの基準点を原点とする垂直ピクセル座標値。</p>
<p>戻り値はなし。</p>
<p>-------------------------------------------</p>
<p><br />
-------------------------------------------</p>
<p> lineTo(x:Number, y:Number):void</p>
<p> </p>
<p>現在の描画位置から指定されたxy座標まで直線を描く</p>
<p><br />
M</p>
<p>AIR 1.0/Flash Player 9</p>
<p><br />
x:Number・・・親インスタンスの基準点を原点とする水平ピクセル座標値。／y:Number
・・・親インスタンスの基準点を原点とする垂直ピクセル座標値。</p>
<p>戻り値はなし。</p>
<p>-------------------------------------------</p>
<p><br />
○記述例</p>
<p>以下のスクリプト03-01-001は、タイムラインに描画用のSpriteインスタンスを動的に配置し。座標(20,
20)を左上隅とする100ピクセル四方の正方形を直線で描きます。描画はGraphics.moveTo()メソッドで、(20,
20)の位置から始めています。線のスタイルはGraphics.lineStyle()メソッドにより、上と右の辺が2ポイントの赤(0xFF0000)、下と左の辺は8ポイントの青(0x0000FF)でアルファは50%(0.5)としました(図「直線で描画した正方形」参照)。</p>
<p><br />
△スクリプト「[ライブラリ]から動的に生成したビットマップをBitmapインスタンスで参照してタイムラインに配置」</p>
<p><br />
// フレームアクション</p>
<p>var mySprite:Sprite = new Sprite();</p>
<p>var myGraphics:Graphics = mySprite.graphics;</p>
<p>addChild(mySprite);</p>
<p>myGraphics.lineStyle(2, 0xFF0000);</p>
<p>myGraphics.moveTo(20, 20);</p>
<p>myGraphics.lineTo(120, 20);</p>
<p>myGraphics.lineTo(120, 120);</p>
<p>myGraphics.lineStyle(8, 0x0000FF, 0.5);</p>
<p>myGraphics.lineTo(20, 120);</p>
<p>myGraphics.lineTo(20, 20);</p>
<p><br />
△図「直線で描画した正方形」</p>
<p>【03_01_Graphics_lineTo_001.tif】</p>
<p><br />
タイムラインにシェイプを直接描くのでなく、上記スクリプトのように描画用のSpriteインスタンスを作成・配置して、そのGraphicsオブジェクトを操作する方が、描画と他の処理とを干渉し合わないように分けられるので便利でしょう。</p>
<p><br />
※［MEMO] Sprite.graphicsプロパティは変数に取る</p>
<p>
Sprite.graphicsプロパティで取得するGraphicsオブジェクトの参照は、上記スクリプトのようにGraphicsで型指定した変数に代入しましょう。変数に対してコードヒントが表示されますし、描画メソッドを使うたびにインスタンスのSprite.graphicsプロパティにアクセスするより処理が最適化されます。</p>
<p><br />
上記のスクリプトの処理を分けて、マウスボタンを押したとき（InteractiveObject.mouseDownイベントで）直線の描画を開始し、ボタンを放したときに(InteractiveObject.mouseUpイベントで）終了するようにすると、マウスのドラッグで直線が引けます。さらにドラッグしてマウスを動かしている間(InteractiveObject.mouseMoveイベント)にも描画を続ければ、短い直線の連続として自由な線を描くことができます（図「マウスでドラッグすると自由に線が描ける」参照)。そのように構成したのが、以下のスクリプトです。</p>
<p><br />
△スクリプト「マウスのドラッグで自由な線を描く」</p>
<p><br />
// フレームアクション</p>
<p>var mySprite:Sprite = new Sprite();</p>
<p>var myGraphics:Graphics = mySprite.graphics;</p>
<p>var nThickness:Number = 4;</p>
<p>var nColor:uint = 0x0000FF;</p>
<p>addChild(mySprite);</p>
<p>stage.addEventListener(MouseEvent.MOUSE_DOWN, xBeginLine);</p>
<p>stage.addEventListener(MouseEvent.MOUSE_UP, xEndLine);</p>
<p>function xBeginLine(eventObject:MouseEvent):void {</p>
<p>  myGraphics.lineStyle(nThickness, nColor);</p>
<p>  myGraphics.moveTo(mouseX, mouseY);</p>
<p>  stage.addEventListener(MouseEvent.MOUSE_MOVE, xDrawLine);</p>
<p>}</p>
<p>function xDrawLine(eventObject:MouseEvent):void {</p>
<p>  myGraphics.lineTo(mouseX, mouseY);</p>
<p>}</p>
<p>function xEndLine(eventObject:MouseEvent):void {</p>
<p>  myGraphics.lineTo(mouseX, mouseY);</p>
<p>  stage.removeEventListener(MouseEvent.MOUSE_MOVE, xDrawLine);</p>
<p>}</p>
<p><br />
△図「マウスでドラッグすると自由に線が描ける」</p>
<p>【03_01_Graphics_lineTo_002.tif】</p>
<p><br />
なお、ステージ上のどこでもマウスイベントを受取りたいときは、EventDispatcher.addEventListener()メソッドはStageオブジェクト(DisplayObject.stageプロパティ)に対してイベントリスナーを登録する必要があります。</p>
<p><br />
→関連項目</p>
<p>XX-XX「直線で塗りの図形を描きたい」、XX-XX「矩形を描きたい」、XX-XX「曲線を描きたい」</p>
<p>
****************************************************************************</p>
<p> </p>