About Store Forum Documentation Contact



Post Reply 
Image draw vs drawButton Problem
Author Message
fatcoder Offline
Member

Post: #1
Image draw vs drawButton Problem
I'm trying to draw an image that has a very feint gradient in it. Here is an example image. If you look carefully you can see the gradient on the image.

   

I convert this png image to a B8G8R8A8 gfx file with no mip maps.

When I draw the gfx image using the draw() method, it comes out like this. Notice it keeps the feint smooth gradient.

   

However, when I draw it using the drawButton() method, it comes out like this. Notice the loss of the gradient and the hard line.

   

I want to use the drawButton() method as I want to maintain the border pixels as my actual images can have different border pixels. However, I want to also keep the smooth gradient. Is this possible with the drawButton() method?

I see the drawButton() method has a tex_frac parameter, but there is nothing in the comments about what it does? Esenthel, can you please explain what tex_frac does?

P.S. Sorry about the images being so small. If you zoom your browser in 200% or 400% you can see what I'm talking about much easier.
(This post was last modified: 03-01-2013 03:52 AM by fatcoder.)
03-01-2013 03:51 AM
Find all posts by this user Quote this message in a reply
gwald Offline
Member

Post: #2
RE: Image draw vs drawButton Problem
Flt tex_frac=0.25f
I can tell you it likes being set to .25 lol grin
I doubt it would be useful, or else it would have been documented, maybe?

My Blog
http://www.esenthel.com/community/showthread.php?tid=6043

I hang out at Esenthel IRC Channel
http://webchat.freenode.net/?channels=#Esenthel
(This post was last modified: 03-01-2013 06:17 AM by gwald.)
03-01-2013 05:42 AM
Visit this user's website Find all posts by this user Quote this message in a reply
Esenthel Offline
Administrator

Post: #3
RE: Image draw vs drawButton Problem
I've improved the comments:

void drawButton (C Color &color, C Color &color_add, C Rect &rect, Flt border_width=0.007f, Flt tex_frac=0.25f)C; // 'color'=color that will be multiplied by the texture, 'color_add'=color that will be added to the texture using following formula "final_color = texture_color * color + color_add", 'rect'=screen rectangle at which the image will be drawn, 'border_width'=size of the border inside the screen 'rect' rectangle that will be drawn as image borders (this value should be less than rectangle dimensions), 'tex_frac'=fraction of the image texture that will be used for drawing the borders (this value should be in range of 0..1)
void drawButtonVertical(C Color &color, C Color &color_add, C Rect &rect, Flt border_width=0.007f, Flt tex_frac=0.25f)C; // 'color'=color that will be multiplied by the texture, 'color_add'=color that will be added to the texture using following formula "final_color = texture_color * color + color_add", 'rect'=screen rectangle at which the image will be drawn, 'border_width'=size of the border inside the screen 'rect' rectangle that will be drawn as image borders (this value should be less than rectangle dimensions), 'tex_frac'=fraction of the image texture that will be used for drawing the borders (this value should be in range of 0..1), this function will draw with texture coordinates in vertical mode

perhaps your border_width is too big?

Look into the attached default gui button image, it's borders will be stretched into 'border_width' screen size, by taking 'tex_frac' of the source image.

@gwald: this is what I've asked you before, simply let me know what function is not commented well enough and I will improve that


Attached File(s) Image(s)
   
03-01-2013 01:40 PM
Find all posts by this user Quote this message in a reply
fatcoder Offline
Member

Post: #4
RE: Image draw vs drawButton Problem
Woah! Easy does it with the commenting! lol

Sorry, I didn't mean that I don't understand the function. In my opinion the function is pretty self explanatory and so are all of its parameters (except for the tex_frac one). I can't speak for everyone, but personally, I think the level of commenting in the headers is already very good. Some parameters like color, color_add and rect for example are pretty obvious and don't need any explanation. Just my opinion. I think you really only need to worry about obscure parameters.

Anyway, regarding my problem, I'm not having any trouble with the borders. The test image in the above example has no borders. I'm actually talking about the gradient in the image. Instead of it coming out smooth, it comes out with a hard line through the middle (zoom your browser and compare the two renders in my first post). I imagine that drawButton() is just drawing the image in 9 parts, so shouldn't the centre part be stretched out. Why am I getting the hard line through the middle of it?
03-01-2013 04:34 PM
Find all posts by this user Quote this message in a reply
Esenthel Offline
Administrator

Post: #5
RE: Image draw vs drawButton Problem
wink
maybe my suggestion in previous got lost among all the information:
"perhaps your border_width is too big?"
did you try modifying this value?
perhaps those borders occupy half of the image rectangle?
03-01-2013 04:39 PM
Find all posts by this user Quote this message in a reply
fatcoder Offline
Member

Post: #6
RE: Image draw vs drawButton Problem
Ah ok. Making the border_width smaller does solve the problem. However than I lose a lot of the border detail. Border becomes to thin. Perhaps I need to rework the source texture so there is more border pixels in it like you have in your example one above.
03-02-2013 02:57 AM
Find all posts by this user Quote this message in a reply
gwald Offline
Member

Post: #7
RE: Image draw vs drawButton Problem
(03-01-2013 01:40 PM)Esenthel Wrote:  I've improved the comments:

void drawButton (C Color &color, C Color &color_add, C Rect &rect, Flt border_width=0.007f, Flt tex_frac=0.25f)C; // 'color'=color that will be multiplied by the texture, 'color_add'=color that will be added to the texture using following formula "final_color = texture_color * color + color_add", 'rect'=screen rectangle at which the image will be drawn, 'border_width'=size of the border inside the screen 'rect' rectangle that will be drawn as image borders (this value should be less than rectangle dimensions), 'tex_frac'=fraction of the image texture that will be used for drawing the borders (this value should be in range of 0..1)
void drawButtonVertical(C Color &color, C Color &color_add, C Rect &rect, Flt border_width=0.007f, Flt tex_frac=0.25f)C; // 'color'=color that will be multiplied by the texture, 'color_add'=color that will be added to the texture using following formula "final_color = texture_color * color + color_add", 'rect'=screen rectangle at which the image will be drawn, 'border_width'=size of the border inside the screen 'rect' rectangle that will be drawn as image borders (this value should be less than rectangle dimensions), 'tex_frac'=fraction of the image texture that will be used for drawing the borders (this value should be in range of 0..1), this function will draw with texture coordinates in vertical mode
grin nice and idiot proof wink

My Blog
http://www.esenthel.com/community/showthread.php?tid=6043

I hang out at Esenthel IRC Channel
http://webchat.freenode.net/?channels=#Esenthel
03-02-2013 10:48 AM
Visit this user's website Find all posts by this user Quote this message in a reply
Post Reply