make gui apps with shoes
TRANSCRIPT
![Page 1: Make GUI Apps with Shoes](https://reader034.vdocuments.us/reader034/viewer/2022050613/5451e589af7959013e8b4754/html5/thumbnails/1.jpg)
Make GUI Apps with ShoesBrian Hogan
![Page 2: Make GUI Apps with Shoes](https://reader034.vdocuments.us/reader034/viewer/2022050613/5451e589af7959013e8b4754/html5/thumbnails/2.jpg)
Shoes?
![Page 3: Make GUI Apps with Shoes](https://reader034.vdocuments.us/reader034/viewer/2022050613/5451e589af7959013e8b4754/html5/thumbnails/3.jpg)
simple GUI toolkit
![Page 4: Make GUI Apps with Shoes](https://reader034.vdocuments.us/reader034/viewer/2022050613/5451e589af7959013e8b4754/html5/thumbnails/4.jpg)
why ruby?• Highly dynamic
• Very high level
• 100% object oriented
• 100% open-source
• Really easy to learn
![Page 5: Make GUI Apps with Shoes](https://reader034.vdocuments.us/reader034/viewer/2022050613/5451e589af7959013e8b4754/html5/thumbnails/5.jpg)
simple code.
age = 42first_name = "Homer"start_date = Date.new 1980, 06, 05annual_salary = 100000.00
![Page 6: Make GUI Apps with Shoes](https://reader034.vdocuments.us/reader034/viewer/2022050613/5451e589af7959013e8b4754/html5/thumbnails/6.jpg)
Ruby is dynamically typed
![Page 7: Make GUI Apps with Shoes](https://reader034.vdocuments.us/reader034/viewer/2022050613/5451e589af7959013e8b4754/html5/thumbnails/7.jpg)
but strong-typed!
![Page 8: Make GUI Apps with Shoes](https://reader034.vdocuments.us/reader034/viewer/2022050613/5451e589af7959013e8b4754/html5/thumbnails/8.jpg)
so a string and a number can be
declared without a type...
![Page 9: Make GUI Apps with Shoes](https://reader034.vdocuments.us/reader034/viewer/2022050613/5451e589af7959013e8b4754/html5/thumbnails/9.jpg)
...but you can’t just add a number to a string without converting it.
age = 25"you are " + age.to_s + " years old!"
![Page 10: Make GUI Apps with Shoes](https://reader034.vdocuments.us/reader034/viewer/2022050613/5451e589af7959013e8b4754/html5/thumbnails/10.jpg)
there’s a shortcut for building strings though:
age = 25"you are #{age} years old."
![Page 11: Make GUI Apps with Shoes](https://reader034.vdocuments.us/reader034/viewer/2022050613/5451e589af7959013e8b4754/html5/thumbnails/11.jpg)
#{} embeds an expression in a string,
converting the result to a string!
![Page 12: Make GUI Apps with Shoes](https://reader034.vdocuments.us/reader034/viewer/2022050613/5451e589af7959013e8b4754/html5/thumbnails/12.jpg)
Ruby has simple logic.if on_probation(start_date) puts "Yes"else puts "no"end
![Page 13: Make GUI Apps with Shoes](https://reader034.vdocuments.us/reader034/viewer/2022050613/5451e589af7959013e8b4754/html5/thumbnails/13.jpg)
Methods (functions) are simple too.
# if start date + 6 months is > todaydef on_probation?(start_date) (start_date >> 6 > Date.today)end
![Page 14: Make GUI Apps with Shoes](https://reader034.vdocuments.us/reader034/viewer/2022050613/5451e589af7959013e8b4754/html5/thumbnails/14.jpg)
Classes can be boring...class Person @first_name @last_name def first_name=(f) @first_name = f end def first_name @first_name end def last_name=(l) @last_name = l end def last_name @last_name endend
![Page 15: Make GUI Apps with Shoes](https://reader034.vdocuments.us/reader034/viewer/2022050613/5451e589af7959013e8b4754/html5/thumbnails/15.jpg)
...or awesome!class User attr_accessor :first_name, :last_nameend
![Page 16: Make GUI Apps with Shoes](https://reader034.vdocuments.us/reader034/viewer/2022050613/5451e589af7959013e8b4754/html5/thumbnails/16.jpg)
Everything is an object... even integers
and strings!
![Page 17: Make GUI Apps with Shoes](https://reader034.vdocuments.us/reader034/viewer/2022050613/5451e589af7959013e8b4754/html5/thumbnails/17.jpg)
Arrays
colors = ["Red", "Green", "Blue"]
![Page 18: Make GUI Apps with Shoes](https://reader034.vdocuments.us/reader034/viewer/2022050613/5451e589af7959013e8b4754/html5/thumbnails/18.jpg)
Hashes (dictionaries)
attributes = {:age => 25, :first_name => "Homer", :last_name => "Simpson"}
![Page 19: Make GUI Apps with Shoes](https://reader034.vdocuments.us/reader034/viewer/2022050613/5451e589af7959013e8b4754/html5/thumbnails/19.jpg)
=>
![Page 20: Make GUI Apps with Shoes](https://reader034.vdocuments.us/reader034/viewer/2022050613/5451e589af7959013e8b4754/html5/thumbnails/20.jpg)
Hashes as parameters for methods are very
common.
![Page 21: Make GUI Apps with Shoes](https://reader034.vdocuments.us/reader034/viewer/2022050613/5451e589af7959013e8b4754/html5/thumbnails/21.jpg)
Blocks
some_method do some_code_you_wroteend
![Page 22: Make GUI Apps with Shoes](https://reader034.vdocuments.us/reader034/viewer/2022050613/5451e589af7959013e8b4754/html5/thumbnails/22.jpg)
Blocks can iterate...@colors = ["red", "green", "blue"]
@colors.each do |color| puts colorend
![Page 23: Make GUI Apps with Shoes](https://reader034.vdocuments.us/reader034/viewer/2022050613/5451e589af7959013e8b4754/html5/thumbnails/23.jpg)
and encapsulate codecreate_table :products do |t| t.string :name t.text :description t.boolean :visible t.integer :priceend
![Page 24: Make GUI Apps with Shoes](https://reader034.vdocuments.us/reader034/viewer/2022050613/5451e589af7959013e8b4754/html5/thumbnails/24.jpg)
You use them all the time in Ruby.
![Page 25: Make GUI Apps with Shoes](https://reader034.vdocuments.us/reader034/viewer/2022050613/5451e589af7959013e8b4754/html5/thumbnails/25.jpg)
in fact, every method can take a block.
5.times do puts "Hello!"end
![Page 26: Make GUI Apps with Shoes](https://reader034.vdocuments.us/reader034/viewer/2022050613/5451e589af7959013e8b4754/html5/thumbnails/26.jpg)
Blocks make it easy to write your own
language.
![Page 27: Make GUI Apps with Shoes](https://reader034.vdocuments.us/reader034/viewer/2022050613/5451e589af7959013e8b4754/html5/thumbnails/27.jpg)
DSL - Domain Specific Language
![Page 28: Make GUI Apps with Shoes](https://reader034.vdocuments.us/reader034/viewer/2022050613/5451e589af7959013e8b4754/html5/thumbnails/28.jpg)
Shoes is a DSL for making GUI apps.
![Page 29: Make GUI Apps with Shoes](https://reader034.vdocuments.us/reader034/viewer/2022050613/5451e589af7959013e8b4754/html5/thumbnails/29.jpg)
A Shoes app is an object.
![Page 30: Make GUI Apps with Shoes](https://reader034.vdocuments.us/reader034/viewer/2022050613/5451e589af7959013e8b4754/html5/thumbnails/30.jpg)
You use blocks to define the user
interface and trigger events,
![Page 31: Make GUI Apps with Shoes](https://reader034.vdocuments.us/reader034/viewer/2022050613/5451e589af7959013e8b4754/html5/thumbnails/31.jpg)
Shoes.app :title => "Hello World" do alert "Hello World"end
![Page 32: Make GUI Apps with Shoes](https://reader034.vdocuments.us/reader034/viewer/2022050613/5451e589af7959013e8b4754/html5/thumbnails/32.jpg)
Shoes.app :title => "Hello World" do button "Click me" do alert "Hello World" endend
![Page 33: Make GUI Apps with Shoes](https://reader034.vdocuments.us/reader034/viewer/2022050613/5451e589af7959013e8b4754/html5/thumbnails/33.jpg)
Shoes.app :title => "Hello World", :width => 320, :height => 240 do background red end
![Page 34: Make GUI Apps with Shoes](https://reader034.vdocuments.us/reader034/viewer/2022050613/5451e589af7959013e8b4754/html5/thumbnails/34.jpg)
Shoes.app :title => "Hello World", :width => 320, :height => 240 do background red..black end
![Page 35: Make GUI Apps with Shoes](https://reader034.vdocuments.us/reader034/viewer/2022050613/5451e589af7959013e8b4754/html5/thumbnails/35.jpg)
stacks
![Page 36: Make GUI Apps with Shoes](https://reader034.vdocuments.us/reader034/viewer/2022050613/5451e589af7959013e8b4754/html5/thumbnails/36.jpg)
Shoes.app :title => "Hello World", :width => 320, :height => 240 do stack do para "Hello" para "World" end end
![Page 37: Make GUI Apps with Shoes](https://reader034.vdocuments.us/reader034/viewer/2022050613/5451e589af7959013e8b4754/html5/thumbnails/37.jpg)
flows
![Page 38: Make GUI Apps with Shoes](https://reader034.vdocuments.us/reader034/viewer/2022050613/5451e589af7959013e8b4754/html5/thumbnails/38.jpg)
Shoes.app :title => "Hello World", :width => 320, :height => 240 do flow do para "Hello" para "World" end end
![Page 39: Make GUI Apps with Shoes](https://reader034.vdocuments.us/reader034/viewer/2022050613/5451e589af7959013e8b4754/html5/thumbnails/39.jpg)
Combine stacks and flows.
![Page 40: Make GUI Apps with Shoes](https://reader034.vdocuments.us/reader034/viewer/2022050613/5451e589af7959013e8b4754/html5/thumbnails/40.jpg)
Shoes.app :title => "Hello World", :width => 320, :height => 240 do stack :width => "100%" do background gray title "Hello World" end stack :width => "50%" do flow :width => "100%" do para "Left side has some text" end end stack :width => "50%" do background white para "Right side has some text" para "without an inner flow." end
end
![Page 41: Make GUI Apps with Shoes](https://reader034.vdocuments.us/reader034/viewer/2022050613/5451e589af7959013e8b4754/html5/thumbnails/41.jpg)
Shoes.app :title => "Hello World" do stack do banner "Hello there." title "The quick" subtitle "brown fox" tagline "jumped" caption "over" para "the" inscription "lazy dog" endend
![Page 42: Make GUI Apps with Shoes](https://reader034.vdocuments.us/reader034/viewer/2022050613/5451e589af7959013e8b4754/html5/thumbnails/42.jpg)
edit_lineShoes.app :title => "Hello World" do para "Enter your name" @name = edit_lineend
![Page 43: Make GUI Apps with Shoes](https://reader034.vdocuments.us/reader034/viewer/2022050613/5451e589af7959013e8b4754/html5/thumbnails/43.jpg)
Shoes.app :title => "text boxes" do para "Password" @pass = edit_line(:secret => true)end
edit_line
![Page 44: Make GUI Apps with Shoes](https://reader034.vdocuments.us/reader034/viewer/2022050613/5451e589af7959013e8b4754/html5/thumbnails/44.jpg)
edit_boxShoes.app :title => "text boxes" do para "About Me" @about = edit_boxend
![Page 45: Make GUI Apps with Shoes](https://reader034.vdocuments.us/reader034/viewer/2022050613/5451e589af7959013e8b4754/html5/thumbnails/45.jpg)
list_boxShoes.app :title => "text boxes" do para "Colors" @color = list_box :items => ["green", "red", "blue"]end
![Page 46: Make GUI Apps with Shoes](https://reader034.vdocuments.us/reader034/viewer/2022050613/5451e589af7959013e8b4754/html5/thumbnails/46.jpg)
Use .text to grab the values in the boxes.
Shoes.app :title => "Hello World" do para "Enter your name" @name = edit_line button "Go" do name = @name.text alert "Hello #{name}" endend
![Page 47: Make GUI Apps with Shoes](https://reader034.vdocuments.us/reader034/viewer/2022050613/5451e589af7959013e8b4754/html5/thumbnails/47.jpg)
Since everything is an object, you can work with it... even stacks
and flows!
![Page 48: Make GUI Apps with Shoes](https://reader034.vdocuments.us/reader034/viewer/2022050613/5451e589af7959013e8b4754/html5/thumbnails/48.jpg)
Shoes.app do para "add name" button "Add" do @names.append do para @name.text end @name.text = "" end @names = stackend
![Page 49: Make GUI Apps with Shoes](https://reader034.vdocuments.us/reader034/viewer/2022050613/5451e589af7959013e8b4754/html5/thumbnails/49.jpg)
Ooooh.. windows!Shoes.app do button "Open window" do window :title => "Child" do para "Hello!" end endend
![Page 50: Make GUI Apps with Shoes](https://reader034.vdocuments.us/reader034/viewer/2022050613/5451e589af7959013e8b4754/html5/thumbnails/50.jpg)
Shoes can load images, play music, and play
movies.
![Page 51: Make GUI Apps with Shoes](https://reader034.vdocuments.us/reader034/viewer/2022050613/5451e589af7959013e8b4754/html5/thumbnails/51.jpg)
You can use and embed almost every Ruby
library
![Page 52: Make GUI Apps with Shoes](https://reader034.vdocuments.us/reader034/viewer/2022050613/5451e589af7959013e8b4754/html5/thumbnails/52.jpg)
![Page 53: Make GUI Apps with Shoes](https://reader034.vdocuments.us/reader034/viewer/2022050613/5451e589af7959013e8b4754/html5/thumbnails/53.jpg)
![Page 54: Make GUI Apps with Shoes](https://reader034.vdocuments.us/reader034/viewer/2022050613/5451e589af7959013e8b4754/html5/thumbnails/54.jpg)
It can open browser windows...
![Page 55: Make GUI Apps with Shoes](https://reader034.vdocuments.us/reader034/viewer/2022050613/5451e589af7959013e8b4754/html5/thumbnails/55.jpg)
..and hook into the OS’s open, save, fonts,
and color pickers.
![Page 56: Make GUI Apps with Shoes](https://reader034.vdocuments.us/reader034/viewer/2022050613/5451e589af7959013e8b4754/html5/thumbnails/56.jpg)
Make games with Shoes!
![Page 57: Make GUI Apps with Shoes](https://reader034.vdocuments.us/reader034/viewer/2022050613/5451e589af7959013e8b4754/html5/thumbnails/57.jpg)
You can build installers for Windows, Linux, and
Mac.
![Page 58: Make GUI Apps with Shoes](https://reader034.vdocuments.us/reader034/viewer/2022050613/5451e589af7959013e8b4754/html5/thumbnails/58.jpg)
What makes Shoes so great?
![Page 59: Make GUI Apps with Shoes](https://reader034.vdocuments.us/reader034/viewer/2022050613/5451e589af7959013e8b4754/html5/thumbnails/59.jpg)
It lets you build things fast...
![Page 60: Make GUI Apps with Shoes](https://reader034.vdocuments.us/reader034/viewer/2022050613/5451e589af7959013e8b4754/html5/thumbnails/60.jpg)
...and have fun doing it.
![Page 61: Make GUI Apps with Shoes](https://reader034.vdocuments.us/reader034/viewer/2022050613/5451e589af7959013e8b4754/html5/thumbnails/61.jpg)
http://github.com/napcs/shoes_demo_apps/http://the-shoebox.org/
http://github.com/whymirror/shoes/
![Page 62: Make GUI Apps with Shoes](https://reader034.vdocuments.us/reader034/viewer/2022050613/5451e589af7959013e8b4754/html5/thumbnails/62.jpg)
twitter: bphogan
http://www.napcs.com/