README.md in motion-kit-0.10.11 vs README.md in motion-kit-0.11.0
- old
+ new
@@ -18,11 +18,11 @@
5. Non-polluting
6. ProMotion/RMQ/SugarCube-compatible (kind of goes hand-in-hand with being non-polluting)
7. Styles and layouts are "just code" (not hash-based like in Teacup)
8. Written by [the authors][authors] of [ProMotion][] and [Teacup][]
-[authors]: CONTRIBUTORS.md
+[authors]: CONTRIBUTORS.yaml
[Colin]: https://github.com/colinta
[Jamon]: https://github.com/jamonholmgren
[ProMotion]: https://github.com/clearsightstudio/ProMotion
[RMQ]: https://github.com/infinitered/rmq
[Teacup]: https://github.com/rubymotion/teacup
@@ -113,10 +113,12 @@
end
def button_style
# this will call 'setTitle(forState:)' via a UIButton helper
title 'Press it!'
+ size_to_fit
+
# this shorthand is much better! More about frame helpers below.
center ['50%', '50% + 50']
end
end
@@ -265,10 +267,36 @@
end
```
+### Using child-layouts
+
+If you have a very complicated layout that you want to break up into child
+layouts, that is supported as well:
+
+```ruby
+class ParentLayout < MK::Layout
+
+ def layout
+ add ChildLayout, :child_id
+ end
+
+end
+```
+
+The id is (as always) optional, but allows you to fetch the layout using
+`get(id)`.
+
+```ruby
+layout.get(:child_id) # => ChildLayout
+```
+
+Calling `get(:child_id).view` will return the *view* associated with that
+layout.
+
+
### Setting a custom root view
If you need to use a custom root view, you can use the `root` method from within
the `layout` method. When you create or assign the root view this way, you must
assign subviews and styles *inside* a block that you pass to `root`.
@@ -591,24 +619,34 @@
x.is == 15
# setting the priority:
(x.is >= 10).priority(:required)
(x.is == 15).priority(:low)
+ # setting the identifier
+ x.equals(15).identifier('foo')
end
```
But of course with AutoLayout you set up *relationships* between views. Using
the element-id as a placeholder for a view works especially well here.
```ruby
constraints do
- top_left.equals x: 5, y:5
+ top_left.equals x: 5, y: 5 # this sets the origin relative to the superview
+ top_left.equals(:superview).plus([5, 5]) # this will do the same thing!
+
width.equals(:foo).minus(10) # searches for a view named :foo
height.equals(:foo).minus(10)
# that's repetitive, so just set 'size'
size.equals(:foo).minus(10)
size.equals(:foo).minus([10, 15]) # 10pt thinner, 15pt shorter
+
+ # if you are using a view that has a sensible intrinsic size, like an image,
+ # you can use :scale to have the width or height adjusted according to the
+ # other size
+ width.equals(:superview)
+ height(:scale) # scale the height according to the width
end
```
Just like with frame helpers you can use the `:element_id` to refer to another
view, but get this: the view need not be created yet! This is because when you
@@ -696,9 +734,61 @@
@layout.add_constraints(self)
super
end
end
+```
+
+#### Animating and Changing constraints
+
+It might feel natural to treat constraints as "frame setters", but they are
+persistent objects that are attached to your views. This means if you create
+new constraints, like during a screen rotation, your old constraints don't “go
+away”. For example:
+
+```ruby
+def label_style
+ portrait do
+ left 10
+ end
+
+ landscape do
+ left 15 # adds *another* constraint on the left attribute - in addition to the `left 10` constraint!
+ end
+end
+```
+
+Instead, you should retain the constraint and make changes to it directly:
+
+```ruby
+ initial do
+ constraints do
+ @label_left_constraint = left 10
+ end
+ end
+
+ reapply do
+ portrait do
+ @label_left_constraint.equals 10
+ end
+
+ landscape do
+ @label_left_constraint.equals 15
+ end
+ end
+```
+
+If you want to animate a constraint change, you can use `layoutIfNeeded` from
+within a UIView animation block. The sample app "Chatty" does this to move a
+text field when the keyboard is displayed. `kbd_height` is the height of the
+keyboard.
+
+```ruby
+@container_bottom.minus kbd_height # set @container_bottom.constant = 0 when the keyboard disappears
+
+UIView.animateWithDuration(duration, delay: 0, options: curve, animations: -> do
+ self.view.layoutIfNeeded # applies the constraint change
+end, completion: nil)
```
### MotionKit::Events
gem install motion-kit-events