[Sugar-devel] xo colors & gradients

[Erik Blankinship]

>
> > (1) Is there a way to render gradients using the fill color?  For
> example, if the child's XO fill color is red, I would like to render an
> activity icon using a red gradient.  Maybe there are tricks in SVG which
> make this possible?
>
> Yep, that's possible. Personally I edit all my SVGs by hand, so it's easy
> for me to generate clean XML code and put the fill and stroke variables in
> the correct places. It would seem to feel somewhat off the spirit of the
> sugar icon style (strong, clear, flat shaded silhouettes), but there are a
> few cases where I have considered something along this line, i.e. an icon
> that represents something specifically with different colours like
> ColourDeducto vs Deducto. I don't think I've seen any activity icons try
> this yet, but it might work for some specific cases if it's not used to try
> and make 3d style shaded button icons.


That's good news!

Do you need a hand with a specific icon?


Let's use the hereunder svg as an example.  How would I use the fill_color
as a parameter to create a gradient from the top to the bottom of the
rectangle?  (I can see how I would make a gradient from fill_color to a
hard-coded color, but I would like to create a gradient with stop-color
attributes derived from the fill_color).


<?xml version="1.0" ?><!DOCTYPE svg  PUBLIC '-//W3C//DTD SVG 1.1//EN'  '
http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd' [
<!ENTITY stroke_color "#010101">
<!ENTITY fill_color "#FFFFFF">
]><svg enable-background="new 0 0 55 55" height="55px" version="1.1"
viewBox="0 0 55 55" width="55px" x="0px" xml:space="preserve" xmlns="
http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"
y="0px"><g display="block" id="activity-example">
<rect display="inline" fill="&fill_color;" height="30.771"
stroke="&stroke_color;" stroke-linejoin="round" stroke-width="3.5"
width="41.438" x="6.705" y="12.213"/>
<circle cx="27.504" cy="27.598" display="inline" fill="&stroke_color;"
r="2.946"/>
</g></svg>
-------------- next part --------------
An HTML attachment was scrubbed...
URL: http://lists.sugarlabs.org/archive/sugar-devel/attachments/20100823/8f0c5849/attachment.htm