PlaydateゲームをLuaで作る - スプライトを表示する

前提

• 記事を短くするため説明は最小限です

• 環境はMac

• Playdateゲームをビルドできるようにする方法はこちらの記事を参照してください

やり方

画像を用意する

Sourceディレクトリ内に表示したい画像を用意する
Playdate画面は400x240なのでそれ以下の大きさを推奨（これより大きくても表示はできるが、画面に収まらない）
ここではこのような画像を用意しました

ファイル名は "sample_no_gazou.png"
拙作「CRANK and SHOOT!!」で描いた適当な敵。なんだこれ

以下、Sourceディレクトリ内の構成が重要
今こういう状態

Sourceディレクトリ内にmain.luaとsample_no_gazou.pngがある

コード

main.luaを以下のようにする
ついでにコメントで説明も書いておく

import "CoreLibs/graphics"

local gfx <const> = playdate.graphics                    -- "playdate.graphics" と書く代わりに "gfx" と書けるようにするためのもの

local spriteImage = gfx.image.new("sample_no_gazou")     -- 画像をロードする。ファイル名に拡張子は書かなくて良い
assert(spriteImage, "Failed to load image")              -- 画像のロードに失敗した場合はエラーを出してここで終了する。ファイル名指定を間違っていたらここでエラーになる
local sprite = gfx.sprite.new(spriteImage)               -- 画像を元にスプライトを作成する
sprite:moveTo(100, 100)                                  -- スプライトを移動する　引数は x, y 座標　左上が (0, 0) で右下に行くほど座標が大きくなる
sprite:setZIndex(1)                                      -- スプライトのZインデックスを設定する。Zインデックスが大きいほど手前に表示される 数字は-256から256までの範囲で指定できる
sprite:add()                                             -- スプライトを描画する

function playdate.update()
    gfx.clear()                                          -- 画面をクリアする
    gfx.sprite:update()                                  -- スプライトを更新する
end

これをビルドしてPlaydate Simulatorで動作させてみると、以下のようになる

なんかおる！

moveToで指定する値を変えると位置を変更できるので、自分の好きな画像でいろいろやってみよう

終わり

次はこのスプライトを、キー入力に応じて移動させたり、クランクを回すと回転したりするようにします