0
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 1 year has passed since last update.

Cocos Creator 3 カンタン2Dゲーム制作(6)【ラベルアトラスの使い方】

Posted at

ページ一覧

Cocos Creator 3 導入編

Cocos Creator 3 カンタン2Dゲーム制作

ビットマップフォントを使う

これまでスコアは文字を表示するだけでしたが、ビットマップフォントに差し替えてみましょう。
Cocos Creator ではビットマップフォントをラベルアトラス(Label Atlas)といいます。

ラベルアトラスの使い方

次の画像をDigitFont.pngという名前で保存します。
アセットパネルのimagesの配下にコピーします。
Digit.png

imagesフォルダ右クリック→CreateLabel Atlasを選択します。
名前をDigitとし、選択された状態でインスペクターパネルを開きます。
Sprite FrameにアセットパネルからDigitFontをドラッグ&ドロップでセットし、他の項目は以下のように入力します。

WidthHeightは画像の文字単位の大きさで入力します。なお今回は数字のみですが、アルファベットや記号もASCIIコード順に並べると使用でき、下図のように複数行に分けることもできます。
image.png

ヒエラルキーパネルにある既存のScoreを一度削除し、アセットパネルからDigitをコピー。名前をScoreとします。

Scoreを選択し、インスペクターパネルに以下の内容を入力します。

ヒエラルキーパネルにあるFishを選択し、インスペクターパネルのFishCollisionコンポーネントにあるScoreの枠を確認します。
オレンジになっているので、ヒエラルキーパネルから新しく作成したScoreをドラッグ&ドロップでセットします。

ラベルアトラスの確認

デバッグボタン(ctrl+P)で実際の動きを確認します。

0
0
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
0
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?