![[Scratch3.0]スクラッチで学ぶプログラミング入門 「座標」の説明](https://ukonn.net/wp-content/uploads/2018/12/zahilyou_eyeCatch-min.png)

オラはみんなにスクラッチ(Scratch)を教えるためにやってきた「きんた・まりす」だぞ。
「まりす」って呼んでくれたらうれしいぞ。
今回は「座標」について説明するぞ。
できるだけ簡単に説明するから最後までちゃんと読んで理解するんだぞ。
レッツ・スクラッチだぞ!
この記事の目次
1.「座標」とは
「スクラッチ」では、「スプライト」が「ステージ」のどの位置にいるかを「座標」というものを使って表しているんだぞ。
「座標」には、横の位置を表す「x座標」と、縦の位置を表す「y座標」があるんだぞ。
「座標」は数字で表されていて、この「x座標」と「y座標」の組み合わせで「スプライト」が「ステージ」のどこにいるかを表現するんだぞ。
今は「座標」がどんなものかイメージできないと思うけど、この記事を最後まで読めば、きっと「座標」について理解できるはずだぞ!
ちょうど「スクラッチ」には「Xy-grid」という、座標が分かりやすい背景が用意されているので、この背景を使って説明していくぞ。
横の位置を表す「x座標」について
まずは、横の位置を表す「x座標」について説明するぞ。
もう一度下の画像を見てほしいぞ。
真ん中に黒い点があるぞ。この点は「ステージ」の真ん中を表しているんだぞ。
そして、点の横に(X:0,Y:0)と書かれているのは、「x座標」と「y座標」がそれぞれ「0」であることを表しているぞ。
つまり、「ステージ」の真ん中の「x座標」は「0」ということだぞ。
横の位置を表す「x座標」は、真ん中の「0」から右へ行くほど数字が大きくなっていくぞ。
(下の画像をクリックするとわかりやすいぞ)
ここで一つ気を付けてほしいのが「x座標」は横の位置しか表さないことだぞ。
だから、下の画像のように縦の位置がどこにいても「x座標」は変わらないんだぞ。
こんどは逆に真ん中から左に行くとどうなるかを見てみるぞ。
(下の画像をクリックだぞ)
右に行く時と同じくどんどん数字が大きくなっているけど、数字の横に「-(マイナス)」がついているぞ。
これは「-(マイナス)」って読むんだぞ。
「-(マイナス)」は「0」より小さい数って意味があるんだけど、今はそんなに難しく考えなくても大丈夫だぞ。
ただ、真ん中より左に行くと、「x座標」の数字には「-(マイナス)」がつくってことだけ覚えておけばいいぞ!
後一つ覚えておいてほしいのが、「ステージ」上での「x座標」の一番右の値と一番左の値についてだぞ。
「ステージ」上での「x座標」の一番右の値は「240」だぞ。
(↓画像の赤い点をみてほしいぞ)
逆に「ステージ」上での「x座標」の一番左の値は「-240」だぞ。
(↓画像の赤い点をみてほしいぞ)
でもこの一番右の値と一番左の値はあくまで「ステージ」上での話なんだぞ。
実は、「ステージ」の外側を考えると「x座標」の値はもっと大きくなるんだぞ。
今この話をすると混乱してしまうと思うので、また別の機会にするぞ。
今は、「x座標」の一番右の値は「240」で、一番左の値が「-240」だと覚えておいてほしいぞ。
縦の位置を表す「y座標」について
次は、縦の位置を表す「y座標」について説明するぞ。
もう一度下の画像を見てほしいぞ。
またまた真ん中の黒い点に注目だぞ。
さっきも言ったけどこの点は「ステージ」の真ん中を表していて、点の横の(X:0,Y:0)とか書かれているのは、
「x座標」と「y座標」がそれぞれ「0」であることを表しているぞ。
つまり、「ステージ」の真ん中の「y座標」は「0」ということだぞ。
縦の位置を表す「y座標」は、真ん中の「0」から上へ行くほど数字が大きくなっていくぞ。
(下の画像をクリックするとわかりやすいぞ)
ここで一つ気を付けてほしいのが「y座標」は縦の位置しか表さないことだぞ。
だから、下の画像のように横の位置がどこにいても「y座標」は変わらないんだぞ。
こんどは逆に真ん中から下に行くとどうなるかを見てみるぞ。
(下の画像をクリックしてみてほしいぞ)
上に行く時と同じくどんどん数字が大きくなっているけど、またまた数字の横に「-(マイナス)」がついているぞ。
これも難しく考えなくても大丈夫。
ただ、真ん中より下に行くと、「y座標」の数字には「-(マイナス)」がつくってことだけ覚えておけばいいぞ!
後一つ覚えておいてほしいのが、「ステージ」上での「y座標」の一番上の値と一番下の値についてだぞ。
「ステージ」上での「y座標」の一番上の値は「180」だぞ。
(↓画像の赤い点をみてほしいぞ)
逆に「ステージ」上での「y座標」の一番下の値は「-180」だぞ。
(↓画像の赤い点をみてほしいぞ)
「y座標」も「ステージ」の外側を考えると、もっと大きな数字になるんだけど、さっきも言ったようにこの話はまた今度だぞ。
今は「y座標」の一番上の値は「180」で、一番下の値が「-180」だと覚えておいてほしいぞ。
2.「x座標」と「y座標」の組み合わせで「スプライト」の位置が決まる!
これまでの説明で、「スプライト」が「ステージ」のどの位置にいるかを表すのが「座標」で、
「座標」には横の位置を表す「x座標」と、縦の位置を表す「y座標」があるということが分かったと思うぞ。
今度はいくつか例を見ながら、「座標」について理解を深めていくぞ!
一つ目の例
一つ目の例は、↓の画像の赤い点の「座標」は何なのか考えてほしいぞ。
コツとしては、まず「x座標」が何なのかを考えた後、「y座標」を考えるんだぞ。
ということでまずは「x座標」を見るぞ。
赤い点の「x座標」が何なのかは、オレンジ色の横線を見れば分かるぞ。
横線の下には「100」や「200」など、数字が書かれているんだけど、
この数字は「x座標」が何なのかを表した数字なんだぞ。
赤い点はちょうど「100」の場所にあるぞ。
このことから赤い点の「x座標」は「100」だということがわかるぞ。
次は「y座標」を考えるぞ。
「y座標」が何なのかは、青色の縦線を見れば分かるぞ。
縦線の横にも「100」や「-100」などの数字が書かれているぞ。
この数字は「y座標」が何なのかを表した数字となっているんだぞ。
赤い点はちょうど「y座標」が「0」の場所にあるぞ。
このことから赤い点の「y座標」は「0」だということがわかるぞ。
まとめると、赤い点の「座標」は、
「x座標:100、y座標:0」となるぞ。
二つ目の例
どんどんいくぞ!
二つ目の例は↓の画像だぞ。
赤い点の「座標」を考えるぞ。
まずは横の位置を表す「x座標」だぞ。
赤い点の「x座標」はちょうど「200」の位置にあるぞ。
このことから「x座標」は「200」だとわかるぞ。
次は「y座標」の番だぞ。
赤い点の「y座標」はちょうど「100」の位置にあるぞ。
このことから「y座標」は「100」とわかるぞ。
まとめると、赤い点の「座標」は、
「x座標:200、y座標:100」となるぞ。
三つ目の例
ここから少し難しくなるぞ!
三つ目の例は↓の画像だぞ。
赤い点の座標を考えるぞ。
まずは横の位置を表す「x座標」だぞ。
赤い点の「x座標」はちょうど「-100」の位置にあるぞ。
このことから「x座標」は「-100」だとわかるぞ。
次は「y座標」の番だぞ。
赤い点の「y座標」はさっきと同じでちょうど「100」の位置にあるぞ。
このことから「y座標」は「100」とわかるぞ。
まとめると、赤い点の「座標」は、
「x座標:-100、y座標:100」となるぞ。
四つ目の例
そろそろ「座標」を考えるのは慣れてきたかな?
四つ目の例は↓の画像だぞ。
こんどの赤い点の「座標」はなんだか分かるかな?
まずは「x座標」から考えるぞ。
赤い点の「x座標」は「ステージ」の一番左にあるぞ。
「ステージ」の一番左の「x座標」は「-240」だったから、「x座標」は「-240」となるぞ。
次は「y座標」はだぞ。
赤い点の「y座標」は「ステージ」の一番下にあるぞ。
「ステージ」の一番下の「y座標」は「-180」だったから、「y座標」は「-180」となるぞ。
まとめると赤い点の「座標」は、
「 x座標:-240、y座標:-180」となるぞ。
今出した四つの例が全部分かった人は、「座標」についてはバッチリだと思うぞ!
もし分からない例があったら、周りの大人や先生に聞いて、ちゃんと理解することが大切だぞ!
3.座標の調べ方
「座標」について理解したところで、こんどは「座標」の調べ方について説明するぞ。
調べ方は2つあるぞ。
1.「スプライトリスト」を見る
1つめの調べ方は、「スプライトリスト」を見ることだぞ。
↑図のように、「スプライトリスト」には「スプライト」の「x座標」と「y座標」が表示されるんだぞ。
だから「スプライト」の「座標」が知りたかったら、「スプライトリスト」を見ればすぐわかるんだぞ。
2.「x座標」ブロック、「y座標」ブロックを使う
二つ目の「座標」の調べ方は、「x座標」ブロックと「y座標」ブロックを使うんだぞ。
「x座標」ブロックと「y座標」ブロックの説明を簡単にすると、
「x座標」ブロックには「スプライト」の「x座標」の値が入っていて、
「y座標」ブロックには「スプライト」の「y座標」の値が入っているんだぞ。
そして、それぞれ横に小さい四角があるんだぞ。
この小さい四角は「チェックボックス」といって、クリックすると「チェック」を付けることができるんだぞ。
「x座標」ブロックと「y座標」ブロックの「チェックボックス」にクリックして「チェック」を付けると、
「ステージ」に「x座標」ブロックの値と「y座標」ブロックの値が表示されるんだぞ。
さっきも言ったけど、「x座標」ブロックと「y座標」ブロックにはそれぞれ「x座標」と「y座標」の値が入っているんだぞ。
つまり、この2つのブロックの「チェックボックス」に「チェック」を付けると、「座標」を調べることができるんだぞ!
4.まとめ
さいごにまとめだぞ。
これで「座標」についてはバッチリだぞ!
もし、「座標」のことを忘れてしまったら、またこの記事を読むといいぞ!
それじゃまたな!
↓スクラッチ3.0はこちらをクリック