もりた 
以前の記事、javascriptで遊ぼうの続きです。
やっていることは星を描いて回す、という単純な動作なんですが、もっと複雑なことをするにしても、分割していけば基本はこんな感じになると思います。
今日はこういう描画に関しての基本的なおさらいをしてみます。
まず基本としてStageと呼ばれる領域につらつらと作品を描く感じです。
その作品を描く為にはいろんな道具やアイテムを使う必要があるんですが、その中でも今回は特に、
Shape
Graphics
の2つにフォーカスを当ててみようと思います。
こういうのって、いかにしてイメージを持てるかで理解が変わると思うんです。
なので、関連付けというか感覚的な捉え方として、
Shape -> 紙
Graphics -> 筆
みたいな感じで捉えてます。(厳密に言うとちょっと違いますが)
この紙(Shape)には、筆(Graphics)がセットになっています(という設定)。
筆を使って描きたい図形を描いて塗りつぶしたり、線を描いたりすることでそれが紙に反映されます。
その紙を最初のStageと呼ばれる描画領域の上にぺたっと張り付けていくことで作品が出来上がっていきます。
したがって、イメージ的に
こんな感じかなと。かなりざっくりですが。
筆(Graphics)は紙(Shape)にセットすることができる、紙(Shape)に備え付けてある筆(Graphics)を使うこともできる。
さらにステージには複数の紙(Shape)を置くことができる。
どんなにすごい作品であっても、一つ一つ切り分けて行けば、最終的にはこの概念になります。
今回はShapeにフォーカスを当てましたけど、実際ステージに置けるアイテムはもっとたくさんあります。
画像だったり、文字だったりも。
そして、置いたアイテムは自在に動かす事もできます。
次は、その動かす部分に触れてみようと思います(予定)。
あ、前回のサンプル、GitHubにあげてます。
以上です。
