オノデラの研究日記 in わんくま

思いついたネタを気ままに書いていくブログ

ホーム 連絡をする 同期する ( RSS 2.0 ) Login
投稿数  209  : 記事  5  : コメント  5960  : トラックバック  40

ニュース

プロフィール

  • ●おのでら
    宮城県在住
    主に業務向けソフトを製作

Twitter

ニュース

主なリンク

XNA 関連リンク

アイテム

ゲーマーカード

その他

記事カテゴリ

書庫

日記カテゴリ

  とりあえずサイトの方の Tips では、基本的な部分から応用的な部分まで一通り書いていきますが、こっちのブログでは実際に使う機会が多そうなプログラムを書いていく予定です。


 XNA での文字表示についてですが、実は「1.0 Refresh」よりも前のバージョンでは標準で文字を表示できる機能はありませんでした。おそらく Xbox360 の絡みでフォントによる文字イメージをその場で生成することができないからだと思います(あくまでも私の推測ですが…)。

 しかし、デバッグをする際にもリアルタイムに情報を表示できる機能は結構重要で、手軽に文字を表示できなかったのは結構不便だったと思います。そこで「1.0 Refresh」から「SpriteFont」と呼ばれるクラスが実装されるようになり、わざわざ自分で文字イメージを用意しなくても好きなフォントで描画することが可能になりました。


 では、まず最初に「.spritefont」という拡張子のファイルを作成します。このファイルは文字のフォントについての情報を入れておくものであり、XML をベースにした形式で記述します。中身は下のような感じになっていますが、各項目の詳細はコメントを見てください。ファイルは UTF-8 で保存します。

 
<?xml version="1.0" encoding="utf-8"?>

<!-- 
文字の描画に使用するフォントの名前やサイズなどの情報を記述します
 -->
<XnaContent xmlns:Graphics="Microsoft.Xna.Framework.Content.Pipeline.Graphics">
  <Asset Type="Graphics:FontDescription">

    <!--
      使用するフォント名
    -->
    <FontName>MS ゴシック</FontName>

    <!--
      文字のサイズ。浮動小数点も可。単位はバックバッファ内でのピクセル単位
    -->
    <Size>24</Size>

    <!--
      文字間の幅。単位はバックバッファ内でのピクセル単位
    -->
    <Spacing>4</Spacing>

    <!--
      文字スタイル。通常は"Regular"、ボールドは"Bold", イタリックは"Italic"
      "Bold, Italic"と記述することで複数のスタイルを指定可能
    -->
    <Style>Regular</Style>

    <!--
      キャラクターリージョン。使う文字の範囲をUnicodeで指定します。
      32(ASCIIのスペース)から126('~')の英数字を指定しています。(10進数)
    -->
    <CharacterRegions>
      <CharacterRegion>
        <Start>&#32;</Start>
        <End>&#126;</End>
      </CharacterRegion>
    </CharacterRegions>
  </Asset>
</XnaContent>

 ファイルを作成したらプロジェクトに追加しましょう。ファイル名はなんでもいいです。「.spritefont」ファイルはコンテントとして扱うことができます。

2007-07-05-01


 で、肝心のプログラムの方ですが、

/// <summary>
/// バッチ化描画用スプライト
/// </summary>
SpriteBatch spriteBatch = null;

/// <summary>
/// スプライトでテキストを描画するためのフォント
/// </summary>
SpriteFont font = null;

 まず、フィールドとして「SpriteBatch」と「SpriteFont」クラスを使用します。

 
// スプライトバッチの作成
this.spriteBatch = new SpriteBatch(device);

// フォントをコンテントパイプラインから読み込む
this.font = this.content.Load<SpriteFont>("Font");

 続いて、LoadGraphicsContent メソッド内で「SpriteBatch」を作成し、ContentManager.Load メソッドで先ほど追加した「Font.spritefont」ファイルのアセット名を指定して「SpriteFont」クラスを作成します。

 描画はいたって簡単で

// スプライトの描画は「Begin」「End」の間に記述する
this.spriteBatch.Begin();

// テキストをスプライトとして描画する
this.spriteBatch.DrawString(this.font, "Draw Sprite in a screen.",
    Vector2.Zero, Color.White);

// スプライトの描画の終了
this.spriteBatch.End();

 という風にスプライトを描画するときと同じような形の記述になります。

「SpriteBatch.DrawString」メソッドに、先ほど作成した「SpriteFont」を第1引数指定し、第2引数に表示させる文字を指定します。残りの引数はスプライトの描画と同じです。

2007-07-05-02

 ここで注意してほしいのが、今回のプログラムは「英数字(と一部の記号)」しか表示できません。日本語などを指定すると描画時に例外を発生させてしまいます。

 実は「.spritefont」ファイルの下のほうを見てみると

<CharacterRegions>
  <CharacterRegion>
    <Start>&#32;</Start>
    <End>&#126;</End>
  </CharacterRegion>
</CharacterRegions>

 という記述があるのですが、これはビルド時に Unicode で定義されている文字コードの「32(ASCIIのスペース)から126('~')」の間に含まれる文字を、画素データとして作成することを指定しています。しかし、日本語の文字はこのコードの間には含まれていないので、描画時にコードを検出できずエラーとなるのです。

 もちろん、このコードの範囲を大きくして日本語の文字を含めるようにすれば表示できますが、正直お勧めしません(やってみるとわかりますが…固まります(^^;))。このあたりの説明については、 XNA の開発に携わっている伊藤さんのブログで説明されています。日本語などの他言語の表示の仕方についても説明されているので、参考にしてみるといいでしょう。

投稿日時 : 2007年7月5日 18:47

コメント

# re: XNA : 英数字を表示する 2007/07/05 19:05 シャノン
> <XnaContent xmlns:Graphics="Microsoft.Xna.Framework.Content.Pipeline.Graphics">

XNAのことはわからんが、XML的にこれはいいんだろうか…

# re: XNA : 英数字を表示する 2007/07/05 19:25 オノデラ
わかりません (^^;)

# そういえばシャノンさんの XML の記事は面白かったです。

# re: XNA : 英数字を表示する 2007/07/06 0:55 りょーいち
他調べずに思いつき発言で申し訳ないのですが、これって、文字のパスとかの情報を抜き出してるって事でしょうかね?
配布先に <FontName></FontName> のフォントがなくてもOKなのかな?
となると、そのまま配るとフォントの二次配布?

#引っ越し終わったらXNAでいっぱいあそぶぞー



# re: XNA : 英数字を表示する 2007/07/06 8:57 オノデラ
> となると、そのまま配るとフォントの二次配布?

む、確かにこれはびみょ~ですね。スプライトフォントはビルド時に「フォントの画像データ」を作成していると思うので、xnb ファイルも一緒に持っていけば他の環境でもそのまま持っていけるはずです。(まだ試していませんが^^; (後でやってみよう))

となるとフォントをそのまま他の環境に持っていっているという意味にも取れるので判断が難しいですね。
でも結局は「フォントデータ」をそのまま持っていっているわけではないので、フォントの二次配布にはならないと思います。(できないと配布ゲームにテキスト使えないですし^^;)

上記の理由で

> 配布先に <FontName></FontName> のフォントがなくてもOKなのかな?

も大丈夫だと思います。(いや、やっぱり後で試してみよう)

# XNA : 英数字を表示する (1.1) 2007/07/06 12:47 オノデラの研究日記 in わんくま
XNA : 英数字を表示する (1.1)

# XNA : Windows XP, Xbox360 でメイリオフォント 2007/07/07 0:10 オノデラの研究日記 in わんくま
XNA : Windows XP, Xbox360 でメイリオフォント

# XML名前空間 2007/07/23 14:23 .COM -どっとこむ-
XML名前空間

Post Feedback

タイトル
名前
Url:
コメント