gui gradient scaling?
Author
In a continuation from this thread i would like to ask a follow up question.
Basically i want to have a Y axis gradient but in the other thread nife87 said to keep the borders 1xA were 'A' is the size of the corners. If i do that i would be able to have a gradient so how exactly are gradients done in GUI development?
Thanks
For simple linear gradients you can use per vertex colors. The gpu will do the linear interpolation and create the gradient.
Quote:Original post by carlj133
But for this GUI i'm using images so how would i do it using them?
You cannot have Y-axis gradient on the vertical borders using the previously explained method. Normally such gradients will be made with simple colors like Kambiz suggested or perhaps by actually making/creating the images run-time (this will then be needed every time the window is scaled) to avoid scaling static/premade images. The latter solution is clearly the most flexible, since you can do much more than just simple linear gradients. But should you choose the latter solution, you could also go with a shader-based approach (may be too much for your needs), where some parts of the GUI are still stored as static images (only parts that cannot be calculated via simple formulas), and where some parts (preferably most parts) are created dynamically in shaders.
Author
Quote:Original post by nife87Quote:Original post by carlj133
But for this GUI i'm using images so how would i do it using them?
You cannot have Y-axis gradient on the vertical borders using the previously explained method. Normally such gradients will be made with simple colors like Kambiz suggested or perhaps by actually making/creating the images run-time (this will then be needed every time the window is scaled) to avoid scaling static/premade images. The latter solution is clearly the most flexible, since you can do much more than just simple linear gradients. But should you choose the latter solution, you could also go with a shader-based approach (may be too much for your needs), where some parts of the GUI are still stored as static images (only parts that cannot be calculated via simple formulas), and where some parts (preferably most parts) are created dynamically in shaders.
It's not on the vertical borders. It's the left-hand side border.
Quote:Original post by carlj133
But for this GUI i'm using images so how would i do it using them?
Use gray scale images and multiply the colors with the gradients. This doesn't even require shades. (If you are using OpenGL look how the boxes in NeHe lesson 12 are colored, it is really simply: just set the vertex colors and render just like before... )
EDIT:
To make it clear, unlike lesson 12 you have to give each vertex a different color:
[Edited by - Kambiz on August 16, 2008 6:43:22 PM]
But what do you do if you want more control over the gradient. Where the second color
starts blending in and where it's the only color. I don't you can get this using this method.
starts blending in and where it's the only color. I don't you can get this using this method.
With a shader it is definitely possible, but instead of colors, you would have to assign texture coordinates which get converted to a color (via a gradient) in the shader.
This topic is closed to new replies.
Advertisement
Popular Topics
Advertisement
