Running with Shoes – Colorfy

This tutorial describes some of the basic graphic capabilities of the Shoes Ruby-based mini-GUI toolkit.

With Shoes you can set the fill and stroke color for the different shapes you draw. To start off with some examples using color, here is how to turn the fill and stroke color off. You can disable the fill color for shapes by invoking the nofill method. To remove the stroke, or edge, of a shape invoke the nostroke method.

You can set the fill and stroke color for a shape or the background color in general by invoking fill, stroke, background methods, respectively. You can set an RGB color with the alpha level for each of the aforementioned methods. In addition to the rgb method, you can use the gray, green, red, blue method if are only using a shade of that color.

[source:ruby]
Shoes.app :width => 600, :height => 600 do
background green(0.9)
fill rgb(1.0, 0.0, 0.0, 1.0)
stroke rgb(0.0, 0.0, 1.0, 1.0)
rect 10, 10, 50, 50
nofill
oval 200, 150, 30, 30
end
[/source]

In addition to the adding color to the stroke, you can also specify the width with the strokewidth method.

You can also do some kewl effects with gradients. The fill, stroke, and background methods also accept gradients. Here is an example an example using gradients on the stroke and fill of a rectangle.

[source:ruby]
Shoes.app :width => 600, :height => 600 do
strokewidth 50
stroke “#FFF”..”#03C”, :radius => 40, :angle => 45
fill “#03C”..”#FFF”, :radius => 40, :angle => 90
rect width/2 – 200, height/2 – 200, 400, 400
end
[/source]

To do gradients you need to specify a color range. The “#FFF”..”#03C” is a color range from white to some blueish color. You also need to specify the radiums and angle of the gradient.

Shoes Gradient

There are more Shoes GUI tutorials and code samples here.

Technorati Tags: , , , , , , ,