MacRuby is an implementation of Ruby 1.9 directly on top of Mac OS X core technologies. HotCocoa is a thin, idiomatic Ruby layer that sits above Cocoa and other frameworks. Together, they make building Mac applications pain free (for Rubyists). Doc shows us how to get started and then walks us through the creation of a simple app.

1. Michael “Doc” Norton
MacRuby and HotCocoa

2. CodeStock is proudly partnered with:
RecruitWise and Staff with Excellence ‐ www.recruitwise.jobs
Send instant feedback on this session via Twi?er:
Send a direct message with the room number to @CodeStock
d codestock 503 This session is great!
For more informa<on on sending feedback using Twi>er while at
CodeStock, please see the “CodeStock README” in your CodeStock guide.

3. Telerik
Deliver More Than Expected @ Code Stock 2011.
Check out our NEW Just Decompile Product – Powerful, Free Decompiler. Forever.
hDp://www.telerik.com/products/decompiling.aspx
@telerik
Contact your user group leader for a $100 discount off your next Telerik purchase!

4. Introduction to
MacRuby &
HotCocoa
Michael “Doc” Norton
@DocOnDev
http://www.docondev.com/
doc@leandog.com

5. RubyCocoa
• 2001 Written by Fujimoto Hisakuni
• A bridge between objective C and Ruby
• Bundled with Mac OSX 10.5
• Ugly (for Ruby)

6. RubyCocoa Hello World
require 'osx/cocoa'; include OSX
app = NSApplication.sharedApplication
win = NSWindow.alloc.initWithContentRect_styleMask_backing_defer(
[0, 0, 200, 60],
NSTitledWindowMask | NSClosableWindowMask | NSMiniaturizableWindowMask | NSResizableWindowMask,
NSBackingStoreBuffered,
false)
win.title = 'Hello World'
button = NSButton.alloc.initWithFrame(NSZeroRect)
win.contentView.addSubview(button)
button.bezelStyle = NSRoundedBezelStyle
button.title = 'Hello!'
button.sizeToFit
button.frameOrigin = NSMakePoint((win.contentView.frameSize.width / 2.0) - (button.frameSize.width / 2.0),
(win.contentView.frameSize.height / 2.0) - (button.frameSize.height / 2.0))
button_controller = Object.new
def button_controller.sayHello(sender)
puts "Hello World!"
end
button.target = button_controller
button.action = 'sayHello:'
win.display
win.orderFrontRegardless
app.run

7. MacRuby
• 2008 to replace RubyCocoa
• Not a bridge
• Run MUCH Faster
• Still looks ugly

8. MacRuby Hello World
framework ‘Cocoa’
app = NSApplication.sharedApplication
win = NSWindow.alloc.initWithContentRect([0, 0, 200, 60],
styleMask:NSTitledWindowMask | NSClosableWindowMask | NSMiniaturizableWindowMask | NSResizableWindowMask,
backing:NSBackingStoreBuffered,
defer:false)
win.title = 'Hello World'
button = NSButton.alloc.initWithFrame(NSZeroRect)
win.contentView.addSubview(button)
button.bezelStyle = NSRoundedBezelStyle
button.title = 'Hello!'
button.sizeToFit
button.frameOrigin = NSMakePoint((win.contentView.frameSize.width / 2.0) - (button.frameSize.width / 2.0),
(win.contentView.frameSize.height / 2.0) - (button.frameSize.height / 2.0))
button_controller = Object.new
def button_controller.sayHello(sender)
puts "Hello World!"
end
button.target = button_controller
button.action = 'sayHello:'
win.display
win.orderFrontRegardless
app.run

9. What is HotCocoa?
• Ruby API
• Looks and Feels like Ruby -
YAY!
• Simplifies use of Objective C/
Cocoa

10. HotCocoa Hello World
require ‘hotcocoa’; include HotCocoa
app = NSApplication.sharedApplication
win = NSWindow.alloc.initWithContentRect([0, 0, 200, 60],
styleMask:NSTitledWindowMask | NSClosableWindowMask | NSMiniaturizableWindowMask | NSResizableWindowMask,
backing:NSBackingStoreBuffered,
defer:false)
win.title = 'Hello World'
button = NSButton.alloc.initWithFrame(NSZeroRect)
win.contentView.addSubview(button)
button.bezelStyle = NSRoundedBezelStyle
button.title = 'Hello!'
button.sizeToFit
button.frameOrigin = NSMakePoint((win.contentView.frameSize.width / 2.0) - (button.frameSize.width / 2.0),
(win.contentView.frameSize.height / 2.0) - (button.frameSize.height / 2.0))
button_controller = Object.new
def button_controller.sayHello(sender)
puts "Hello World!"
end
button.target = button_controller
button.action = 'sayHello:'
win.display
win.orderFrontRegardless
app.run

11. HotCocoa Hello World
require ‘hotcocoa’; include HotCocoa
app = NSApplication.sharedApplication
win = window :title => ‘hello world’, :frame => [0, 0, 200, 60]
button = NSButton.alloc.initWithFrame(NSZeroRect)
win.contentView.addSubview(button)
button.bezelStyle = NSRoundedBezelStyle
button.title = 'Hello!'
button.sizeToFit
button.frameOrigin = NSMakePoint((win.contentView.frameSize.width / 2.0) - (button.frameSize.width / 2.0),
(win.contentView.frameSize.height / 2.0) - (button.frameSize.height / 2.0))
button_controller = Object.new
def button_controller.sayHello(sender)
puts "Hello World!"
end
button.target = button_controller
button.action = 'sayHello:'
win.display
win.orderFrontRegardless
app.run

12. HotCocoa Hello World
require ‘hotcocoa’; include HotCocoa
app = NSApplication.sharedApplication
win = window :title => ‘hello world’, :frame => [0, 0, 200, 60]
b = button :title => ‘Hello!’, :layout => {:align => :center}
win << b
button_controller = Object.new
def button_controller.sayHello(sender)
puts "Hello World!"
end
button.target = button_controller
button.action = 'sayHello:'
win.display
win.orderFrontRegardless
app.run

13. HotCocoa Hello World
require ‘hotcocoa’; include HotCocoa
app = NSApplication.sharedApplication
win = window :title => ‘hello world’, :frame => [0, 0, 200, 60]
b = button :title => ‘Hello!’, :layout => {:align => :center}
win << b
b.on_action { puts “Hello World!” }
win.display
win.orderFrontRegardless
app.run

14. HotCocoa Hello World
require ‘hotcocoa’; include HotCocoa
application do
win = window :title => ‘hello world’, :frame => [0, 0, 200, 60]
b = button :title => ‘Hello!’, :layout => {:align => :center}
win << b
b.on_action { puts “Hello World!” }
end

15. Getting Started
• hotcocoa stock_schedule
• cd stock_schedule
• macrake

16. What did we make?
./Rakefile
./Stock Schedule.app/
./config/build.yml
./lib/application.rb
./lib/menu.rb
./resources/HotCocoa.icns

17. Menu.rb

18. Menu.rb (Redacted)

19. Application.rb

20. Application.rb (Updated)

21. Application.rb (Updated)

22. Windows & Frames

23. Window with no layout

24. Window with no layout

25. layout_view
• :mode -> :horizontal, :vertical • options
• :spacing • :expand -> :height, :width,
[:height, :width]
• :frame -> [:top, :right, :width, :height]
• :padding
• :size -> [:width, :height]
• :left_ | :right_ | :top_ | :bottom_
• :padding
• :align -> :left | :center | :right | :top
• :left_ | :right_ | :top_ | :bottom_ | :bottom
• :margin
• :left_ | :right_ | :top_ | :bottom_
https://github.com/richkilmer/hotcocoa/blob/master/lib/hotcocoa/layout_view.rb

26. Assign layout to window view

27. Assign layout to window view

28. Filter Bar

29. Inject scrolling view with table

30. Inject scrolling view with table

31. Simple Grid

32. Are we there yet?

33. Create two columns

34. Create two columns

35. Populate both columns

36. Populate both columns

37. Simple Grid

38. Get Data from the API

39. Get Data from the API

40. Big Hideous String

41. Big Hideous String

42. Uses API (poorly)

43. Add Title Column

44. Add Title Column

45. Filter API Results

46. Filter API Results

47. Filters API Results

48. Are we there yet?

49. Thank You!
Michael “Doc” Norton
@DocOnDev
http://www.docondev.com/
doc@leandog.com