You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
@@ -142,13 +142,11 @@ This example shows how easily PinLayout can adjust its layout based on the view'
142
142
* You can add iterations and enumerations (for/while/forEach/...)
143
143
* Layout one view at a time. Make it simple to code and debug.
144
144
* Concise syntax. Layout most views using a single line.
145
-
* Support left to right (LTR) and right to left (RTL) languages.
146
145
147
146
* Stateless
148
147
* PinLayout doesn’t add any stored properties to UIViews. It simply computes the UIView.frame property, one view at a time.
149
148
* Since it is stateless, it can be used with any other layout framework without conflicts.
150
149
Each view can use the layout system that better suit it (PinLayout, constraints, flexbox, grids, …)
151
-
A view can be layouted using PinLayout and later with another method/framework.
152
150
153
151
* No Auto layout and constraints
154
152
* Constraints are verbose and hard for a human brains to understand when there are many views implicated, even with sugar-syntax frameworks.
@@ -162,11 +160,6 @@ A view can be layouted using PinLayout and later with another method/framework.
162
160
* Minimize as much as possible calculations and constants when layouting views. But it is always possible to add advanced computation if required.
163
161
164
162
* Method's name match as much as possible other layout frameworks, including [FlexLayout](https://github.com/layoutBox/FlexLayout)/flexbox, CSS, React Native, …
* As in CSS and flexbox, right and bottom coordinates are offset from container view's right and bottom edges.
168
-
169
-
* Shorter possible commands to layout views, but keeping English phrasing almost valid.
170
163
171
164
<br>
172
165
@@ -182,9 +175,7 @@ A view can be layouted using PinLayout and later with another method/framework.
182
175
183
176
PinLayout's performance has been measured using the [Layout Framework Benchmark](https://github.com/layoutBox/LayoutFrameworkBenchmark). FlexLayout and [PinLayout](https://github.com/mirego/PinLayout) has been added to this benchmark to compare their performance.
184
177
185
-
As you can see in the following chart, PinLayout and FlexLayout and performance are faster or equal to manual layouting, and **between 12x and 16x faster than auto layout**, and this for all types of iPhone (5/6/6S/7)
186
-
187
-
These results also mean that **PinLayout is by far faster than any layout frameworks built over auto layout**.
178
+
As you can see in the following chart, PinLayout are faster or equal to manual layouting, and **between 12x and 16x faster than auto layout**, and this for all types of iPhone (5/6/6S/7/8)
188
179
189
180
[See here a more complete details, results and explanation of the benchmark](docs/Benchmark.md).
190
181
@@ -230,55 +221,67 @@ PinLayout can position a view’s edge relative to its superview edges.
The value specifies the distance vertically of the view's center related to the superview's center in pixels (or in percentage of its superview's height). A positive value move the view down and a negative value move it up relative to the superview's center.
The value specifies the distance vertically of the view's center related to the superview's center in pixels (or in percentage of its superview's height). A positive value move the view down and a negative value move it up relative to the superview's center.
230
+
`vCenter()` is similar to calling `vCenter(0)`, it position vertically the view's center directly on its superview vertical center.
The value specifies the distance horizontally of the view's center related to the superview's center in pixels (or in percentage of its superview's width).
247
-
A positive value move the view to the right and a negative value move it to the left relative to the superview's center.
The value specifies the distance horizontally of the view's center related to the superview's center in pixels (or in percentage of its superview's width). A positive value move the view to the right and a negative value move it to the left relative to the superview's center.
242
+
`hCenter()` is similar to calling `hCenter(0)`, it position horizontally the view's center directly on its superview horizontal center.
The value specifies the ** top and bottom edges** on its superview's corresponding edges in pixels (or in percentage of its superview's height).
272
-
Similar to calling `view.top(value).bottom(value)`.
271
+
`vertically()` is similar to calling `vertically(0)`.
273
272
274
273
275
274
###### Usage Examples:
276
275
277
276
```swift
278
-
view.pin.top(20).bottom(20) // The view has a top margin and a bottom margin of 20 pixels
279
-
view.pin.top(25%).hCenter(0) // The view is centered horizontally
280
-
view.pin.left(12).vCenter(0) // The view is centered vertically
281
-
view.pin.start(20).end(20)
277
+
view.pin.top(20).bottom(20) // The view has a top margin and a bottom margin of 20 pixels
278
+
view.pin.top().left() // The view is pinned directly on its parent top and left edge
279
+
view.pin.top(25%).hCenter() // The view is centered horizontally with a top margin of 25%
280
+
view.pin.left(12).vCenter() // The view is centered vertically
281
+
view.pin.start(20).end(20) // Support right-to-left languages.
282
+
view.pin.all() // The view fill completely its parent (horizontally and vertically)
283
+
view.pin.horizontally(20) // The view is filling its parent width with a left and right margin.
284
+
view.pin.top().horizontally() // The view is pinned at the top edge of its parent and fill it horizontally.
282
285
```
283
286
284
287
###### Example:
@@ -295,71 +298,6 @@ Another shorter possible solution using `all()`:
295
298
view.pin.all(10)
296
299
```
297
300
298
-
299
-
<br/>
300
-
301
-
<aname="position_edges"></a>
302
-
### Position view directly on superview’s edges
303
-
304
-
PinLayout also has a shorter version that pins a view’s edge **directly** on its superview's corresponding edge.
305
-
306
-
**Methods**:
307
-
308
-
***`top()`**
309
-
Position the view top edge directly on its superview top edge. Similar to calling `top(0)`.
310
-
***`vCenter()`**
311
-
Position vertically the view's center directly on its superview vertical center. Similar to calling `vCenter(0)`.
312
-
***`bottom()`**
313
-
Position the view bottom edge directly on its superview top edge. Similar to calling `bottom(0)`.
314
-
***`left()`**
315
-
Position the view left edge directly on its superview left edge. Similar to calling `left(0)`.
316
-
***`hCenter()`**
317
-
Position horizontally the view's center directly on its superview horizontal center. Similar to calling `hCenter(0)`.
318
-
***`right()`**
319
-
Position the view right edge directly on its superview right edge. Similar to calling `right(0)`.
320
-
***`start()`**:left_right_arrow:
321
-
Position the view left edge directly on its superview left edge in LTR direction or right edge directly on its superview right edge in RTL direction. Similar to calling `start(0)`.
322
-
***`end()`**:left_right_arrow:
323
-
Position the view right edge directly on its superview right edge in LTR direction or left edge directly on its superview left edge in RTL direction. Similar to calling `end(0)`.
324
-
325
-
**Methods pinning multiple edges**:
326
-
327
-
***`all()`**
328
-
Pin **all edges** on its superview's corresponding edges (top, bottom, left, right).
329
-
Similar to calling `view.top().bottom().left().right()`.
330
-
***`horizontally()`**
331
-
Pin the **left and right edges** on its superview's corresponding edges.
332
-
Similar to calling `view.left().right()`.
333
-
***`vertically()`**
334
-
Pin the **top and bottom edges** on its superview's corresponding edges.
335
-
Similar to calling `view.top().bottom()`.
336
-
337
-
338
-
###### Usage examples:
339
-
```swift
340
-
view.pin.top().left()
341
-
view.pin.bottom().right()
342
-
view.pin.hCenter().vCenter()
343
-
view.pin.start().end()
344
-
view.pin.all()
345
-
view.pin.top().horizontally()
346
-
```
347
-
348
-
###### Example:
349
-
This example is similar to the previous example, but pins edges directly on superview’s edges. It will layout the view A to fit its superview frame with a margin of 10 pixels all around.
0 commit comments