Free Online Courses for Software Developers - MrBool
× Please, log in to give us a feedback. Click here to login
×

You must be logged to download. Click here to login

×

MrBool is totally free and you can help us to help the Developers Community around the world

Yes, I'd like to help the MrBool and the Developers Community before download

No, I'd like to download without make the donation

×

MrBool is totally free and you can help us to help the Developers Community around the world

Yes, I'd like to help the MrBool and the Developers Community before download

No, I'd like to download without make the donation

How to bring textured entities in Windows Phones

This tutorial will help the developers to get acquainted on the area to come up with dynamic textures in Windows Phone.

One of the most common means in order to fetch a textured object is by loading it as program content. Or one can also create a textured object entirely in code making use of the below constructor:

Listing 1: Constructor

Texture2D texture = new Texture2D(this.GraphicsDevice, width, height);

The parameters width and height arguments would be integers. They define the required size of the Texture2D in pixels;

Points to Note:

  • This size cannot be altered after theTexture2D is generated.
  • The total number of pixels in the bitmap can be calculated easily as width * height.
  • The result is a bitmap filled with zeros.

We have a big question in front of us now: How do we get actual stuff onto the surface of this bitmap?

Well, there are generally two ways to do the same:

  • Draw on the bitmap surface in the same way that you draw on the video display.
  • Algorithmically calculate or manipulate the actual pixel bits that make up the bitmap.

One can make use of these two techniques separately else this can also be done in combination with each other. One can also initiate with an existing image and then alter it by making use of all these methods or techniques.

The Render Target

One cannot actually make use of first of the two techniques with a Texture2Dobject. You would require coming up with an instance of a class that derives from Texture2D called RenderTarget2D:

Listing 2: RenderTarget2D

RenderTarget2D renderTarget = new RenderTarget2D(this.GraphicsDevice, width, height);

Like with every other code that actually references the GraphicsDevice property of the Game class, one would also require to wait till the time the LoadContent method to create any Texture2D or RenderTarget2D objects that is required by your program. The objects will generally be stored in fields and hence can be displayed later in the Draw override.

In case you are going to generate a RenderTarget2D that more or less remains the same for the duration of the program, this entire operation will be performed during the LoadContent override. In case there is a need to alter the RenderTarget2D as well, one can also draw on the bitmap at the time of Updateoverride. Since RenderTarget2D is derived from Texture2D, the RenderTarget2D can be displayed on the screen during your Draw override.

Assuming you want to come up with something like the below image

Illustrating the Output image

Figure 1: Illustrating the Output image

This is nothing but a huge bunch of text strings all saying "Windows Phone 7" that is rotated around a centre point with colours. The colours vary between cyan and yellow. Also we can have a loop in the Drawoverride that makes 32 calls to the DrawString method of SpriteBatch. However if you assemble those text strings on a single bitmap, the Draw override can be reduced to just a single call to the Draw method of SpriteBatch. Above all, it becomes very simple to treat this assemblage of text strings as a single entity.

This is actually the idea behind Pinwheel Text program. The program's content includes the 14point Segoe UI Mono SpriteFont as illustrated in the below code:

Listing 3: SpriteFont

public class Game1 : Microsoft.Xna.Framework.Game
    {
        GraphicsDeviceManager graphics;
        SpriteBatch spriteBatch; 
        Vector2 screenCenter;
        RenderTarget2D renderTarget;
        Vector2 textureCenter;
        float rotationAngle;
        ...
    }

The most involved part of the program is the LoadContent method. However it has only resulted in setting the

  • screenCenter,
  • renderTarget,
  • textureCenter fields.

The segoe14 and textSize variables set above are generally saved as fields however they're only required locally here:

Listing 4: LoadContent()

protected override void LoadContent()
        {
            // Create a new SpriteBatch, which can be used to draw textures.
            spriteBatch = new SpriteBatch(GraphicsDevice); 
            // Get viewport info
            Viewport viewport = this.GraphicsDevice.Viewport;
            screenCenter = new Vector2(viewport.Width / 2, viewport.Height / 2);
            // Load font and get text size
            SpriteFont segoe14 = this.Content.Load<SpriteFont>("Segoe14");
            string text = " Windows Phone 7";
            Vector2 textSize = segoe14.MeasureString(text); 
            // Create RenderTarget2D
            renderTarget = 
                new RenderTarget2D(this.GraphicsDevice, 2 * (int)textSize.X, 
                                                        2 * (int)textSize.X); 
            // Find center
            textureCenter = new Vector2(renderTarget.Width / 2,
                                        renderTarget.Height / 2); 
            Vector2 textOrigin = new Vector2(0, textSize.Y / 2); 
            // Set the RenderTarget2D to the GraphicsDevice        
            this.GraphicsDevice.SetRenderTarget(renderTarget); 
            // Clear the RenderTarget2D and render the text
            this.GraphicsDevice.Clear(Color.Transparent);
            spriteBatch.Begin(); 
            for (float t = 0; t < 1; t += 1f / 32)
            {
                float angle = t * MathHelper.TwoPi;
                Color clr = Color.Lerp(Color.Cyan, Color.Yellow, t);
                spriteBatch.DrawString(segoe14, text, textureCenter, clr, 
                                       angle, textOrigin, 1, SpriteEffects.None, 0);
            } 
            spriteBatch.End(); 
            // Restore the GraphicsDevice back to normal
            this.GraphicsDevice.SetRenderTarget(null);
        }

The use of the Update method is to calculate a rotation angle for the resultant bitmap, hence it rotates 360° after every eight seconds:

Listing 5: Update(GameTime gameTime)

protected override void Update(GameTime gameTime)
        {
            // Allows the game to exit
            if (GamePad.GetState(PlayerIndex.One).Buttons.Back == ButtonState.Pressed)
                this.Exit(); 
            rotationAngle = 
                (MathHelper.TwoPi * (float) gameTime.TotalGameTime.TotalSeconds / 8) % 
                                                        MathHelper.TwoPi;
            base.Update(gameTime);
        } 

As told earlier, the Draw override can thereafter treat that RenderTarget2D as a normal Texture2D and that too in a single Draw call on the SpriteBatch. All of the 32 text strings seem to rotate in chorus.

Listing 6: Draw(GameTime gameTime)

 protected override void Draw(GameTime gameTime)
        {
            GraphicsDevice.Clear(Color.Navy); 
            spriteBatch.Begin();
            spriteBatch.Draw(renderTarget, screenCenter, null, Color.White, 
                             rotationAngle, textureCenter, 1, SpriteEffects.None, 0);
            spriteBatch.End(); 
            base.Draw(gameTime);
        }

Conclusion

The article’s objective was to make the developers or readers aware on the process to come up with dynamic textures in Windows Phone taking the example of bunch of text strings comprising of Windows Phone7.



I am a software developer from India with hands on experience on java, html for over 5 years.

What did you think of this post?
Services
[Close]
To have full access to this post (or download the associated files) you must have MrBool Credits.

  See the prices for this post in Mr.Bool Credits System below:

Individually – in this case the price for this post is US$ 0,00 (Buy it now)
in this case you will buy only this video by paying the full price with no discount.

Package of 10 credits - in this case the price for this post is US$ 0,00
This subscription is ideal if you want to download few videos. In this plan you will receive a discount of 50% in each video. Subscribe for this package!

Package of 50 credits – in this case the price for this post is US$ 0,00
This subscription is ideal if you want to download several videos. In this plan you will receive a discount of 83% in each video. Subscribe for this package!


> More info about MrBool Credits
[Close]
You must be logged to download.

Click here to login