I wish to draw a texture to the screen line by line (horizontal lines). Can I do this in xna?

At first I wish to just start at the top of the texture, draw one single horizontal line of pixels and x no of milliseconds later draw the next line and so on until the texture is fully drawn. In the future I may want to draw these horizontal lines in any order.

Any ideas how best to achieve this?


You can just specify how much of the image you want to draw in the spriteBatch.Draw() method, like so: (Variable declaration is only for self-documentation)

height = Math.Max(height + 1, 500);
Rectangle destinationRect = new Rectangle(0, 0, 500, height);
Rectangle sourceRect = new Rectangle(0, 0, 500, height);
spriteBatch.Draw(my500x500Texture, destinationRect, sourceRect, Color.White);

All this does is draw one more pixel of the background texture every call until it reaches the full height of the image (500 in the example). Note that render speeds will be different on different machines, so you will likely want to base the draw height on the gametime to be more consistent.

To draw random one-line segments of the image, I would use one draw statement per line and draw each line like so:

lineY = 42;  // Figure this part out yourself, and loop this somehow
Rectangle destinationRect = new Rectangle(0, 0 + lineY, 500, 1);  // Drawing at (0,0)
Rectangle sourceRect = new Rectangle(0, lineY, 500, 1);
spriteBatch.Draw(my500x500Texture, destinationRect, sourceRect, Color.White);
  • 1
    \$\begingroup\$ +1 a better idea than creating a new texture each time. \$\endgroup\$
    – House
    Jan 31 '13 at 17:25
  • \$\begingroup\$ I struggled a little deciding on which answer to accept and settled on yours as it does exactly what I asked for and has code that illustrates the idea very clearly. Thank you John. \$\endgroup\$
    – Steve
    Feb 1 '13 at 2:43
  • \$\begingroup\$ actually i agree this is the better answer, having re-read the question you want to draw additional lines, and not additional pixels mine would create more of a running effect than a fill effect \$\endgroup\$
    – RoughPlace
    Feb 1 '13 at 9:17

use Texture2D.getData() to extract the colors array

then use this array to create a new Texture and add a pixel on each time increment

you should be able to modify the below to your need

var texture = new Content.Load<Texture2D>("file");
var colors = texture.GetData();

var colorsNew = new Color[texture.Width * texture.Height];

colorsNew[0] = colors[0]

//DRAW texture


colorsNew[1] = colors[1]

//DRAW texture

note this is untested and you may need to alter the order in which colorsNew is filled, but this should basically do what you require

  • \$\begingroup\$ Thanks for the alternative way of achieving this, I honestly would have accepted both your answer and John's if I were able but I had to make a choice. I will certainly be experimenting with this version though as it offers far more flexibility in how my sprite transitions can look. My final set of classes will no doubt use both approaches. P.S. You will both get the +1's you deserve just as soon as I get 15 reputation :) \$\endgroup\$
    – Steve
    Feb 1 '13 at 2:48

You must log in to answer this question.

Not the answer you're looking for? Browse other questions tagged .