[cairo] Button Graphic

Travis Griggs tgriggs at cincom.com
Mon Jan 28 12:22:56 PST 2008

On Jan 28, 2008, at 11:39 AM, Jeremy Moles wrote:

> Hello all. :)
> I'm using Cairo with OpenSceneGraph to create a HUD system, and I'm
> working on creating a demo which will use Cairo to render a nice,  
> vector
> button object at any resolution. The first screenshot is my "base"
> button image, and the second screenshot is my _attempt_ at adding a
> "glossy overlay" that will be rendered when the mouse is over the
> button. However, as you can see, the "gloss" is extremely poor, and  
> done
> incorrectly.
> My question is: how would you guys achieve this same effect with high
> quality results? First of all, I'm not entire sure I'm even  
> approaching
> it properly: I create a radial gradient, set the operator to ATOP and
> extend to NONE, and fill_preserve() that on top of my existing "base"
> button. The main visual unsightliness (imo) is the jaggies along the
> edge of the radial gradient, which I'm guessing are a result of my
> improper usage of the ATOP operator...
> Also: do you think it would look better if I just "glossed" the inner
> part of the button, leaving the outlines unaffected? ANY  
> recommendations
> are welcome, as I'm coming back to Cairo after a very long hiatus and
> never really fully learned the essentials of vector graphics in the
> first place (though I've become quite good at using and wrapping the
> API :)).

You might check this out:


You can do everything easily there with Cairo, excepting the shrink/ 
rounded corner part.

Travis Griggs
"I choose. Therefore, I Am"

More information about the cairo mailing list