Alfasayısal karakterleri görüntüleme
özet
Ekranda rastgele bir karakter dizisi (alfasayısal) görüntüleyin.
Çalışma ortamı
Önkoşullar
Desteklenen XNA Sürümleri |
|
Desteklenen Platformlar |
|
Windows Gerekli Köşe Gölgelendiricisi Sürümü | 2.0 |
Windows Gerekli Pixel Shader Sürümü | 2.0 |
Çalışma ortamı
peron |
|
madde
Metni XNA'da görüntülemek için, yazı tipi bilgilerini açıklayan "hareketli grafik yazı tipi" adlı bir dosyaya ihtiyacınız vardır. Uzantı ". hareketli grafik yazı tipi. Sprite yazı tipi dosyaları genişletilmiş bir XML biçiminde yazılır, böylece kolayca yeniden yazılabilirler. Sprite yazı tipi oluşturmak için aşağıdakileri yapın:
İçerik projesine sağ tıklayın ve Yeni → Öğe Ekle'ye tıklayın.
Yeni Öğe Ekle iletişim kutusu açılır.
Yüklenen şablonda "Sprite Yazı Tipi" adlı bir öğe var, bu yüzden onu seçin.
Bir dosya adı belirtin, ancak burada "Font.spritefont" olarak adlandırılır. Temel olarak, istediğiniz herhangi bir adı ayarlayabilirsiniz.
Girdikten sonra sağ alttaki "Ekle" düğmesine basın.
Bir dosya oluşturduğunuzda, hareketli grafik yazı tipi dosyası açılır.
Ayrıca içerik projesine de eklenmiştir.
Sprite yazı tipinin içeriği varsayılan olarak bırakılabilir, ancak bu sefer aşağıdaki gibi yeniden yazılmıştır (netlik için yorumlar da Japoncadır). Her düğümün açıklaması için lütfen yorumlara bakın.
Ayrıca sprite fontların detaylı bir anlatımı "Font Stil Detayları" bölümünde anlatılmıştır.
<?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> </Start>
<End>~</End>
</CharacterRegion>
</CharacterRegions>
</Asset>
</XnaContent>
Daha sonra, metin çizme programını anlatacağım.
<summary>
スプライトのバッチ化クラス
</summary>
private SpriteBatch spriteBatch = null;
<summary>
スプライトでテキストを描画するためのフォント
</summary>
private SpriteFont font = null;
Metin çizmek için iki sınıf kullanıyoruz: "SpriteBatch" ve "SpriteFont". Metin hareketli grafik olarak çizilecektir.
<summary>
ゲームが始まるときに一回だけ呼ばれ
すべてのゲームコンテンツを読み込みます
</summary>
protected override void LoadContent()
{
// テクスチャーを描画するためのスプライトバッチクラスを作成します
this.spriteBatch = new SpriteBatch(this.GraphicsDevice);
// フォントをコンテンツパイプラインから読み込む
this.font = this.Content.Load<SpriteFont>("Font");
}
LoadGraphicsContent yöntemi içinde önce bir SpriteBatch sınıfı oluşturun. Bağımsız değişken olarak bir GraphicsDevice geçirin.
Ardından, az önce oluşturduğunuz hareketli grafik yazı tipi dosyasını yüklemek için ContentManager.Load yöntemini kullanın. type parametresi için "SpriteFont" sınıfını ve bağımsız değişken için varlık adını belirtin. Sprite yazı tipinin varlık adını değiştirmediyseniz, kaldırılan dosya adı uzantısını belirtin.
İçerik yüklemeyle ilgili ayrıntılar için "Kaynakları Yükleme (İçerik)" bölümüne bakın.
SpriteBatch
Oluşturucu
Hareketli grafiklerin çizimini toplu hale getiren "SpriteBatch" sınıfının bir örneğini oluşturun.
graphicsDevice (grafikAygıt) | Ekran KartıAygıt | Çizim için kullanılacak GraphicsDevice'ı belirtir. |
// スプライトの描画準備
this.spriteBatch.Begin();
// テキストをスプライトとして描画する
this.spriteBatch.DrawString(this.font, "Draw Sprite in a screen.",
Vector2.Zero, Color.White);
// スプライトの一括描画
this.spriteBatch.End();
Metni Draw yönteminde çizin.
Metni çizmek için "SpriteBatch.DrawString" metodu kullanılır, ancak metin spunte olarak çizildiği için çizimden önce ve sonra sırasıyla "SpriteBatch.Begin" ve "SpriteBatch.End" metodları çağrılır.
SpriteBatch.DrawString yönteminin ilk argümanı, oluşturduğunuz "SpriteFont" sınıfıdır. Bu, hareketli grafik yazı tipinde belirtilen stilde karakterler çizmenize olanak tanır. İkinci bağımsız değişken, görüntülenecek dizedir.
SpriteBatch.Begin
yöntem
Sprite'ı çizmeden önce arayın. Dahili olarak, sprite çizmek için gerekli ayarları yapıyoruz.
SpriteBatch.DrawString
yöntem
Bir dize çizin.
spriteYazı Tipi | SpriteYazı Tipi | Dize görüntüsünü içeren SpriteFont öğesini belirtir. |
Metin | dizgi | Görüntülenecek metni belirtir. |
konum | Vektör2 | Metnin görüntüleneceği konum. Ekranın sol üst köşesine göre ekran koordinatlarında belirtin. Metnin kökeni, ilk karakterin sol üst köşesinde olacaktır. |
Renk | Renk | Metin rengi |
SpriteBatch.End
yöntem
Tüm toplu hareketli grafikleri çizin. Çizim sırası, çizim durumu vb. SpriteBatch.Begin yönteminde belirtilir. Gerekirse, oluşturma durumu SpriteBatch.Begin yöntemi çağrılmadan önceki durumuna döndürülür.
Bilgisayarda vb. kullanılan bir ekranla ilgili bir sorun yoktur, ancak bir Xbox 360'tan analog TV'ye çıktı alırken, sol üst köşede görüntülenen metni göremeyebilirsiniz. Bu durumda, "Karakterlerin çizileceği konumu belirtin" bölümünde açıklanacak olan karakterlerin görüntüleme konumunu ayarlamanız gerekir.
Bu örnekle ilgili dikkat edilmesi gereken bir nokta, Japonca karakterleri görüntüleyememesidir. SpriteBatch.DrawString yöntemi için Japonca belirtirseniz, bir özel durum oluşur. Bu kez, yalnızca Unicode'da belirtilen 32~126'da tanımlanan alfasayısal karakterler ve semboller görüntülenebilir. Japonca'nın nasıl görüntüleneceğini başka bir ipucunda tanıtmak istiyorum.
Unicode tabloları (32~127)
(Satırlardaki sayılar ×16 + sütunlardaki sayılar) kod olacaktır.
0 | 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | A | B | C | D | E | F | ||
2 | ! | " | # | $ | % | & | ' | ( | ) | * | + | , | - | . | / | ||
3 | 0 | 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | : | ; | < | = | > | ? | |
4 | @ | A | B | C | D | E | F | G | H | Ben | J | K | L | M | N | O | |
5 | P | Q | R | S | T | U | V | W | X | Y | Z | [ | \ | ] | ^ | _ | |
6 | ` | a | b | c | d | e | f | g | h | ben | j | k | l | m | n | o | |
7 | p | q | r | s | t | u | v | w | x | y | z | { | } | ~ | |
Tüm Kodlar
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);
}
}
}