Alfanumerieke tekens weergeven

Pagina bijgewerkt :
Aanmaakdatum van pagina :

samenvatting

Geef een willekeurige tekenreeks (alfanumeriek) weer op het scherm.

英数字を表示させる

Werkomgeving

Voorwaarden

Ondersteunde XNA-versies
  • 2.0
  • 3.0
  • 3.1
  • 4.0
Ondersteunde platforms
  • Windows (XP SP2 of hoger, Vista, 7)
  • Xbox 360
  • Windows Phone 7
Windows vereist Vertex Shader-versie 2.0
Windows Vereiste Pixel Shader-versie 2.0

Werkomgeving

perron
  • Vensters 7
  • Xbox 360
  • Windows Phone 7-emulator

stof

Om tekst in XNA weer te geven, hebt u een bestand nodig dat een "sprite-lettertype" wordt genoemd en dat de lettertype-informatie beschrijft. De extensie is ". spritefont. Sprite-lettertypebestanden zijn geschreven in een uitgebreid formaat van XML, zodat ze gemakkelijk kunnen worden herschreven. Ga als volgt te werk om een sprite-lettertype te maken:

Klik met de rechtermuisknop op het inhoudsproject en klik op → nieuw item toevoegen.

Het dialoogvenster Nieuw item toevoegen wordt geopend.

In de geïnstalleerde sjabloon is er een item met de naam "Sprite Font", dus selecteer het.

Geef een bestandsnaam op, maar hier heet het "Font.spritefont". In principe kunt u elke naam instellen die u maar wilt.

Druk na het invoeren op de knop "Toevoegen" rechtsonder.

Wanneer u een bestand maakt, is het sprite-lettertypebestand geopend.

Het is ook toegevoegd aan het inhoudsproject.

De inhoud van het sprite-lettertype kan als standaard worden gelaten, maar deze keer is het als volgt herschreven (opmerkingen zijn ook Japans voor de duidelijkheid). Raadpleeg de opmerkingen voor een uitleg van elk knooppunt.

Daarnaast wordt een gedetailleerde uitleg van sprite-lettertypen uitgelegd in de sectie "Details van lettertypestijl".

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

    <!--
      使用するフォント名。
    -->
    <FontName>メイリオ</FontName>

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

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

    <!--
      カーニングを使用するかどうか。
    -->
    <UseKerning>true</UseKerning>

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

    <!--
      キャラクターリージョンで指定した文字次回の文字が描画されようとしたときに
      代わりに表示する文字を指定します。ASCII 以外の Unicode 文字も可。
    -->
    <DefaultCharacter>*</DefaultCharacter>

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

Vervolgens zal ik het programma voor het tekenen van tekst beschrijven.

/// <summary>
/// スプライトのバッチ化クラス
/// </summary>
private SpriteBatch spriteBatch = null;

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

Om tekst te tekenen, gebruiken we twee klassen: "SpriteBatch" en "SpriteFont". De tekst wordt getekend als een sprite.

/// <summary>
/// ゲームが始まるときに一回だけ呼ばれ
/// すべてのゲームコンテンツを読み込みます
/// </summary>
protected override void LoadContent()
{
    // テクスチャーを描画するためのスプライトバッチクラスを作成します
    this.spriteBatch = new SpriteBatch(this.GraphicsDevice);

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

Maak binnen de methode LoadGraphicsContent eerst een SpriteBatch-klasse. Geef een GraphicsDevice door als het argument.

Gebruik vervolgens de methode ContentManager.Load om het sprite-lettertypebestand dat u zojuist hebt gemaakt te laden. Geef de klasse 'SpriteFont' op voor de typeparameter en de naam van het element voor het argument. Als u de assetnaam van het sprite-lettertype niet hebt gewijzigd, geeft u de verwijderde bestandsnaamextensie op.

Voor meer informatie over het laden van inhoud, zie "Bronnen laden (inhoud)".

SpriteBatch bouwer

Maak een instantie van de klasse "SpriteBatch" die het tekenen van sprites in batches verzamelt.

grafischApparaat Grafisch apparaat Hiermee geeft u het grafische apparaat op dat moet worden gebruikt om te tekenen.
// スプライトの描画準備
this.spriteBatch.Begin();

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

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

Teken de tekst in de methode Tekenen.

De methode "SpriteBatch.DrawString" wordt gebruikt om de tekst te tekenen, maar aangezien de tekst als een sprite wordt getekend, worden de methoden "SpriteBatch.Begin" en "SpriteBatch.End" respectievelijk voor en na het tekenen aangeroepen.

Het eerste argument van de methode SpriteBatch.DrawString is de klasse 'SpriteFont' die u hebt gemaakt. Hiermee kunt u tekens tekenen in de stijl die is opgegeven in het sprite-lettertype. Het tweede argument is de tekenreeks die moet worden weergegeven.

SpriteBatch.Begin methode

Noem het voordat je de sprite tekent. Intern maken we de nodige instellingen voor het tekenen van sprites.

SpriteBatch.DrawString methode

Trek een touwtje.

spriteLettertype SpriteFont (Engelstalig) Hiermee geeft u het SpriteFont op dat de tekenreeksafbeelding bevat.
Sms snaar Hiermee geeft u de tekst op die moet worden weergegeven.
positie Vector 2 De positie waarop de tekst moet worden weergegeven. Geef in het scherm coördinaten op ten opzichte van de linkerbovenhoek van het scherm. De oorsprong van de tekst staat linksboven in het eerste teken.
Kleur Kleur Kleur van de tekst

SpriteBatch.End methode

Teken alle gebatchte sprites. De tekenvolgorde, de tekeningstatus, enzovoort worden opgegeven in de methode SpriteBatch.Begin. Indien nodig wordt de renderstatus geretourneerd naar de status waarin deze zich bevond voordat de methode SpriteBatch.Begin werd aangeroepen.

Er is geen probleem met een beeldscherm dat wordt gebruikt op een computer, enz., maar bij het uitvoeren van een Xbox 360 naar een analoge tv kunt u de tekst die in de linkerbovenhoek wordt weergegeven mogelijk niet zien. In dit geval moet u de weergavepositie van de tekens aanpassen, wat wordt uitgelegd in "Specificeer de positie om de tekens te tekenen".

Een ding om op te merken over dit voorbeeld is dat het geen Japanse tekens kan weergeven. Als u Japans opgeeft voor de methode SpriteBatch.DrawString, treedt er een uitzondering op. Deze keer kunnen alleen alfanumerieke tekens en symbolen die zijn gedefinieerd in 32 ~ 126 gespecificeerd in Unicode worden weergegeven. Ik wil graag introduceren hoe je Japans kunt weergeven in een andere tip.

Unicode-tabellen (32~127)

(Getallen in rijen ×16 + getallen in kolommen) is de code.

0 1 2 3 4 5 6 7 8 9 Een B C D E F
2 ! " # $ % & ' ( ) * + , - . /
3 0 1 2 3 4 5 6 7 8 9 : ; < = > ?
4 @ Een B C D E F G H Ik J K L M N O
5 P Q R S T U V W X Y Z [ \ ] ^ _
6 ` een b c d e f g h Ik j k l m n o
7 p q r s t u v w x y z { } ~ 

Alle codes

using System;
using System.Collections.Generic;
using System.Linq;
using Microsoft.Xna.Framework;
using Microsoft.Xna.Framework.Audio;
using Microsoft.Xna.Framework.Content;
using Microsoft.Xna.Framework.GamerServices;
using Microsoft.Xna.Framework.Graphics;
using Microsoft.Xna.Framework.Input;
using Microsoft.Xna.Framework.Media;
#if WINDOWS_PHONE
using Microsoft.Xna.Framework.Input.Touch;
#endif

namespace DrawAlphameric
{
    /// <summary>
    /// ゲームメインクラス
    /// </summary>
    public class GameMain : Microsoft.Xna.Framework.Game
    {
        /// <summary>
        /// グラフィックデバイス管理クラス
        /// </summary>
        private GraphicsDeviceManager graphics = null;

        /// <summary>
        /// スプライトのバッチ化クラス
        /// </summary>
        private SpriteBatch spriteBatch = null;

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


        /// <summary>
        /// GameMain コンストラクタ
        /// </summary>
        public GameMain()
        {
            // グラフィックデバイス管理クラスの作成
            this.graphics = new GraphicsDeviceManager(this);

            // ゲームコンテンツのルートディレクトリを設定
            this.Content.RootDirectory = "Content";

#if WINDOWS_PHONE
            // Windows Phone のデフォルトのフレームレートは 30 FPS
            this.TargetElapsedTime = TimeSpan.FromTicks(333333);

            // バックバッファサイズの設定
            this.graphics.PreferredBackBufferWidth = 480;
            this.graphics.PreferredBackBufferHeight = 800;

            // フルスクリーン表示
            this.graphics.IsFullScreen = true;
#endif
        }

        /// <summary>
        /// ゲームが始まる前の初期化処理を行うメソッド
        /// グラフィック以外のデータの読み込み、コンポーネントの初期化を行う
        /// </summary>
        protected override void Initialize()
        {
            // TODO: ここに初期化ロジックを書いてください

            // コンポーネントの初期化などを行います
            base.Initialize();
        }

        /// <summary>
        /// ゲームが始まるときに一回だけ呼ばれ
        /// すべてのゲームコンテンツを読み込みます
        /// </summary>
        protected override void LoadContent()
        {
            // テクスチャーを描画するためのスプライトバッチクラスを作成します
            this.spriteBatch = new SpriteBatch(this.GraphicsDevice);

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

        /// <summary>
        /// ゲームが終了するときに一回だけ呼ばれ
        /// すべてのゲームコンテンツをアンロードします
        /// </summary>
        protected override void UnloadContent()
        {
            // TODO: ContentManager で管理されていないコンテンツを
            //       ここでアンロードしてください
        }

        /// <summary>
        /// 描画以外のデータ更新等の処理を行うメソッド
        /// 主に入力処理、衝突判定などの物理計算、オーディオの再生など
        /// </summary>
        /// <param name="gameTime">このメソッドが呼ばれたときのゲーム時間</param>
        protected override void Update(GameTime gameTime)
        {
            // Xbox 360 コントローラ、Windows Phone の BACK ボタンを押したときに
            // ゲームを終了させます
            if (GamePad.GetState(PlayerIndex.One).Buttons.Back == ButtonState.Pressed)
            {
                this.Exit();
            }

            // TODO: ここに更新処理を記述してください

            // 登録された GameComponent を更新する
            base.Update(gameTime);
        }

        /// <summary>
        /// 描画処理を行うメソッド
        /// </summary>
        /// <param name="gameTime">このメソッドが呼ばれたときのゲーム時間</param>
        protected override void Draw(GameTime gameTime)
        {
            // 画面を指定した色でクリアします
            this.GraphicsDevice.Clear(Color.CornflowerBlue);

            // スプライトの描画準備
            this.spriteBatch.Begin();

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

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

            // 登録された DrawableGameComponent を描画する
            base.Draw(gameTime);
        }
    }
}