How to: 背景の上にマスクされたスプライトを描画する?
この文章では、前景のスプライトが部分的に背景を覆い隠しているときに、SpriteBatch?クラスを用いて背景のスプライトと前景のスプライトを描画する方法を述べます。前景のスプライトはHow to: マスキングされたテクスチャの作り方?で述べられているようなマスキングの情報を持ちます。
前景と背景のスプライトを描画する方法
1. How to: スプライトを描画する?のステップ1と2と同じようにgameクラスを作成し、リソースを読み込みます。
2. SpriteBatchオブジェクト二つ作成します。一つは前景用のスプライト、もう一つは背景用のスプライトです。
private SpriteBatch ForegroundBatch;
private SpriteBatch BackgroundBatch;
protected override void LoadGraphicsContent( bool loadAllContent )
{
if (loadAllContent)
{
// TODO: Load any ResourceManagementMode.Automatic content
ForegroundBatch = new SpriteBatch( graphics.GraphicsDevice );
BackgroundBatch = new SpriteBatch( graphics.GraphicsDevice );
...
}
// TODO: Load any ResourceManagementMode.Manual content
}
3. Draw関数内で、SpriteBatch.Begin ()を呼んでSpriteBatchを背景に表示します。このときSpriteBlendMode.Noneを指定し、SpriteBatchがスプライトのアルファ値を反映しないようにします。デフォルトではスプライトはz値の順に描画されます。
4. 背景のスプライトを描画し、関数Endを呼びます。
BackgroundBatch.Begin(); DrawBackground( BackgroundBatch ); BackgroundBatch.End();
5. SpriteBatch.Begin ()を呼び、前景にSpriteBatchを表示します。SpriteBlendMode.AlphaBlendを指定することにより、スプライトのピクセルのアルファ値が0より大きな値のときにはアルファ値の大きさに応じた透明度になります。アルファ値が255だとピクセルは完全に透明になります。SpriteBatch.Begin()を何も引数を指定せずに呼ぶとデフォルトのSpriteBlendMode.AlphaBlendになります。
6. 前景のスプライトを描画し、Endを呼びます。
ForegroundBatch.Begin( SpriteBlendMode.AlphaBlend ); DrawForeground( ForegroundBatch ); ForegroundBatch.End();
using System;
using System.Collections.Generic;
using Microsoft.Xna.Framework;
using Microsoft.Xna.Framework.Audio;
using Microsoft.Xna.Framework.Graphics;
using Microsoft.Xna.Framework.Input;
using Microsoft.Xna.Framework.Storage;
using Microsoft.Xna.Framework.Content;
public class Game1 : Microsoft.Xna.Framework.Game
{
GraphicsDeviceManager graphics;
ContentManager content;
public Game1()
{
graphics = new GraphicsDeviceManager( this );
content = new ContentManager( Services );
}
protected override void Initialize()
{
// TODO: Add your initialization logic here
base.Initialize();
}
private Texture2D[] textures = new Texture2D[2];
const int ShipTexture = 0;
const int StarTexture = 1;
private Vector2 ViperPos; // 前景のスプライトの画面上での位置
//↑Vipperに見えた
public int ScrollHeight; // 背景のスプライトの高さ
private Viewport viewport;
private SpriteBatch ForegroundBatch;
private SpriteBatch BackgroundBatch;
protected override void LoadGraphicsContent( bool loadAllContent )
{
if (loadAllContent)
{
// TODO: Load any ResourceManagementMode.Automatic content
ForegroundBatch = new SpriteBatch( graphics.GraphicsDevice );
BackgroundBatch = new SpriteBatch( graphics.GraphicsDevice );
textures[ShipTexture] = content.Load<Texture2D>( "vipership2" );
textures[StarTexture] = content.Load<Texture2D>( "largestarfield" );
viewport = graphics.GraphicsDevice.Viewport;
ViperPos.X = viewport.Width / 2;
ViperPos.Y = viewport.Height - 100;
ScrollHeight = textures[StarTexture].Height;
}
// TODO: Load any ResourceManagementMode.Manual content
}
protected override void UnloadGraphicsContent( bool unloadAllContent )
{
if (unloadAllContent == true)
{
content.Unload();
}
}
protected override void Update( GameTime gameTime )
{
// Allows the default game to exit on Xbox 360 and Windows
if (GamePad.GetState( PlayerIndex.One ).Buttons.Back == ButtonState.Pressed)
this.Exit();
// TODO: Add your update logic here
base.Update( gameTime );
}
protected override void Draw( GameTime gameTime )
{
graphics.GraphicsDevice.Clear( Color.CornflowerBlue );
// TODO: Add your drawing code here
BackgroundBatch.Begin();
DrawBackground( BackgroundBatch );
BackgroundBatch.End();
ForegroundBatch.Begin( SpriteBlendMode.AlphaBlend );
DrawForeground( ForegroundBatch );
ForegroundBatch.End();
base.Draw( gameTime );
}
private void DrawBackground( SpriteBatch Batch )
{
// スプライトを画面の中央に置く
Vector2 origin = new Vector2( ScrollHeight / 2
- (viewport.Width / 2), 0 );
Batch.Draw( textures[StarTexture], Vector2.Zero, null,
Color.White, 0, origin, 1, SpriteEffects.None, 0.9f );
}
private void DrawForeground( SpriteBatch Batch )
{
//ship(宇宙船?)のテクスチャの大きさは64x64なので、中心は32,32
Vector2 origin = new Vector2( 32, 32 );
Batch.Draw( textures[ShipTexture], ViperPos, null,
Color.White, 0, origin, 1, SpriteEffects.None, 0f );
}
}
こちらもご覧ください
コンセプト
2D Graphics 概要?
2D Graphics 概要?
affillogo.gif