ikosamiのCode on Rmake 講座「10/21(木)更新」

投稿者:Material 7186 1 mini ikosami 投稿日:2013/07/18 20:44


重要なので先に書いておきます。

↓が、ゲーム終了ですので、これがないと強制終了以外でメニューに戻れなくなります。
game.change_project "start_menu"



参考サイト
http://magazine.rubyist.net/?0002-FirstProgramming



「はじめに」

 Code on Rmakeのゲームの作り方が、最初よくわからなかったので
とりあえず、色々試して、調べてみました。
専門的な用語はまったくわからないので、逆にわかりやすくなっていると思いますが
間違っていることを書いていた場合は、ご指摘願います。



「1.文章を表示する」

speak("文章")


Rmakeの普通のスクリプトと同じで、これだけあれば文章が表示できます。
しかし、これだけだと枠がないので最初に枠の画像を読み込む必要があります。



#枠の画像を読み込む
game.loading do |loader|
  loader.add :window, :system => "window"
  loader.add :gui_item, :system => "gui_item"
end

#枠の画像を設定する
game.on_init do
  set_window_image :window
  set_gui_image :gui_item
 #文章を表示する 
  speak("文章")
end



これで、枠のある文章が表示できます。
windowが枠そのものの画像で、gui_itemが右下の矢印の画像です。



ゲームに画像などの情報を読み込む時には
game.loading do |loader|
#読み込む内容
end

この中に入れる必要があります。(入れなくても動きはします。)

これをスクリプトの一番最初に入れる事を心がけておきましょう。
読み込む画像も音楽も効果音も何もないゲームをつくるのなら、いらないです。



  set_window_image :window
  set_gui_image :gui_item
  speak("文章")

枠の画像を設定する部分が外に出ていると反応しませんので
このような書き方をしても反応しません。


「2.シーンに入れる」

 ゲームは普通シーンの中に処理を入れて作ります。
シーンの中に入れておけば、状況に応じて別のシーンに飛ぶことができますし、
画像などは基本的にシーンの中でしか表示できません。

scene :「シーンの名前」 do |scene|
  #中身
end

これがシーンです。
「シーンの名前」の部分は自分にわかりやすいもので構いません。

   scene_change :「シーンの名前」

これで、その指定したシーンへ飛ぶことができます


以下のように書けば、文章という表示の無限ループです。
game.loading do |loader|
  loader.add :window, :system => "window"
  loader.add :gui_item, :system => "gui_item"
end

game.on_init do
  set_window_image :window
  set_gui_image :gui_item
  scene_change :start_scene
end

scene :start_scene do |scene|
 speak("文章")
end


scene :start_scene do |scene|
 speak("文章")
 scene_change :start_scene
end





「3.選択肢を表示する」

 文字を画面に表示して、それをタップ(もしくはクリック)したかどうかという判定が
これだけで可能です。
    text = scene.text :position => [200, 200]
    text.set_text_area_size 250, 200
    text.set_font_point_size 32
    text.set_text ("文章")
    text.event :on_click do |event|
     #選んだ時の処理
    end



1行目が、表示する座標のX,Y
2行目が、文字を表示するエリア
この二つ合わせて普通のRmakeの画面テキスト生成(createText関数)でのと同じです
3行目が文字サイズ
4行目が見てわかる通り表示する文章です。

ただ表示したいだけなら、この4行目まででいいです。


5行目以降は、クリック(タップ)された場合に
どのような処理を行うかの設定のため、処理がここを通過した後、
例えば、この後ろにspeak("")とか入れたとしても
クリックしたら中身の処理がちゃんと行われます。

text = とあるから、複数作る時は
text2 =  text3 = などと作らなくてはいけないかと思いきや
全部text = で良いみたいです。
変える必要があるのは、座標と文章と処理くらいです。



 選択肢にする場合は、複数の文字を表示し選んで
タップ(もしくはクリック)するという形にすればいいです。

下は実際に作った選択肢スクリプトのサンプルです。
公開しているので、よかったらやってみてください。
ID:35です。
game.loading do |loader|
  loader.add :window, :system => "window"
  loader.add :gui_item, :system => "gui_item"
end

game.on_init do
  set_window_image :window
  set_gui_image :gui_item
  speak("う~ん。どこへ行こうか?")
#シーンへ飛ぶ
  scene_change :start_scene
end



scene :start_scene do |scene|
#この↓のtextとかの部分を変える必要がないので結構楽です。
    text = scene.text :position => [300, 410]
    text.set_text_area_size 250, 200
    text.set_font_point_size 32
    text.set_text ("選んでください")
    
    text = scene.text :position => [50, 100]
    text.set_text_area_size 250, 200
    text.set_font_point_size 32
    text.set_text ("平原へ")
    text.event :on_click do |event|
      speak("平原へ出かけよう")
      speak("いやまてよ? 平原には草しかないぞ?\n別の場所にしよう。")
      scene_change :start_scene
    end
    text = scene.text :position => [250, 100]
    text.set_text_area_size 250, 200
    text.set_font_point_size 32
    text.set_text ("荒地へ")
    text.event :on_click do |event|
      speak("荒地へ出かけよう")
      speak("いやまてよ? 荒地は歩きにくいぞ?\n別の場所にしよう。")
      scene_change :start_scene
    end
    text = scene.text :position => [450, 100]
    text.set_text_area_size 250, 200
    text.set_font_point_size 32
    text.set_text ("山地へ")
    text.event :on_click do |event|
      speak("山地へ出かけよう")
      speak("いやまてよ? 山に入ったら迷うぞ?\n別の場所にしよう。")
      scene_change :start_scene
    end
    text = scene.text :position => [650, 100]
    text.set_text_area_size 250, 200
    text.set_font_point_size 32
    text.set_text ("戻る")
    text.event :on_click do |event|
      speak("いったん引き返そう")
      #シーンa(名前はてきとう)へ飛ぶ 飛ぶと画面テキスト消えます
      scene_change :a_scene
    end
end

scene :a_scene do |scene|
        speak ("結局、引き返すことになった")
      # スタートメニューに戻る
      game.change_project "start_menu"
end





「4.変数を設定し表示する」

 変数の設定は、通常通り、a = 0 などで良いのですが、
表示する場合には、変数の後ろに、「.to_s」をつける必要があります。
「.to_s」は、数字を文字列に変換するものです。

a = 0
speak a.to_s


ランダムのrand()関数も、そのまま使えるため、
a = rand(50)
speak a.to_s

などにすれば、すこし変数らしいです。

※注意!
変数は、シーンを変えたりすると、消えてしまって
読み込もうとしても動作しなくなります。

別のシーンでも使いたい場合はこれを使ってください。
http://blog.rmake.jp/ikosami/4608



「5.条件分岐をつくる」

 条件分岐は、
一つの変数を何度も確認するのに便利な case と
caseより少し長くなるけれど、複数の変数に使える if があります。

 まずcodeの説明からします。手順として
①caseと書いて、半角スペース一つ空けて変数名を入れる
②改行して、when と書き、また半角スペース一つ空けて、変数にあてはまる可能性のある値を書く
③改行してその値に対する処理を書く。
④まだあるなら②へ戻る。もうないならendで終わり

a = rand(3)
case a
  when 0
    speak "ぐー"
  when 1
    speak "ちょき"
  when 2
    speak "ぱー"
 end

これは通常のRmakeと同じで動作しました。

ifの手順は、
①ifと書く
②半角スペースあけ、変数名書き、また半角スペースを書く
③同じかどうかなら==  数値よりも大きいかなら> 数値以上かなら>=
数値より小さいかなら< 数値以下かなら<=  数値と違うかなら!= を書く
④比較、もしくは同じとなる数値、"文字"を書く
⑤改行して処理を書く
⑥さらに改行して、まだ他に判定があるならelsifと書いて②へ。
 もうないならendで終わり

a = rand(3)
if a == 0
    speak "ぐー"
elsif a == 1
    speak "ちょき"
elsif a == 2
    speak "ぱー"
 end

a = rand(3)
if a == 0
    speak "ぐー"
elsif a != 0
    speak "ぐー以外"
 end

これも通常のRmakeと同じで動作しました。
同じスクリプトで動くと何やら希望が見えてきますね。


「6.画像を表示する」

 文字と選択肢だけだと、ゲームとしては少しさみしいので、
画像の表示方法について説明します。

まず最初に、ゲームに画像情報を読み込む必要があります。

  loader.add :「名前」, 「画像ID」


このスクリプトを、一番最初の文章を表示する枠を読み込む部分に
追加すればOKです。

game.loading do |loader|
  loader.add :window, :system => "window"
  loader.add :gui_item, :system => "gui_item"
  loader.add :image, 34
end


背景を表示する場合はシーンの中にこれを入れればよいです。
  scene.add :image, :texture => :「さっきの名前」, :align => :fullscreen



背景以外の画像の表示は、
scene.add :image, :texture =>:「さっきの名前」, :position => [X座標,Y座標], :scale => [X倍率, Y倍率]


:position => [X座標,Y座標]
で座標の指定

:scale => [X倍率, Y倍率]
で大きさの指定です。

大きさの指定は、もともとのサイズでいいのなら必要はないです。
scene.add :image, :texture =>:image, :position => [400,300]




「7.スプライトを表示する」

スプライトは、
「画像の動き」「アニメーション」「当たり判定」などの情報を
先に設定しておいてから、普通の画像と同じように表示します。

sprite_template :spr do |st|
  st.texture :spr_image  #画像の名前
  st.src_size 150, 150   #画像サイズ
  st.dest_size 150, 150  #表示サイズ
  st.center_offset 75,75 #中心位置
end

#↓はシーンの中に入れる
scene.add :image, :template => :spr, :position => [400,300]


最低限、これだけあれば動きます。
(中心位置はなくても動きます。)


画像の名前の「:spr_image」と
sprite_template 「この部分」 do |st| は
自由な名前で構いません。


スクリプトは、この sprite_template :spr do |st| の中に
色々書き足していく形になります。


動かす場合は、これを追加します。
  st.motion :default do |commands|  
    #内容
  end


この中に
    commands.move_to_v 0, 0, 10

と書けば、X座標0、Y座標0まで、スピード10で移動します。

キャラが画面外から登場する場面などに使えます。



ある座標に移動して、さらにまた別の場所に動く場合は、
このように書きます。
  st.motion :default do |commands|  
    commands.loop false
    commands.move_to_v 0, 0, 10
    commands.wait_motion
    commands.move_to_v 300, 300, 10
  end

 1行目が、ループするかどうか。
ループさせる場合には、最後にも
commands.wait_motionを入れないと、うまく動きません。
 2行目が、さっきの移動です。
 3行目が、動きが終わるまで待たせるものです。
これを挟まないと、2つの場所に同時に動こうとすることになるのか、
片方の場所にしか動けません。
4行目は、2か所目の移動の設定です・


ループの場合は、
  st.motion :default do |commands|  
    commands.loop true
    commands.move_to_v 0, 0, 10
    commands.wait_motion
    commands.move_to_v 300, 300, 10
    commands.wait_motion
  end

これだけの違いです。


ここまでをまとめると、こうなります。
sprite_template :spr do |st|
  st.texture :spr_image  #画像の名前
  st.src_size 150, 150   #画像サイズ
  st.dest_size 150, 150  #表示サイズ
  st.center_offset 75,75 #中心位置

  #動きの設定
  st.motion :default do |commands|  
    commands.loop false
    commands.move_to_v 0, 0, 10
    commands.wait_motion
    commands.move_to_v 300, 300, 10
    commands.wait_motion
  end
end



「8.アニメーションを表示する」

スプライトを使えば、
ずっとアニメーションが動きっぱなしの画像が作れます。

方法は、そうややこしいことはなく、
例えば、下は、いこさみのアニメーション画像のスプライト設定です。
sprite_template :ikosami do |st|
  st.texture :ikosami_image#最初に読み込んだ画像の名前
  st.src_size 300, 300#アニメーションの1コマのサイズ
  st.dest_size 300, 300#表示する時のサイズ
  st.center_offset 150, 150#中心位置(無くてもよい)

  
  st.motion :default do |commands|
    commands.loop false#ループすると、アニメーションが1コマ目に戻ってしまう。
    commands.proc_call do |sprite|     #
      sprite.change_animation :anim    #この3行が下の:animの動きを使いますよ~という意味
    end                                #
  end
  
  st.animation :anim do |commands|
    commands.loop true
    commands.copy_rect :frame => 6, :src => [0, 0]
    commands.wait_animation
    commands.copy_rect :frame => 6, :src => [1, 0]
    commands.wait_animation
    commands.copy_rect :frame => 6, :src => [2, 0]
    commands.wait_animation
    commands.copy_rect :frame => 6, :src => [3, 0]
    commands.wait_animation
    commands.copy_rect :frame => 6, :src => [2, 0]
    commands.wait_animation
    commands.copy_rect :frame => 6, :src => [1, 0]
    commands.wait_animation
  end
end


下の行の
  st.animation :anim do |commands|
    #内容
  end

このアニメーション画像が
 0 1 2 3
0■■■■

となっているので
0→1→2→3→2→1(最初に戻る)
という順番にアニメーションすると言う設定です。



「エラー対策」


プロジェクトが動作しなかったり、強制終了したり
途中で止まってしまう場合には、
ログに情報が残ります。

ログは、rmake_coreファイルの中のLog.textで見られます。

ログの最初の方は、システムの起動やらで
書いたプロジェクトとはあまり関係がないので
エラーを探すなら、下の方から見た方が見つけやすいです。

エラーが発生している場合には、例えば
Error : mruby error: syntax error, unexpected $end, expecting keyword_end, code_name: 103 85 :start.rb, line: 84, column: 0.
のようなものがあります。

※ただ自分の思い通りに動かないだけだったり、
 何も表示されていなくて画面が消えただけだったりした場合には
 エラーはでません。

この内容だと、


start.rbの84行目の0文字目にendがどうかしているということです。
(:start.rb, line: 84, column: 0)  (unexpected $end)

84行目で終わっているのなら、どこかにendが足りていない
ということになります。

ちなみに、全角スペースを入れて見た場合には
unexpected tIDENTIFIERとなってました。

code_name: 103 85は
おそらく、製作者のID番号と、ゲームID番号かと思われます。



計算式で、エラーが出ている場合、
(a = a + bなど)
変数が文字列になっているということがあるので
a = a.to_i + b.to_i
などと書くと、動いたりします。

今のところ、ここまでです。
わからないことがあったら
どしどしコメントください。

コメントする

コメントするには、ログインする必要があります。

コメント一覧

Material 154390 2 mini  創 (投稿日:2013/08/21 21:21, 履歴)
駄目だぁ・・・
参考に書いてもプロジェクトが起動すらしない・・・
Material 7186 1 mini ikosami(投稿日:2013/08/23 10:22, 履歴)
どんな感じに書いたんですか?
             mini ティラミス(投稿日:2013/08/08 20:32, 履歴)
yahooJapanIDに対応しないとできないよ;;
Material 7186 1 mini ikosami(投稿日:2013/08/08 21:56, 履歴)
まだyahooJapanID対応してなかったんですか・・・

普通に登録するつもりはないですか?
             mini ティラミス(投稿日:2013/08/09 07:05, 履歴)
ややこしくなるとあれなので・・・(^^;)
Material 7186 1 mini ikosami(投稿日:2013/08/09 08:07, 履歴)
たしかに、同じサイトに2つIDがあると
ややこしいですね(^^;)
Material 7186 1 mini ikosami(投稿日:2013/08/08 09:00, 履歴)
スプライトの表示と、一部修正しました。
  1 mini 闇さん(投稿日:2013/07/19 12:27, 履歴)
参考になります
なんとか頑張って理解してみます
Material 7186 1 mini ikosami(投稿日:2013/07/19 15:34, 履歴)
わかりにくい場所があったら
教えてくださいね(^_^)
Material 110912 1 mini アイネ・レグルス(投稿日:2013/07/18 21:29, 履歴)
これはすごいですね!参考にさせて頂きます
Material 7186 1 mini ikosami(投稿日:2013/07/18 21:53, 履歴)
ありがとうございます(^^)

改善のために
わかりにくい場所があったら、
遠慮なく行ってくださいね(^^)
User icon mini 退会したユーザー(投稿日:2013/07/18 21:09, 履歴)
参考になりました。
CoRをこれからも盛り上げていきましょう!
Material 7186 1 mini ikosami(投稿日:2013/07/18 21:52, 履歴)
ですね。
どんどん盛り上げましょー(^^)