スワイプ用のコンポーネントの実装が適切でないが…、とりあえずリスト表示まわりを実装した。

アイテムとかの表示ができるようになったので、次はタップして武器を作成できるようにするあたり。 スワイプ用コンポーネントの実装が変なのが気になるんだけど…。

自分で作ったスワイプを実現する仕組みが、ちゃんと動いてないのがわかった。
修正中…。

で、少し見なおしたら修正できたので、次はアイテムのアイコン（のつもりの画像）や、アイテム名を表示するあたりを実装しようと思う。
そこまで実装したら、アイテムがリスト表示された要素をスワイプ操作できるようになるはず。

アイテム閲覧の画面構成をノートに書きだしたので、実装を開始した。

• どの種類のアイテムを閲覧するのかを選ぶタブメニュー
• アイテムがリスト表示されたスワイプできる領域
• アイテムをタップしたときの詳細表示

から構成される予定。
これらの動作は、状態遷移で表現せずにボタンが押された時のコールバックで処理してしまおうと思っている。

とりあえず、タブメニューまでが実装できた。
↓ソースコード
https://bitbucket.org/satofumi/dwarf_weapon_shop/src/e1c0225cad59e28bfa8f87fb6399bbf6a2e308db/src/items.lua?at=default

タブメニューの個々の要素はボタンで構成されているので、下記コードをボタンが押された時のコールバックとして登録することで、メニューの排他まわりを実現している。

-- 押下時のコールバックを登録する
local function decided_callback(button_self)
   -- 押下を排他にする
   for _, button in pairs(button_) do
      if button_self ~= button then
         button:set_normal()
      end
   end

   -- スクロールエリアを切り替える
   -- !!!
end

実装に思っていたよりも時間がかかってしまうのは、ぶっちゃけ辛いけど頑張ろうと思う。

シーンを切り替えるボタンの配置が終わったので、ゲームの情報を表示させてみた。

装飾が全然ないけど、とりあえずはこれで良いことにする。
次は、アイテムなんかの内部のデータ表現をどうするか、とかを決めてしまいたい。
そうしたら、アイテムを閲覧するシーンの実装ができるようになる。

とりあえずシーンを遷移するためのボタン(白色の画素とも言う)を配置て、ボタンを押したらそのシーンへの遷移も行われるようにした。

ソースコード
https://bitbucket.org/satofumi/dwarf_weapon_shop/src/47f005ad6caf3b477855629de1fc1ceade7dbbe4/src/workshop.lua?at=default

さて、ゲームっぽいあたりの実装は、これからだ！

Moai SDK でアニメーションをどうにかする方法の説明は、下記フォーラムの記事にまとめてあった。

http://getmoai.com/wiki/index.php?title=Moai_SDK_Basics_Part_Two

私にとって直感的だったのは、コルーチン内でアニメーションの指示と待機を繰り返す、という方法だったので、そういうコードで文字を明滅させるようにした。

-- tap_message の明滅を指示する
local function blink_text()
   while true do
      tap_message:set_color(Colors.white, C.blink_second)
      Gui:wait(tap_message)

      tap_message:set_color(Colors.black, C.blink_second)
      Gui:wait(tap_message)
   end
end
blink_message_task_ = MOAICoroutine:new()
blink_message_task_:run(blink_text)

依存関係があるようなアニメーションだと混乱しそうだけど、とりあえずはこれで良いことにしたい。

要は、タップしたら次のシーンに進むあたりを実装します。 実装したいことは

• プロローグのメッセージと “Tap to Start” っていう文字列の表示。 “Tap to Start” の方は明滅させたい。
• スクリーンがタップされたら次の状態に進ませる。

だけです。
そして、これを実装したコードが、以下のようになります。

--! \file
--! \brief プロローグの表示

require("name_input")


_G.prologue = {}

local layer_ = nil
local is_tapped_ = false


local function update_components()
   Gui.layers:remove(layer_)
   layer_ = Layer:new()

   -- !!! 背景画像

   local message = Gui.set_text_label(C.prologue.message)
   layer_:insert(message)

   local tap_message = Gui.set_text_label(C.prologue.tap_message)
   layer_:insert(tap_message)

   -- tap_message の明滅を指示する
   -- !!!

   Gui.layers:push_front(layer_)
  end


prologue["Enter"] = function(state)
   update_components()

   is_tapped_ = false

   -- フェード・イン
   Gui.screen:fade_in(C.fade_second)
end


prologue["Execute"] = function(state)
   if Input:force_redraw() then
      update_components()
   end

   -- tap されたら次のシーンに遷移させる
   local x, y, up = Input:pointer()
   if up then
      Gui.screen:fade_out(C.fade_second)
      is_tapped_ = true
   end

   -- フェードアウトが完了したら次のシーンに遷移させる
   if is_tapped_ and not Gui.screen:is_fading() then
      state:change_to(name_input)
   end
end


prologue["Exit"] = function(state)
   Gui.layers:remove(layer_)
   layer_ = nil
end

どこに何を配置する、という画像リソースの場所などの状態は constants.lua に記述してあるので、このコードでは主にロジック的なあたりを表現しています。

「文字列を明滅させるあたりは、どう記述するのが Moai SDK っぽいのか？」は、現在模索中です。 (いずれ実装します。