Material 185033 3 icon
光楼（114）
公開したゲーム
公開した素材
ブログ記事

【講座？】CoRを触ってみる08～テキストスプライト編～【自分用メモ？】

投稿者：Material 185033 3 mini 光楼（114） 投稿日：2017/02/25 15:49

≪【講座？】CoRを触ってみる09～モーシ... | 【講座？】CoRを触ってみる07～アニメ...≫
【講座？】CoRを触ってみる07～アニメーション編～【自分用メモ？】←前回

メイドラゴンOPのサビが好きすぎる件。 


#このブログの情報は2017年2月25日現在のものです。今後変更になる可能性があります。

参考
https://github.com/akasata/cor/blob/master/doc/references/index.md


画面にテキストを表示させたい！





そんなあなたは必見！





ついに解説！





テキストスプライト！！



……。



そんな大したものじゃないです。はい。



ではいつものテンプレから始めていきましょー！いきましょー！

scene 'start' do #シーンstart
  #変数定義

  preload do #素材読込み
  end

  create do #シーン初期化
  end

  update do #メインループ
  end

  render do #描画
  end
end

#シーンスタート
start_scene "start"



変数定義

これまたいつものように定義しましょー！しましょー！

text_sprite = nil


テキストスプライトの定義

start_sceneよりも下に書きます。

text '適当な定義名' do
end



さて、中身を書いていきましょう。

origin

前にも説明しましたね、原点の設定です。

位置書き方
左上origin :left_top
中心origin :center
font_size

テキストスプライトの大きさです。自由に決めましょう。

font_size 数値


color

色です。16進数で決めます。

color '適当な値'


ちょっと解説

16進数ってのは簡単に言うと、

0～Fの16個で表される数です。

僕らが普段使っている数は、

0～9までの10個の数を使っているので10進数と呼びます。



色を16進数で表すとき、

全体的に数値が大きいほど白に近づき、小さいほど黒に近づきます。

つまり#FFFFFFだと白、#000000だと黒になります。



これ、どんな構成になっているんでしょうか？

#の後に続く6つの数のうち、左側の2つが赤の強さです。

00になるほど赤要素が弱く、FFになるほど強くなります。



続いて真ん中2つが緑、右側2つが青。

つまり#FF0000は赤、#00FF00は緑、#0000FFは青になります。



↓これに関連した便利なツールをikosamiさんが公開されています。おすすめです↓






ち　な　み　に、3色のうちの最大値と最小値の差が大きいと色が鮮やかになるそうですよ！

あと、16進数のFFは10進数の255。



色々書きましたが定義は以上です。

text 'TestText' do
  origin :center
  font_size 30
  color '#B0FF5A'
end



あ、別にカラーコードのアルファベットは小文字でも良いんだからね！

テキストスプライトの配置

create内に書いていきますよ！いきますよ！

変数 = put_text '定義名' do
  position X座標, Y座標
  text 表示するテキスト
end



一気に説明するぞ～！

変数は初めに定義したやつです。

定義名はさっきのテキストスプライトの定義で付けた名前。

positionはテキストスプライトの表示座標。今回は原点を中心に設定しているから注意だぞ！注意だぞ！

textは表示したいものを設定します。変数でも良いのよ？



さて完成だ！

text_sprite = put_text 'TestText' do
  position 200, 50
  text 'テストテスト'
end



全体像は↓

scene 'start' do #シーンstart
  #変数定義
  text_sprite = nil

  preload do #素材読込み
  end

  create do #シーン初期化
    text_sprite = put_text 'TestText' do
     position 200, 50
     text 'テストテスト'
    end
  end

  update do #メインループ
  end

  render do #描画
  end
end

#シーンスタート
start_scene "start"

text 'TestText' do
  origin :center
  font_size 30
  color '#b0ff5a'
end





ちなみに

変数.text


で表示文字列を変えられるし、取得も出来ちゃう。



だからこんなことも可能！

scene 'start' do #シーンstart
  #変数定義
  text_sprite = nil

  create do #シーン初期化
    text_sprite = put_text 'TestText' do
     position 200, 50
     text 0 #0を設定(文字列でなく数値である事に注意)
    end
  end

  update do #メインループ
    text_sprite.text(text_sprite.text + 1)  #表示値 + 1（表示値が文字列でなく数値で設定されていることを利用）
  end
end

#シーンスタート
start_scene "start"

#テキストスプライトの定義
text 'TestText' do
  origin :center
  font_size 30
  color '#b0ff5a'
end



どうだい？



あ、

text_sprite.text(text_sprite.text + 1)


のところ、別に

text_sprite.text text_sprite.text + 1


でも良いんだけど、

text_sprite.textが2つも続いて見にくいので、

あえて括弧を付けました。

#2月26日追記

将来的に文字列に統一され、この方法が使えなくなる可能性があります。

もしそうなった場合は文字列を数値に変換して下さい。

text_sprite.text(text_sprite.text.to_i + 1)


設定も文字列限定の場合は↓

text_sprite.text "#{text_sprite.text.to_i + 1}"




今回は以上!



次回→【講座？】CoRを触ってみる09～モーション編～【自分用メモ？】

    


    


    


    
コメントする


    

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



コメント一覧





  


    




  

    

      Material 7186 1 mini ikosami(投稿日：2017/02/26 12:29,
                                               履歴)
    


    

      カラーコード制作ツールの紹介ありがとうございます。

    


        

          

            Material 185033 3 mini 光楼（114）(投稿日：2017/02/27 19:59,
                                                            履歴)
          


          

            いえいえ、こちらこそありがとうございます。

          

        

  







  














    




  

    

                  mini mosmoss(投稿日：2017/02/26 12:01,
                                               履歴)
    


    

      Rmake でのテキストボックスという領域概念がなくなって

中央寄せ表示ができるようになってる…って感じなのかな

    


        

          

            Material 185033 3 mini 光楼（114）(投稿日：2017/02/27 19:58,
                                                            履歴)
          


          

            そんな感じですね。

          

        

  







  














    




  

    

      Material 6858 mini akasata(投稿日：2017/02/25 23:27,
                                               履歴)
    


    

      わかりやすくてとてもいいですね。



textに数値を設定するのは思いつきませんでしたw

しかし、CoR側は文字列が入ってくることを想定しているので、将来的にバグの原因になりそうですね。。。

将来的にテキスト設定時にチェックを入れるか、強制的に文字列に変換してしまおうかと考えています。



その場合、以下のコードは動かなくなるかもしれません。



text_sprite.text(text_sprite.text + 1)




    


        

          

            Material 185033 3 mini 光楼（114）(投稿日：2017/02/26 08:40,
                                                            履歴)
          


          

            そうだったんですねw

承知しました。