Padarykite, kad "sprite" būtų rodomas

Puslapis atnaujintas :
Puslapio sukūrimo data :

suvestinė

Įkelkite tekstūrą (vaizdą) ir parodykite ją ekrane.

スプライトを表示させる

Darbo aplinka

Būtinosios sąlygos

Palaikomos XNA versijos
  • 2.0
  • 3.0
  • 3.1
  • 4.0
Palaikomos platformos
  • "Windows" (XP SP2 arba naujesnė versija, Vista, 7)
  • "Xbox 360"
  • "Windows Phone 7"
"Windows" reikalinga "Vertex Shader" versija 2.0
"Windows" reikalinga "Pixel Shader" versija 2.0

Darbo aplinka

platforma
  • Langai 7
  • "Xbox 360"
  • "Windows Phone 7" emuliatorius

medžiaga

Kas yra sprite?

Stačiakampis plotas vaizdams piešti ekrane. Ši funkcija dažnai naudojama 2D žaidimuose, tačiau ji taip pat dažnai naudojama 3D kaip pseudo-2D vaizdo piešinys.

XNA viskas turi būti nupiešta 3D daugiakampiais, todėl vaizdas, kurį piešiate ekrane, yra pseudo-sprite, naudojant daugiakampius. Tačiau nereikia žinoti apie daugiakampius, ir jūs galite lengvai juos piešti.

Vaizdų paruošimas

Kadangi vaizdas rodomas, reikia paruošti vaizdo failą. Pavyzdyje naudojamas žemiau pateiktas vaizdas.

スプライトとして表示させる画像

Naudoju PNG failą, kurio dydis yra 128×128, bet jis gali būti bet kokio dydžio. Be to, vaizdo failo, kurį galima perskaityti, formatas pagal numatytuosius nustatymus yra šis failas.

  • .Bmp
  • .Dds
  • .Dib
  • .Hdr
  • .jpg
  • .pfm
  • .png
  • .Ppm
  • .tga

Vaizdo įtraukimas į projektą

Pavyzdyje vaizdo failas įdedamas į projektą "Turinys". Daugiau informacijos apie tai, kaip pridėti vaizdo failus prie projekto, rasite kitame puslapyje.

プロジェクトに Texture.png を追加

laukas

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

/// <summary>
/// テクスチャー
/// </summary>
private Texture2D texture = null;

Norėdami nupiešti "sprite", paruoškite "SpriteBatch", kad būtų galima sugrupuoti piešiamus spritus, ir "Texture2D", kad išsaugotumėte 2D vaizdo duomenis.

Išteklių kūrimas ir įkėlimas

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

    // テクスチャーをコンテンツパイプラインから読み込む
    this.texture = this.Content.Load<Texture2D>("Texture");
}

"LoadGraphicsContent" metodo viduje sukurkite "SpriteBatch" klasę. Perduokite "GraphicsDevice" kaip argumentą.

Tada tekstūrai įkelti ir sukurti naudojamas metodas ContentManager.Load. Nurodykite tipo parametro klasę "Texture2D" ir argumento turto pavadinimą.

SpriteBatch Konstruktorius

Sukurkite klasės "SpriteBatch" egzempliorių, kuriame yra spritų piešinys.

grafikaĮrenginys GrafikaDevice Nurodo grafikąDevice, kurį naudoti piešimui.

piešinys

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

// スプライトを描画する
this.spriteBatch.Draw(this.texture, Vector2.Zero, Color.White);

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

Nupieškite tekstą piešimo metodu.

Norėdami nupiešti "sprite", naudokite metodą "SpriteBatch.Draw", tačiau prieš ir po piešimo turite iškviesti atitinkamai "SpriteBatch.Begin" ir "SpriteBatch.End" metodus.

Pirmasis SpriteBatch.Draw metodo argumentas yra jūsų sukurta klasė "Texture2D". Tai leis jums peržiūrėti importuotą vaizdo failą.

SpriteBatch.Begin metodas

Paskambinkite prieš piešdami sprite. Viduje mes atliekame reikiamus nustatymus spritų piešimui.

SpriteBatch.Draw metodas

Įtraukia sprite į sprite piešimo paketų sąrašą.

Tekstūros Tekstūra2D Nurodo tekstūrą, kuri bus rodoma kaip "sprite".
Poziciją Vektorius2 Vieta, kurioje turėtų būti rodomas "sprite". Nurodykite ekrano koordinates, susijusias su viršutiniu kairiuoju ekrano kampe. "Sprite" kilmė bus viršutinėje kairėje padėtyje.
spalva Spalva Nurodo spalvą, kad padaugintų "sprite" spalvą. Jei nurodysite Color.White, ji bus rodoma pagrindine sprite spalva. Jei nurodyta Color.Black, sprite rodomas visiškai juodai, nepriklausomai nuo jo spalvos. Formulė yra "Rezultatas = sprite spalva * spalva".

SpriteBatch.End metodas

Nupieškite visus paketinius spritus. Piešimo tvarka, piešimo būsena ir pan. Jei reikia, atvaizdavimo būsena grąžinama į būseną, kurioje ji buvo prieš iškviečiant SpriteBatch.Begin metodą.

スクリーンとスプライトの原点

Nėra jokių problemų dėl kompiuteryje naudojamo ekrano ir pan., Tačiau išvedant iš "Xbox 360" į analoginį televizorių, gali nepavykti matyti viršutiniame kairiajame kampe rodomo "sprite". Tokiu atveju turite sureguliuoti sprite rodymo padėtį, tačiau tai bus paaiškinta kitame skyriuje.

Visi kodai

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

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

        /// <summary>
        /// テクスチャー
        /// </summary>
        private Texture2D texture = 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.texture = this.Content.Load<Texture2D>("Texture");
        }

        /// <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.Draw(this.texture, Vector2.Zero, Color.White);

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

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