Game Development Stack Exchange is a question and answer site for professional and independent game developers. Join them; it only takes a minute:

Sign up
Here's how it works:
  1. Anybody can ask a question
  2. Anybody can answer
  3. The best answers are voted up and rise to the top

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?

share|improve this question
up vote 4 down vote accepted

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);
share|improve this answer
+1 a better idea than creating a new texture each time. – Byte56 Jan 31 '13 at 17:25
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. – Steve Feb 1 '13 at 2:43
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 – 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

share|improve this answer
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 :) – Steve Feb 1 '13 at 2:48

Your Answer


By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.