iOS Developmentwith RubyMotion

Kieran Johnson@kieranj

https://www.invisiblelines.com

What is RubyMotion?

Why Use RubyMotion?No Xcode (unless that's what you want)

Command line toolchain ­ Rake

Less boilerplate

More succinct code

REPL for working with your app live

Native performance (compiles to bytecode)

No More Objective-C?Objective­C

NSString *list = [NSString alloc] initWithString: @"Karin, Carrie, David"];NSArray *listItems = [list componentsSeparatedByString:@", "];

[list stringByReplacingOccurrencesOfString:@", " withString:@" - "]

Ruby

list = 'Karin, Carrie, David'list_items = list.split(', ')

list.gsub!(/, /, ' - ')

RubyMotion classes, methodsand objects are Objective­Cclasses methods and objects

[].class

# => Array

[].class.ancestors

# => [Array, NSMutableArray, NSArray, Enumerable, NSObject, Kernel]

Syntax

[string drawAtPoint:point, withAttributes:attributes]

string.drawAtPoint(point, withAttributes: attributes)

string.send('drawAtPoint:withAttributes', point, attributes)

Method Overloading

def tableView(table_view, cellForRowAtIndexPath: indexPath) # ...end def tableView(tableView, heightForRowAtIndexPath: indexPath) # ...end

REPL

Common Pitfalls

There's No EscapingCocoa/CocoaTouch

No Standard Library

No Require

MetaprogrammingNo :eval or access to bindings

But :send, :method_missing, :define_method,:instance_eval, :class_eval etc are all present

Examples

AppDelegate.m

@implementation AppDelegate

- (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary{ self.window = [[UIWindow alloc] initWithFrame:[[UIScreen mainScreen] bounds]]; CGRect frame = CGRectMake(20, 50, 280, 50);

UILabel *label = [[UILabel alloc] init]; label.text = @"Hello World"; label.textColor = [UIColor whiteColor]; label.frame = frame;

[self.window makeKeyAndVisible]; [self.window addSubView label];

return YES;}

Creating an Application

$ motion create hello_world Create hello_world Create hello_world/.gitignore Create hello_world/app/app_delegate.rb Create hello_world/Gemfile Create hello_world/Rakefile Create hello_world/resources/Default-568h@2x.png Create hello_world/resources/Default-667h@2x.png Create hello_world/resources/Default-736h@3x.png Create hello_world/spec/main_spec.rb

app_delegate.rb

class AppDelegate def application(application, didFinishLaunchingWithOptions:launchOptions) @window = UIWindow.alloc.initWithFrame(UIScreen.mainScreen.bounds)

label = UILabel.new label.text = "Hello World" label.textColor = UIColor.whiteColor label.frame = [[20, 50], [280, 50]]

@window.addSubview(label)

@window.makeKeyAndVisible

true endend

Running an Application

Beyond HelloWorld

class CameraController < UIViewController def viewDidLoad view.backgroundColor = UIColor.underPageBackgroundColor

@picker = UIImagePickerController.alloc.init @picker.delegate = self @picker.sourceType = UIImagePickerControllerSourceTypeSavedPhotosAlbum

@picker.setMediaTypes([KUTTypeImage])

load_buttons end

def load_buttons btn = UIButton.buttonWithType(UIButtonTypeRoundedRect) btn.frame = [[50, 20], [200, 50]] btn.setTitle('Select an image', forState:UIControlStateNormal) btn.addTarget(self, action: :select_image, forControlEvents:UIControlEventTouchUpInside

view.addSubview(btn) end

def select_image self.presentModalViewController(@picker, animated: true) end

def imagePickerController(picker, didFinishPickingMediaWithInfo: info) dismissModalViewControllerAnimated(true)

image_view = UIImageView.alloc.initWithImage(info.valueForKey("UIImagePickerControllerOriginalImage" image_view.frame = [[50, 200], [200, 180]]

view.addSubview(image_view) endend

Bubblewrap and RMQ

class CameraController < UIViewController def viewDidLoad view.backgroundColor = UIColor.underPageBackgroundColor

load_buttons end

def load_buttons btn = UIButton.buttonWithType(UIButtonTypeRoundedRect) btn.setTitle('Select an image', forState: UIControlStateNormal)

btn = rmq.append(btn).layout(l: 50, t: 20, w: 200, h: 50) btn.on(:tap) { select_image } end

def select_image BW::Device.camera.any.picture(media_types: [:image]) do |result| image_view = UIImageView.alloc.initWithImage(result[:original_image])

rmq.append(image_view).layout(l: 50, t: 200, w: 200, h: 180) end endend

LibrariesBubblewrap

Sugarcube

TeaCup

Motionkit

RMQ

Promotion

RedPotion

Thanks!