I am making an image slide show using slimdx and c#. Till now I have done transitions using the matrix transformation but now I am trying to make transitions using some gray scale background image. Can any body please give me an idea how can i perform that or can post some code to give me an idea.


If we first consider the simple case of having two images that as a whole fades from one image in a seamless fashion into the other image, this would be cheapest to express as drawing a quad with a pixel shader.

This shader would have a float shader parameter you set from your code in the range of [0,1]. You can then bind and sample your two textures and lerp between them based on this constant factor.

A value of 0.0 would represent 100% of the first image, a value of 1.0 would be 100% of the second image, 0.25 would be a quarter of the first and three quarters of the second, and so on.

You can then use additional textures to alter the value of this interpolation parameter, like:

  • you could a grayscale texture which could act as an offset to this parameter,
  • you could use the parameter to index inside a 3D texture or a texture array which would represent your wipe,
  • you could use the parameter to translate the texture coordinates used to sample a gradient texture, so that the static gradient band appears to move across your image.
  • you could do something entirely else - with programmable shaders your imagination is the only limit (barring shader complexity limits from the shader model, of course).
|improve this answer|||||

Looking at the SlimDx documentation, I think more information could be useful like what classes you are using to diplay your images?

Generally for a fade-in/out transition you can use a quad with a texture or just a plain color, and using the 'tint' Color, you can make the quad more or less transparent.

If you are familiar with shaders, you can make a shader take multiple Textures and a float as input, and you can then easily calculate the needed mix.

|improve this answer|||||
  • \$\begingroup\$ To display my images I am using a texture to load that image and then the sprite to draw that texture on the buffer. I am trying to do the gradient wipe transition in accordance with some black, white and gray image. \$\endgroup\$ – Yashwinder Jun 3 '11 at 6:14
  • \$\begingroup\$ can you please post some code so that I can better understand \$\endgroup\$ – Yashwinder Jun 7 '11 at 12:23

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

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