8/7/2019 Tutorial Ruby Bagian 2

1/15

TUTORIAL RUBY DENGAN SHOES GUI

BAHASA PEMOGRAMAN

RUBYdengan SHOES

OLEH :SLAMET NURHADI

TEKNIK INFORMATIKA UNIVERSITAS NASIONAL

8/7/2019 Tutorial Ruby Bagian 2

2/15

1.Animasi TombolAnimasi tombol, buat kode seperti dibawah ini lalu simpan denganekstensi .rb

Shoes.app doflow :margin => 12 do# Set up three buttonsbutton "One"@two = button "Two"button "Three"# Bounce the second buttonanimate do |i|

@two.displace(0, (Math.sin(i) * 6).to_i)end

end

end

buat kode seperti dibawah ini lalu simpan dengan ekstensi .rb

Shoes.app doflow :margin => 12 do

# Set up three buttonsbutton "One"@two = button "Two"button "Three"# Bounce the second button

8/7/2019 Tutorial Ruby Bagian 2

3/15

animate do |i|@two.move(40, 40 + (Math.sin(i) * 6).to_i)

endend

end

2.Style TombolStyle pada Tombol, buat kode seperti dibawah ini lalu simpandengan ekstensi .rb

Shoes.app do# A button which take up the whole page@b = button "All of it", :width => 1.0, :height => 1.0# When clicked, show the styles@b.click { alert(@b.style.inspect) }

End

8/7/2019 Tutorial Ruby Bagian 2

4/15

Style pada Tombol, buat kode seperti dibawah ini lalu simpandengan ekstensi .rb

Shoes.app dostack :width => 120 do

@b = button "Click me", :width => "100%" doalert "button.width = #{@b.width}\n" +

"button.style[:width] = #{@b.style[:width]}"

end end

end

8/7/2019 Tutorial Ruby Bagian 2

5/15

Style pada Tombol, buat kode seperti dibawah ini lalu simpandengan ekstensi .rb

Shoes.app dostack :width => 120 do

@b = button "Click me", :width => "100%" doalert "button.width = #{@b.width}\n" +

"button.style[:width] = #{@b.style[:width]}"end

@c = button "Click me", :width => "100%" doalert "button.width = #{@b.width}\n" +

"button.style[:width] = #{@b.style[:width]}"end

endend

8/7/2019 Tutorial Ruby Bagian 2

6/15

3.TombolMembuat Tombol sederhana, buat kode seperti dibawah ini lalusimpan dengan ekstensi .rb

Shoes.app dobutton "OK!"button "Are you sure?"

end

8/7/2019 Tutorial Ruby Bagian 2

7/15

Shoes.app dobutton "OK!" do

append { para "Well okay then." }

endbutton "Are you sure?" doappend { para "Your confidence is inspiring." }

endend

Shoes.app do@b1 = button "OK!"@b1.click { para "Well okay then." }@b2 = button "Are you sure?"@b2.click { para "Your confidence is inspiring." }

End

8/7/2019 Tutorial Ruby Bagian 2

8/15

4.CheckBoxShoes.app do

stack doflow { check; para "Teknik Informatika" }flow { check; para "Sistem Informasi" }flow { check; para "Telekomunikasi" }flow { check; para "Manajemen Informatika" }

endend

8/7/2019 Tutorial Ruby Bagian 2

9/15

Shoes.app do@list = ['Teknik Informatika', 'Sistem Informasi',

'Telekomunikasi', 'Manajemen Informatika']

stack do@list.map! do |name|flow { @c = check; para name }[@c, name]

endbutton "What's been checked?" do

selected = @list.map { |c, name| name ifc.checked? }.compact

alert("You selected: " + selected.join(', '))end

end

end

8/7/2019 Tutorial Ruby Bagian 2

10/15

5.EditBox

Shoes.app do

edit_boxedit_box :width => 100, :height => 100end

Shoes.app doedit_box do |e|

@counter.text = e.text.sizeend@counter = strong("0")para @counter, " characters"

end

8/7/2019 Tutorial Ruby Bagian 2

11/15

6.EditLine

Shoes.app :height => 300, :width => 500 dostack do

edit_lineedit_line :width => 400

endend

8/7/2019 Tutorial Ruby Bagian 2

12/15

7.ListBox

Shoes.app dopara "Choose a fruit:"

list_box :items => ["Grapes", "Pears", "Apricots"]end

Shoes.app dopara "Choose a fruit:"list_box :items => ["Grapes", "Pears", "Apricots"],

:width => 120, :choose => "Apricots" do |list|@fruit.text = list.text

end@fruit = para "No fruit selected"

End

8/7/2019 Tutorial Ruby Bagian 2

13/15

8.Progress

Shoes.app :height => 150, :width => 500 dostack :margin => 0.1 do

title "contoh Progress"@p = progress :width => 1.0animate do |i|

@p.fraction = (i % 100) / 100.0endend

end

8/7/2019 Tutorial Ruby Bagian 2

14/15

9.Radio

Shoes.app dopara "Among these films, which do you prefer?\n"radio; para strong("The Taste of Tea"), " by Katsuhito Ishii\n"

radio; para strong("Ketika Cinta Bertasbih"), " by Habiburrahmanal syirazi\n"

radio; para strong("Laskar Pelangi"), " by Andrea Hirata\n"end

Shoes.app dostack do

para "Among these films, which do you prefer?"flow do

radio :filmspara "The Taste of Tea by Katsuhito Ishii"

endflow doradio :filmspara "Ketika Cinta Bertasbih by Habiburrahman al syirazi"

endflow do

radio :filmspara "Laskar Pelangi by Andrea Hirata"

8/7/2019 Tutorial Ruby Bagian 2

15/15

end

endend