Forked from: alkaid_72th's SpriteEx View Diff (199)

プログラミングB1-課題2-

alkaid_72th

License: MIT License

Fork
0
Fav
0
View
1450
  • Play

Fullscreen

Smart Phone

  • Readme
  • JavaScript 197 lines
  • HTML 17 lines
  • CSS 1 lines
プログラミングB1の課題2をjsで書いてみた。

※コードの中身を知りたければ「JavaScript」のタブを押してください。


~課題内容~
教科書P.104ページ課題5-6の右側にある、以下の図を描くようなアプレットを
Diamondクラスとして定義して、記述して実行してみてください。


     ■
    ■■■
   ■■■■■
  ■■■■■■■
   ■■■■■
    ■■■
     ■

格子の数は縦横7個ですが、別に奇数個であれば、個数も変えても
構いません。また一つの格子の大きさも変えても構いません。
繰返しを使って、描画して下さい。





~解説~

・22~34行目 //四角形描画
Javaでは g.fillRect(x, y, w, h); に相当する部分なのでJavaで書く場合は気にしなくて良い

addRect(四角形の大きさ, 色, x座標(中心から相対座標), y座標(原点から絶対座標));

ただし、25~26行目は四角形が描画される座標を決めているので注意!!
sprite.x = CENTER_X + (size + 10) * x;//四角形のx座標を決める
sprite.y = (size + 10) * y;//四角形のy座標を決める



・44~52行目 //四角形を正しく並べる関数
何度も書くのが面倒だったので関数化した
なので、Javaでの関数の使い方が分からない、関数って何?って人は64行目と70行目に書かれている
putRect(x, y);//四角形を正しく並べる関数
の部分は46~51行目が書かれているモノだと置き換えてください。

※引数としてxとyを受け取っている

46~48行目:もしxの値が0ならば、
ex)
x = 0;
y = 0;
SCREEN_SIZE = 320; SPRITE_SIZE = 32; N = 7;
CENTER_X = (SCREEN_SIZE - SPRITE_SIZE) / 2; ⇒ 144 の場合
四角形のx座標 = 144 + (32 + 10) * 0; ⇒ x = 144;
四角形のy座標 = (size + 10) * 0; ⇒ y = 0;

48~51行目:もしxの値が0以外ならば、
相対座標xの値だけ離れた場所に四角形を描画する
相対座標-xの値だけ離れた場所に四角形を描画する
ex)
x = 2;
SCREEN_SIZE = 320; SPRITE_SIZE = 32; N = 7;
CENTER_X = (SCREEN_SIZE - SPRITE_SIZE) / 2; ⇒ 144 の場合
四角形x座標 = 144 + (32 + 10) * ±2 ⇒ 60, 228




・54~75行目 //四角形を並べる
x
-3 -2 -1 0 1 2 3
0 ■
1 ■ ■ ■
2 ■ ■ ■ ■ ■
y3 ■ ■ ■ ■ ■ ■ ■
4 ■ ■ ■ ■ ■
5 ■ ■ ■
6 ■

このコードを読む上で頭に入れておきたい xとyの座標関係

60行目:格子の数だけ繰り返す

61~67行目:もし、yの値が格子/2(切り上げ)
63~65行目:xを0としてyの値だけ繰り返す
64行目:44~52行目参照

67~73行目:61行目の条件に一致しないなら(yの値が格子/2以上なら
68行目:xを(格子-1) - yにする
ex)
n = 7, y = 4 の場合
x = (7 - 1) - 4 = 2; ⇒ x = 2;
69~72行目:xが0になるまで繰り返す
70行目:44~52行目参照
  • プログラミングB1-課題2-
  • enchant.js v0.4.0
  • プログラミングB1-課題2-

play

Complete!

Description What kind of game?

Control Device

jsdo.it websocket controller

Mouse

keyboard

smartphone

Fullscreen

Default Panel

Size

  • Width: px
  • Height: px

code

QR Code

Discussion

Questions on this code?

Tags