10 Steps in Shoes, step 1: Para's

Phew, this has been one of those weeks in which you need to put everyone and everything on hold. But now is not a time to stand still, instead we are going to start the Shoes travel by taking the first step in Shoes. It's going to be a short walk though, just 10 steps to be exact. There are 10 basic concepts in Shoes and we will take a look at the basic possibilities of each one as we talk the talk and learn to walk the walk. We will keep it short, so you have no excuses not to walk with us, let's go!

Wear your Shoes
To start taking steps, you first need to have Shoes. So make sure you have Ruby and Shoes installed.

Tie your Shoes
Before we can start using anything in Shoes, we need to create a Shoes app.
Open a file in your favorite editor, mine being vi and call it step1.rb. Notice the .rb extension, that's for Ruby, not Shoes. But how does Ruby know we want to run a Shoes app? Well just write "Shoes.app do" in the first line of your Shoes code. See, Shoes is easy! How to end a Shoes app? Any guesses? Yes you are right, write "end"!

Here's what your Shoes app looks like:

Shoes.app do

end

Para's
Now that you know how to start coding a Shoes app, let's take the first step in Shoes! Any programming starts with a first program to salute the world, so you need to know how to write some text, or a paragraph if you have much to say. Lets write a short paragraph, in fact lets not say paragraph but say para instead.

Shoes.app do
para "Hello World!"
end

Save your file and open it with Shoes by running "shoes step1.rb" or just opening an app from the Shoes GUI. You will get something like this:

Your shoes application screen just gets filled with the characters you provided to para. Para works quite like writing on a piece of paper, you can write in diferent sizes, in different styles, on different locations and in different colors and when you have reached the end, you start again at the following line. Let's try it. Reopen your file in your editor and add the following line:

para "Hello World, are you there?", :size => 48

Save, run and take a look.
What we did here is use the size style option. Note the comma and the semicolon. Style options are key-value pairs of a hash, hence we use => to say that key size has value 48. This is just like the way we use hashes in Ruby. First I thought the biggest size of text in shoes is 48 and it could not grow beyond 48. This is not true however. You can have really huge letter sizes, I'm not sure if there is a maximum. There is some weird behaviour if you use really, really large values though.

Instead of using a para with a certain size value, you can use any of the following:

title (same as para with size of 34)
subtitle (same as para with size of 26)
tagline (same as para with size of 18)
caption (same as para with size of 14)
para (default size is 12)
inscription (same as para with size of 10)

Colour your shoes!
Even though the eighties have long gone and nobody knows what happend to King, we still want to colour our shoes! Don't click that link if you keep some youth sentiment about that moment you saw your first ever music clip on tv, you have been warned! Better humn that song and use the Shoes equivalent to spraycans to be cool like so:

Shoes.app do
para "Hello World!", :size => 48, :stroke => dodgerblue
subtitle "Why are you not answering?", :stroke => red
tagline "Hmm wait, what to say in case it does answer?", :fill => "#FF0000"
inscription "...yes quite some responsibility to be the one who talks to the world", :fill => darkkhaki
end

What do you think this app will look like? Save and run it! As you might have noticed you can use style options for colors too. Colors can be specified by their name or their hexadecimal Red-Green-Blue value. Here's a list for color names and values. We also used some alternatives to para's.

The Fonts is cool
Heeeyy, use cool Fonts and the girls will be kissing with a snap of the fingers! But that was in a time of innocence and the coolest technology around was a motorcycle. For people who have grown up and want more then just kissing, there is Shoes. The happy days are over, but Shoes has many Fonts.

Shoes.app do
para "heeeeyyyy":font => "Helvetica, Arial"
end

These Shoes are made for walking
I guess you get it by now. There is much more you can do with para and it's siblings. Almost everything is related to style.
You should be able to work it out for yourself, just look at the shoes help on styles. Not all styles work for everything, so note what it says after "For".
Here's a small example of various possibilities.

Shoes.app do
para "Centered text!", :size => 14, :align => "center", :stroke => firebrick
subtitle "justify", :justify => true, :stroke => hotpink, :fill => black
para "top and left", :top => 150, :left => 222, :stroke => mediumspringgreen
tagline "oblique", :emphasis => "oblique", :stroke => peru
inscription "displace", :displace_left => 20, :top => 180
para "more left less top", :top => 250, :left => 280, :stroke => olive
title "strikethrough and strikecolor", :strikethrough => "single", :strikecolor => crimson
caption "leading", :leading => 10
para "undercolor", :underline => "single", :undercolor => darkorchid, :top => 210
tagline "Variant Weight", :variant => "smallcaps", :weight => "heavy", :stroke => gold
end

A few last tips: use alt + ? for help and alt + . to reload your Shoes app in the Shoes GUI. Use alt + / for the Shoes console to see debug messages. Use alt + p to package your app.
I suggest you play with the various options for a bit, and get ready for Step 2!