PyxelとChatGPTを使ってPythonを勉強してみる【第4回】
前回(第3回)はこちらです。
Pyxel記事のまとめはこちらです。
・・・・・・
ChatGPTが考えてくれたPyxelで動くゲームをもとにPythonを勉強中です。ゲーム内容は、「プレイヤーを動かして1つの星を集める」というものです。
コードの全容は↓の通りです。
import pyxel
#初期化
class Simplegame:
def __init__(self):
pyxel.init(160,120)
self.player_x = 72
self.player_y = 56
self.star_x = pyxel.rndi(0,160)
self.star_y = pyxel.rndi(0,120)
self.score = 0
pyxel.run(self.update,self.draw)
def update(self):
#playerの移動
if pyxel.btn(pyxel.KEY_UP):
self.player_y = max(self.player_y - 2,0)
if pyxel.btn(pyxel.KEY_DOWN):
self.player_y = min(self.player_y + 2,112)
if pyxel.btn(pyxel.KEY_LEFT):
self.player_x = max(self.player_x - 2,0)
if pyxel.btn(pyxel.KEY_RIGHT):
self.player_x =min(self.player_x + 2,152)
#スターとの衝突判定
if (self.player_x <= self.star_x <= self.player_x + 8 and
self.player_y <= self.star_y <= self.player_y + 8):
self.score += 1
self.star_x = pyxel.rndi(0,160)
self.star_y = pyxel.rndi(0,120)
def draw(self):
pyxel.cls(0)
pyxel.text(5,4,f"Score:{self.score}",pyxel.COLOR_WHITE)
pyxel.rect(self.player_x,self.player_y,8,8,pyxel.COLOR_RED)
pyxel.circ(self.star_x,self.star_y,3,pyxel.COLOR_WHITE)
Simplegame()前回まではここまで勉強しました。
#スターとの衝突判定
if (self.player_x <= self.star_x <= self.player_x + 8 and
self.player_y <= self.star_y <= self.player_y + 8):
self.score += 1
self.star_x = pyxel.rndi(0,160)
self.star_y = pyxel.rndi(0,120)
前回まででupdateメソッドは終わったので、今回の学習でdrawメソッドを新しく勉強します。
そして、このdrawメソッドが終われば、晴れてこのゲームの完成です！やったね！
今回学習するのは、drawメソッドというウィンドウの色やゲーム内のオブジェクトの見た目を決める部分です。
今回学習するコードの内容は以下の通りです。
def draw(self):
pyxel.cls(0)
pyxel.text(5,4,f"Score:{self.score}",pyxel.COLOR_WHITE)
pyxel.rect(self.player_x,self.player_y,8,8,pyxel.COLOR_RED)
pyxel.circ(self.star_x,self.star_y,3,pyxel.COLOR_WHITE)
Simplegame()早速学んでいきましょう。
def draw(self): pyxel.cls(0) pyxel.text(5,4,f"Score:{self.score}",pyxel.COLOR_WHITE) pyxel.rect(self.player_x,self.player_y,8,8,pyxel.COLOR_RED) pyxel.circ(self.star_x,self.star_y,3,pyxel.COLOR_WHITE) Simplegame()
このコードを初心者にも分かるように丁寧に教えてください。
すると、
このコードは、Pyxel で描画を行う draw メソッドを定義し、それを使ってゲームの画面を更新しています。これを一つ一つ分解して説明します。
コード全体の流れ
１，Simplegame クラスを定義します。
２，draw メソッドを定義して、画面の描画内容を決めます。
３，Simplegame のインスタンスを作成してゲームを開始します。
draw メソッドの詳細説明
def draw(self):
pyxel.cls(0)
pyxel.text(5, 4, f"Score:{self.score}", pyxel.COLOR_WHITE)
pyxel.rect(self.player_x, self.player_y, 8, 8, pyxel.COLOR_RED)
pyxel.circ(self.star_x, self.star_y, 3, pyxel.COLOR_WHITE)1. pyxel.cls(0)
pyxel.cls(0) は、画面を指定した色（ここでは色コード 0）でクリア（塗りつぶし）します。
色コード 0 は通常黒色です。したがって、画面全体を黒で塗りつぶして初期化します。
2. pyxel.text(5, 4, f"Score:{self.score}", pyxel.COLOR_WHITE)
pyxel.text(x, y, text, color) は、指定した座標 (x, y) にテキストを描画します。
x: テキストの左端の x 座標（ここでは 5）。
y: テキストの上端の y 座標（ここでは 4）。
text: 描画するテキスト。ここでは f"Score:{self.score}" というフォーマットされた文字列です。self.score は現在のスコアの値に置き換えられます。
color: テキストの色。pyxel.COLOR_WHITE は白色を意味します。
この行は、画面の左上付近に現在のスコアを表示します。
3. pyxel.rect(self.player_x, self.player_y, 8, 8, pyxel.COLOR_RED)
pyxel.rect(x, y, w, h, color) は、指定した座標 (x, y) に幅 w、高さ h の矩形（四角形）を描画します。
x: 矩形の左上の x 座標（ここでは self.player_x）。
y: 矩形の左上の y 座標（ここでは self.player_y）。
w: 矩形の幅（ここでは 8 ピクセル）。
h: 矩形の高さ（ここでは 8 ピクセル）。
color: 矩形の色。pyxel.COLOR_RED は赤色を意味します。
この行は、プレイヤーの位置に赤い四角形を描画します。
4. pyxel.circ(self.star_x, self.star_y, 3, pyxel.COLOR_WHITE)
pyxel.circ(x, y, r, color) は、指定した座標 (x, y) に半径 r の円を描画します。
x: 円の中心の x 座標（ここでは self.star_x）。
y: 円の中心の y 座標（ここでは self.star_y）。
r: 円の半径（ここでは 3 ピクセル）。
color: 円の色。pyxel.COLOR_WHITE は白色を意味します。
この行は、スターの位置に白い円を描画します。
クラスのインスタンス化
Simplegame()この行は Simplegame クラスのインスタンスを作成し、ゲームを開始します。
Simplegame クラスの __init__ メソッドが呼び出され、update メソッドと draw メソッドがゲームループで実行されるようになります。
まとめ
draw メソッドは、画面を黒くクリアし、スコアを表示し、プレイヤーとスターの位置にそれぞれ四角形と円を描画します。
このメソッドは、ゲームループの中で毎フレーム呼び出され、ゲームの画面を更新します。
これで draw メソッドとその周辺のコードの意味が理解できたと思います。もし他にも質問があれば教えてください。
はい、これでchatGPTからこのゲームのコード内容について全て教えてもらいましたね。改めてchatGPTの性能の高さに驚かされますね。無料でピンポイントな質問でも瞬時に精度の高い回答を出してくれます。めちゃくちゃ便利～
さて、肝心のコード内容ですが、GPT君の説明だけで全て理解できました。ただ、カッコ内の要素の順番については自力で覚えないといけないみたいです・・・自分でもまとめてみました。
pyxel.text・・・・・(x座標、y座標、表示したい文章、色)
pyxel.rect・・・・・(x座標、y座標、縦の大きさ、横の大きさ、色)
pyxel.circ ・・・・・(x座標、y座標、半径の長さ、色)
覚えるまではちょっとややこしそうですね。
それ以外は完璧に理解できました。ありがとう！GPT君！
・・・・・・・
さて、コードが全て書き終わったので、いよいよ実行です。
ちゃんと動くのかな・・・
おお！動いたー！！
ちゃんとプレイヤーと星が表示されてプレイヤーが星に触ると星が消滅して乗じてスコアも増えてますね。コードの解説にあった通りの動きをすべてこなしているように見受けられます。
・・・・・・・・
とりあえず、pyxelを使ってゲームを作る感覚は掴めました(まだ、エディターを一切使用していませんが、それらの使いかたよりもコードを理解して書くということを優先したいと思います)。
しかし、このまま新しいゲームを作成するよりも、↑のゲームを作って学んだことを応用したり、改善させたりすることの方がコードを学習するのに簡単で学習効率が良さそうなので、引き続き、この「星集めゲーム」をブラッシュアップさせる方向でいきたいと思います。
次回は、ChatGPTに「星集めゲーム」の改良案を聞いて、ゲームらしくブラッシュアップさせたいと思います。