2D Graphics Overview
Sprites are 2D bitmaps drawn directly on the screen, as opposed to being drawn in 3D space. Sprites are commonly used to display information such as health bars, number of lives, or text such as scores. Some games, especially older games, are composed entirely of sprites. This topic discusses sprites in detail, covering the following areas.
2D graphics的應用場景。例如：分數，血條等。
- Overview
- Sprite Origin
- Sprite Depth
- Sampling Textures
- Sprite Scaling
- Sprite Transformation Matrices
- Sprite Fonts
- Sprite Batching
- Render States
- Point Sprites
Overview
Sprites are positioned on the screen by coordinates. The width and height of the screen is the same as the back buffer. The x-axis represents the screen width and the y-axis represents the screen height. It is important to note that the y-axis is measured from the top of the screen and increases as you move down the screen, and the x-axis is measured from left to right. For example, when the graphics back buffer is 800×600, 0,0 is the upper left of the screen, and 800,600 is the lower right of the screen (see Figure 1).
注意XY坐标的起始點都是在螢幕左上角。
Figure 1. A sprite's location in screen coordinates (x-axis 400, y-axis 200)
To draw a sprite, you must create a SpriteBatch object, initialize it by calling Begin, and then call Draw for each sprite. The bitmap information for a sprite is taken from a Texture2D object. The texture may contain alpha channel information to make part of the texture transparent or semi-transparent. You can tint, rotate, or scale sprites by using Draw. This method also gives you the option of drawing only part of the texture on the screen. After you draw the sprites, call End before calling Present.
使用SpriteBatch來繪制Sprite。我們也可以對sprite縮放，旋轉，着色。注意，繪制之前需要調用Begin,結束之後調用End。
Sprite Origin
When you draw sprites, the sprite origin is the most important concept. The origin is a specific point on the sprite, which is by default the upper-left corner of the sprite, or (0,0). Draw draws the origin of the sprite at the screen location you specify. For example, if you draw a 50×50 pixel sprite at location (400,200) without specifying an origin, the upper left of the sprite will be on pixel (400,200). If you use the center of the 50×50 sprite as the origin (25,25), to draw the sprite in the same position you must add the origin coordinates to the position. In this case, the position is (425,225) and the origin is (25,25), as shown in Figure 2.
Figure 2. The blue dot indicates the center coordinate of the sprite
When rotating a sprite, the method uses the origin as the center of the rotation. In these cases, it is common to use the center of the sprite as the origin when calculating where to draw the sprite on the screen.
設定origin，就是設定了sprite的繪制中點。
Sprite Depth
Sprites also have a concept of depth. When drawing a sprite, you can specify a depth between 0 and 1 as a floating-point number. Sprites drawn at a depth of 0 are at the "front" of the screen, and will cover any sprites drawn at a lower depth. Sprites drawn at a depth of 1 are at the "back" of the screen, and will be covered by any sprites drawn at a depth less than 1. 、
精靈的深度代表繪制覆寫順序，就是深度接近0的在上面，接近1的在後面。
Sampling Textures
A sprite is based on a Texture2D object—in other words, a bitmap. Draw can draw the entire texture, or a portion of the texture. To draw a portion of the texture, use the sourceRectangle parameter to specify which texels to draw as a sprite. A texel is a pixel in the texture. A 32×32 texture has 1024 texels, specified as x and y values similar to how screen coordinates are specified. Specifying a sourceRectangle of (0, 0, 16, 16) would select the upper-left quadrant of a 32×32 texture.
設定sourceRectangle可以繪制部分sprite.
Sprite Scaling
Draw provides three methods of scaling sprites. Draw accepts either a uniform scaling parameter, a nonuniform scaling parameter, or a source and destination rectangle.
三種縮放方式。
The uniform scaling parameter is a floating-point number that multiplies the sprite size through both the x- and y-axes. This will shrink or expand the sprite along each axis equally, maintaining the original ratio between the sprite width and height.
統一縮放，根據數值，同時縮放長寬。
To scale the x- and y-axes independently, Draw accepts a Vector2 value as a scalar. This Vector2 specifies nonuniform scaling: x- and y-axes are scaled independently according to the X and Y fields of the Vector2.
通過Vector2來設定縮放，可以讓長寬獨立縮放。
Draw also accepts a source and destination rectangle. The destination rectangle is specified in screen coordinates, while the source rectangle is specified in texels. Draw takes the pixels on the texture specified in sourceRectangle and scales them independently along the x- and y-axes until they fit the screen coordinates specified by destinationRectangle.
通過區域來縮放。就是可以截取sprite的一部分，然後繪制到螢幕的某個區域。
Sprite Transformation Matrices
XNA Game Studio includes a feature for sprite batches—the ability to specify a transformation matrix that the batch can apply to each sprite before drawing.
通過SpriteBatch可以設定轉換矩陣，以此應用到sprite上面。
The transformation matrix can be any combination of translation, rotation, or scaling matrices multiplied together into a single matrix.
這個變換矩陣可以進行組合。
This matrix is combined with the sprite position, rotation, scaling, and depth parameters supplied to Draw. Because the matrix also applies to depth, any z-coordinate transformation that makes the sprite depth greater than 1.0 or less than 0.0 will cause the sprite to disappear.
這個矩陣可以包含位置，旋轉，縮放和深度資訊。注意，深度超過1或者小于0的就沒有辦法顯示出來了。
See How To: Rotate a Group of Sprites for an example of matrix rotation, and How To: Scale Sprites Based On Screen Size for an example of matrix scaling.
Sprite Fonts
XNA Game Studio enables you to draw text using SpriteBatch. The DrawString method will draw text on screen with position, color, rotation, origin, and scaling.
可以繪制文字。
DrawString also requires a special type of texture encapsulated by the SpriteFont class. A SpriteFont is created by the Content Pipeline when you add a Sprite Font file to your project. The Sprite Font file has information such as the name and point size of the font, and which Unicode characters to include in the SpriteFont texture. At run time, a SpriteFont is loaded with ContentManager.Load just like a Texture2D object.
繪制文字時需要SpriteFont對象。
See How To: Draw Text for an example of how to use SpriteFont to draw text, and Sprite Font XML Schema Reference for a list of Sprite Font tags. You can use the Content Pipeline to determine your character regions automatically. For more information, see How To: Extend the Font Description Processor to Support Additional Characters.
Sprite Batching
In normal drawing, the SpriteBatch object does not change any render states or draw any sprites until you call End. This is known as Deferred mode. In Deferred mode, SpriteBatch saves the information from each Draw call until you call End. When you then call End, SpriteBatch changes the graphics device settings and draws each sprite in the batch. End then resets the device settings, if you specified SaveStateMode.SaveState.
預設情況下，調用End方法時，SpriteBatch才會改變顯示卡設定，并且繪制sprite。這是Deferred模式。
If you call Begin, specifying SpriteSortMode.Immediate, it triggers Immediate mode. In Immediate mode, the SpriteBatch immediately changes the graphics device render states to begin drawing sprites. Thereafter, each call to Draw immediately draws the sprite using the current device settings. Calling End resets the device settings, if you specified SaveStateMode.SaveState.
關于Immediate模式。
In Immediate mode, once you call Begin on one SpriteBatch instance, do not call it on any other SpriteBatch instance until you call End for the first SpriteBatch.
注意：在Immediate模式下，SpriteBatch對象需要逐個調用Begin和End。
Deferred mode is slower than Immediate mode, but it allows multiple instances of SpriteBatch to accept Begin and Draw calls without interfering with each other.
在Deferred模式下，XNA可以接受多個SpriteBatch對象的Begin和End而不會互相影響。
Render States
The SpriteBatch object sets the following render states on the graphics card when drawing sprites.
| Render State | Value |
|---|---|
| GraphicsDevice.RenderState.CullMode | CullMode.CullCounterClockwiseFace |
| GraphicsDevice.RenderState.DepthBufferEnable | false |
| GraphicsDevice.RenderState.AlphaBlendEnable | true |
| GraphicsDevice.RenderState.AlphaBlendOperation | BlendFunction.Add |
| GraphicsDevice.RenderState.SourceBlend | Blend.SourceAlpha |
| GraphicsDevice.RenderState.DestinationBlend | Blend.InverseSourceAlpha |
| GraphicsDevice.RenderState.SeparateAlphaBlendEnabled | false |
| GraphicsDevice.RenderState.AlphaTestEnable | true |
| GraphicsDevice.RenderState.AlphaFunction | CompareFunction.Greater |
| GraphicsDevice.RenderState.ReferenceAlpha | |
| GraphicsDevice.SamplerStates[0].AddressU | TextureAddressMode.Clamp |
| GraphicsDevice.SamplerStates[0].AddressV | TextureAddressMode.Clamp |
| GraphicsDevice.SamplerStates[0].MagFilter | TextureFilter.Linear |
| GraphicsDevice.SamplerStates[0].MinFilter | TextureFilter.Linear |
| GraphicsDevice.SamplerStates[0].MipFilter | TextureFilter.Linear |
| GraphicsDevice.SamplerStates[0].MipMapLevelOfDetailBias | 0.0f |
| GraphicsDevice.SamplerStates[0].MaxMipLevel |
The most important settings changed are DepthBufferEnable (normally true), AlphaBlendEnable (normally false), and AlphaTestEnable (normally false). You may also want to set TextureAddressMode.Wrap for the AddressU and AddressV sampler states.
最重要的幾個屬性。
The SpriteBatch object also sets the Vertices, Indices, VertexDeclaration, VertexShader, and PixelShader properties on the current GraphicsDevice.
In Immediate mode, all of the render states can be changed before Draw is called, and Draw will use the new render states. How To: Apply a Pixel Shader to Sprites takes advantage of this to apply a custom pixel shader to Draw.
Point Sprites
Point sprites are sprites drawn in 3D space. These sprites are specified by a position and a size. When a point sprite is rendered, it always appears the same size on screen (no matter where the point lies in 3D space relative to the camera) and faces the camera. Point sprites are used to render particle systems. How To: Apply a Pixel Shader to Sprites gives an example of how to render point sprites using a simple pixel and vertex shader.
Point Sprite應用在3D空間中，可以指定位置和大小。注意，point sprite的大小是不會變化的，即使我們移動了camera. 一般我們使用Point Sprite來渲染粒子系統。