From the people who brought you ProMotion and Teacup, we bring you:

MotionKit

(insert blasting trumpets here)

TL;DR: MotionKit is a better styling and layout DSL than Teacup. Check out the README and sample code to find out why.

MotionKit is a new tool for building view hierarchies and applying styles. The goal of MotionKit is, ultimately, to replace Teacup as the "de facto" DSL for creating and styling views. This doesn't mean we're dropping support for Teacup, but Teacup has become VERY complex, and it has not become the "community project" that I had hoped it would. And, frankly, I'm kind of sick of the "hash-based" design. It's good, and idiomatic, but there's a lot of magic in there, too. And most of the complexity comes directly from that design decision.

With that in mind I asked Jamon if he would be interested in collaborating on this project. We distilled the best aspects of Teacup, ProMotion, Geomotion, RMQ, and our own take on "how things should be", and came up with something that is clean, simple, and powerful. We got some great feedback from people in the RubyMotion community, too, to make sure we were making something worthwhile.

MotionKit relies heavily on method forwarding, which makes it easy to include your own additions, and there's lots of examples of this in the source code. For example, if you want a helper to build a gradient background, you can add a gradient method to the MotionKit::UIViewLayout class, and that method will become available to UIView instances and subclasses. This allows us to have "mini-DSLs" for all sorts of things: UIKit, CoreAnimation, NSMenu & NSMenuItem (and planned support for SpriteKit and Joybox!). The built-in helpers are pretty basic, but be sure to check out the frame and AutoLayout helpers. They make building frame-based or constraints-based views an absolute JOY. :-)

I'd like to demonstrate what MotionKit code looks like. This is the LoginController and LoginLayout class from the sample app "Chatty" that is included in samples/ios/Chatty. From the LoginController we create a LoginLayout instance and ask for its view. We assign that to the controller in loadView. This is very idiomatic MotionKit code.

class LoginController < UIViewController

  def loadView
    @layout = LoginLayout.new
    self.view = @layout.view
  end

end


class LoginLayout < MK::Layout
  view :username_field
  view :submit_button

  def layout
    background_color UIColor.blackColor
    add UIView, :background do
      add UITextField, :username_field
      add UIButton, :submit_button
    end
  end

  def login_container_style
    initial do
      layer do
        corner_radius 10
      end
      background_color UIColor.whiteColor

      constraints do
        x 10
        right -10
        height 100
        bottom -10
      end
    end
  end

end

I'm not going to go into detail about everything that's going on here, but hopefully just reading the code you can see how straightforward it is. The sample code has plenty of examples (for iOS and OS X), and Chatty in particular has awesome code separation examples. It's great to be able to have animation and other view-related code in your Layout class instead of your Controller. It keeps things very clean!

Jamon and I will be discussing MotionKit more in the next MotionMeetup, so get your questions (and complaints) ready! We'll also be discussing what you can look forward to in future updates.

And lest we forget... the logo! Kudos goes to Jamon on this one:

MotionKit Logo

Jamon Holmgren, ClearSight Studios

and

Colin T.A. Gray, HipByte