4 |
5 | ## PinLayout principles and philosophy
6 |
7 | * Manual layouting (doesn't rely on auto layout).
8 |
9 | * PinLayout exist to be simple and fast as possible! In fact, it is fast as manual layouting. See [performance results here.](https://github.com/layoutBox/PinLayout#pinlayouts-performance)
10 |
11 | * Full control: You're in the middle of the layout process, no magic black box.
12 | * You can add conditions (if/switch/guard/...) related to the device orientation, device type, traitCollection, animations, ...
13 | * You can add iterations and enumerations (for/while/forEach/...)
14 |
15 | * Layout one view at a time. Make it simple to code and debug.
16 |
17 | * Concise syntax. Layout most views using a single line.
18 |
19 | * Stateless
20 | * PinLayout doesn’t add any stored properties to UIView/NSView. It simply computes the view's frame property, one view at a time.
21 | * Since it is stateless, it can be used with any other layout framework without conflicts.
22 | Each view can use the layout system that better suit it (PinLayout, autolayout, flexbox, …)
23 |
24 | * No Auto layout and constraints
25 | * Constraints are verbose and quite hard for a human brains to understand when there are many views implicated, even with sugar-syntax frameworks.
26 | * PinLayout positions views as a designer would explain it (eg: “The TextField is below the Label, aligned left, and is its width matches the other view’s width“).
27 | * No priorities, simply layout views in the order that makes sense. No priorities required.
28 |
29 | * Before applying the new sets of attributes, PinLayout always start with the view’s current frame. So its possible to set the view’s size during the initialization (ex: view.pin.width(100).height(200)), and later only position the view (ex: view.pin.top(10).left(20)). This makes PinLayout really animation friendly.
30 |
31 | * Not too intrusive. PinLayout only adds three properties to existing iOS classes: `UIView.pin`, `UIView.anchor` and `UIView.edge`
32 | * Minimize as much as possible calculations and constants when layouting views. But it is always possible to add advanced computation if required.
33 |
34 | * Method's name match as much as possible other layout frameworks, including [FlexLayout](https://github.com/layoutBox/FlexLayout)/flexbox, CSS, React Native, …
35 |
--------------------------------------------------------------------------------
/docs/example-anchors.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/layoutBox/PinLayout/babea9c8e821dfb0687e66c123fed2006e688929/docs/example-anchors.png
--------------------------------------------------------------------------------
/docs/example-edges.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/layoutBox/PinLayout/babea9c8e821dfb0687e66c123fed2006e688929/docs/example-edges.png
--------------------------------------------------------------------------------
/docs/example-form.gif:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/layoutBox/PinLayout/babea9c8e821dfb0687e66c123fed2006e688929/docs/example-form.gif
--------------------------------------------------------------------------------
/docs/example-multiple-anchors.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/layoutBox/PinLayout/babea9c8e821dfb0687e66c123fed2006e688929/docs/example-multiple-anchors.png
--------------------------------------------------------------------------------
/docs/example-superview-anchors.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/layoutBox/PinLayout/babea9c8e821dfb0687e66c123fed2006e688929/docs/example-superview-anchors.png
--------------------------------------------------------------------------------
/docs/images/example-animations-large.gif:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/layoutBox/PinLayout/babea9c8e821dfb0687e66c123fed2006e688929/docs/images/example-animations-large.gif
--------------------------------------------------------------------------------
/docs/images/example-animations.gif:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/layoutBox/PinLayout/babea9c8e821dfb0687e66c123fed2006e688929/docs/images/example-animations.gif
--------------------------------------------------------------------------------
/docs/images/pinlayout-sizeToFit.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/layoutBox/PinLayout/babea9c8e821dfb0687e66c123fed2006e688929/docs/images/pinlayout-sizeToFit.png
--------------------------------------------------------------------------------
/docs/images/pinlayout_animation_example1.gif:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/layoutBox/PinLayout/babea9c8e821dfb0687e66c123fed2006e688929/docs/images/pinlayout_animation_example1.gif
--------------------------------------------------------------------------------
/docs/images/pinlayout_example_anchor_center.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/layoutBox/PinLayout/babea9c8e821dfb0687e66c123fed2006e688929/docs/images/pinlayout_example_anchor_center.png
--------------------------------------------------------------------------------
/docs/images/pinlayout_example_layout_margins_all.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/layoutBox/PinLayout/babea9c8e821dfb0687e66c123fed2006e688929/docs/images/pinlayout_example_layout_margins_all.png
--------------------------------------------------------------------------------
/docs/images/pinlayout_example_layout_margins_landscape.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/layoutBox/PinLayout/babea9c8e821dfb0687e66c123fed2006e688929/docs/images/pinlayout_example_layout_margins_landscape.png
--------------------------------------------------------------------------------
/docs/images/pinlayout_example_layout_margins_portrain.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/layoutBox/PinLayout/babea9c8e821dfb0687e66c123fed2006e688929/docs/images/pinlayout_example_layout_margins_portrain.png
--------------------------------------------------------------------------------
/docs/images/pinlayout_example_tableview_readable_content_all.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/layoutBox/PinLayout/babea9c8e821dfb0687e66c123fed2006e688929/docs/images/pinlayout_example_tableview_readable_content_all.png
--------------------------------------------------------------------------------
/docs/images/pinlayout_example_tableview_readable_content_landscape.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/layoutBox/PinLayout/babea9c8e821dfb0687e66c123fed2006e688929/docs/images/pinlayout_example_tableview_readable_content_landscape.png
--------------------------------------------------------------------------------
/docs/images/pinlayout_example_tableview_readable_content_portrait.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/layoutBox/PinLayout/babea9c8e821dfb0687e66c123fed2006e688929/docs/images/pinlayout_example_tableview_readable_content_portrait.png
--------------------------------------------------------------------------------
/docs/images/pinlayout_example_topRight.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/layoutBox/PinLayout/babea9c8e821dfb0687e66c123fed2006e688929/docs/images/pinlayout_example_topRight.png
--------------------------------------------------------------------------------
/docs/images/pinlayout_horizontallyBetween.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/layoutBox/PinLayout/babea9c8e821dfb0687e66c123fed2006e688929/docs/images/pinlayout_horizontallyBetween.png
--------------------------------------------------------------------------------
/docs/images/pinlayout_intro_example_iphonex.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/layoutBox/PinLayout/babea9c8e821dfb0687e66c123fed2006e688929/docs/images/pinlayout_intro_example_iphonex.png
--------------------------------------------------------------------------------
/docs/images/pinlayout_plus_flexlayout_small.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/layoutBox/PinLayout/babea9c8e821dfb0687e66c123fed2006e688929/docs/images/pinlayout_plus_flexlayout_small.png
--------------------------------------------------------------------------------
/docs/images/pinlayout_plus_layoutBox.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/layoutBox/PinLayout/babea9c8e821dfb0687e66c123fed2006e688929/docs/images/pinlayout_plus_layoutBox.png
--------------------------------------------------------------------------------
/docs/images/pinlayout_relative_transform_scale_original.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/layoutBox/PinLayout/babea9c8e821dfb0687e66c123fed2006e688929/docs/images/pinlayout_relative_transform_scale_original.png
--------------------------------------------------------------------------------
/docs/images/pinlayout_relative_transform_scale_pin.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/layoutBox/PinLayout/babea9c8e821dfb0687e66c123fed2006e688929/docs/images/pinlayout_relative_transform_scale_pin.png
--------------------------------------------------------------------------------
/docs/images/pinlayout_relative_transform_scale_pinFrame.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/layoutBox/PinLayout/babea9c8e821dfb0687e66c123fed2006e688929/docs/images/pinlayout_relative_transform_scale_pinFrame.png
--------------------------------------------------------------------------------
/docs/images/pinlayout_right_to_left_example.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/layoutBox/PinLayout/babea9c8e821dfb0687e66c123fed2006e688929/docs/images/pinlayout_right_to_left_example.png
--------------------------------------------------------------------------------
/docs/images/pinlayout_safearea_2_example_iphonex.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/layoutBox/PinLayout/babea9c8e821dfb0687e66c123fed2006e688929/docs/images/pinlayout_safearea_2_example_iphonex.png
--------------------------------------------------------------------------------
/docs/images/pinlayout_safearea_example_iphonex.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/layoutBox/PinLayout/babea9c8e821dfb0687e66c123fed2006e688929/docs/images/pinlayout_safearea_example_iphonex.png
--------------------------------------------------------------------------------
/docs/images/pinlayout_transform_orig.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/layoutBox/PinLayout/babea9c8e821dfb0687e66c123fed2006e688929/docs/images/pinlayout_transform_orig.png
--------------------------------------------------------------------------------
/docs/images/pinlayout_transform_rotate_pin.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/layoutBox/PinLayout/babea9c8e821dfb0687e66c123fed2006e688929/docs/images/pinlayout_transform_rotate_pin.png
--------------------------------------------------------------------------------
/docs/images/pinlayout_transform_rotate_pinFrame.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/layoutBox/PinLayout/babea9c8e821dfb0687e66c123fed2006e688929/docs/images/pinlayout_transform_rotate_pinFrame.png
--------------------------------------------------------------------------------
/docs/images/pinlayout_verticallyBetween.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/layoutBox/PinLayout/babea9c8e821dfb0687e66c123fed2006e688929/docs/images/pinlayout_verticallyBetween.png
--------------------------------------------------------------------------------
/docs/images/wrapContent_all.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/layoutBox/PinLayout/babea9c8e821dfb0687e66c123fed2006e688929/docs/images/wrapContent_all.png
--------------------------------------------------------------------------------
/docs/images/wrapContent_before.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/layoutBox/PinLayout/babea9c8e821dfb0687e66c123fed2006e688929/docs/images/wrapContent_before.png
--------------------------------------------------------------------------------
/docs/images/wrapContent_example.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/layoutBox/PinLayout/babea9c8e821dfb0687e66c123fed2006e688929/docs/images/wrapContent_example.png
--------------------------------------------------------------------------------
/docs/images/wrapContent_horizontally.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/layoutBox/PinLayout/babea9c8e821dfb0687e66c123fed2006e688929/docs/images/wrapContent_horizontally.png
--------------------------------------------------------------------------------
/docs/images/wrapContent_padding.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/layoutBox/PinLayout/babea9c8e821dfb0687e66c123fed2006e688929/docs/images/wrapContent_padding.png
--------------------------------------------------------------------------------
/docs/images/wrapContent_vertically.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/layoutBox/PinLayout/babea9c8e821dfb0687e66c123fed2006e688929/docs/images/wrapContent_vertically.png
--------------------------------------------------------------------------------
/docs/objective_c.md:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
PinLayout using Objective-C
6 |
7 | PinLayout can also be used from Objective-C. The PinLayout interface is slightly different from the Swift interface due to more limited Objective-C parameters definitions.
8 |
9 | ###### Example 1:
10 | This example implement the PinLayout's Intro example using objective-c
11 |
12 |
13 |
14 | ```
15 | - (void) layoutSubviews {
16 | [super layoutSubviews];
17 |
18 | CGFloat margin = 10;
19 | UIEdgeInsets safeArea = self.pinObjc.safeArea;
20 |
21 | logo.pinObjc.topInsets(safeArea).leftInsets(safeArea).width(100).aspectRatio().margin(margin).layout();
22 | segmented.pinObjc.rightOfAligned(logo, VerticalAlignTop).rightInsets(safeArea).marginHorizontal(margin).layout();
23 | textLabel.pinObjc.belowOfAligned(segmented, HorizontalAlignLeft).widthOf(segmented).pinEdges().marginTop(margin).sizeToFitType(FitWidth).layout();
24 | separatorView.pinObjc.belowOfViewsAligned(@[logo, textLabel], HorizontalAlignLeft).rightToEdge(segmented.edge.right).height(1).marginTop(margin).layout();
25 | }
26 |
27 | ```
28 |
29 | :pushpin: This example is available in the Examples App. See example complete [source code](https://github.com/layoutBox/PinLayout/blob/master/Example/PinLayoutSample/UI/Examples/IntroObjectiveC/IntroObjectiveCView.m)
30 |
31 | ## Important notes about PinLayout's Objective-c interface
32 |
33 | #### `pinObjc` property
34 | The PinLayout's objective-c interface is available using the property `pinObjc` (instead of `pin` in Swift)
35 |
36 | ```
37 | view.pinObjc.top().layout();
38 | ```
39 |
40 | #### `layout()`
41 |
42 | **Method:**
43 |
44 | * **`layout()`**
45 | When using the Objective-c interface, the `layout` method must be called explicitly to complete the view's layout. The method will execute PinLayout commands immediately. In Swift, PinLayout executes this method implicitly, it is not necessary to call it.
46 |
47 |
48 | ```
49 | // Swift
50 | view.pin.width(100)
51 |
52 | // Objective-c
53 | view.pinObjc.width(100).layout();
54 | ```
55 |
56 |
--------------------------------------------------------------------------------
/docs/pinlayout-anchors.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/layoutBox/PinLayout/babea9c8e821dfb0687e66c123fed2006e688929/docs/pinlayout-anchors.png
--------------------------------------------------------------------------------
/docs/pinlayout-edges.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/layoutBox/PinLayout/babea9c8e821dfb0687e66c123fed2006e688929/docs/pinlayout-edges.png
--------------------------------------------------------------------------------
/docs/pinlayout-example-cells.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/layoutBox/PinLayout/babea9c8e821dfb0687e66c123fed2006e688929/docs/pinlayout-example-cells.png
--------------------------------------------------------------------------------
/docs/pinlayout-example-justify-center.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/layoutBox/PinLayout/babea9c8e821dfb0687e66c123fed2006e688929/docs/pinlayout-example-justify-center.png
--------------------------------------------------------------------------------
/docs/pinlayout-example-justify-left.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/layoutBox/PinLayout/babea9c8e821dfb0687e66c123fed2006e688929/docs/pinlayout-example-justify-left.png
--------------------------------------------------------------------------------
/docs/pinlayout-example-justify-remaining-space.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/layoutBox/PinLayout/babea9c8e821dfb0687e66c123fed2006e688929/docs/pinlayout-example-justify-remaining-space.png
--------------------------------------------------------------------------------
/docs/pinlayout-example-justify-right.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/layoutBox/PinLayout/babea9c8e821dfb0687e66c123fed2006e688929/docs/pinlayout-example-justify-right.png
--------------------------------------------------------------------------------
/docs/pinlayout-example-maxWidth.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/layoutBox/PinLayout/babea9c8e821dfb0687e66c123fed2006e688929/docs/pinlayout-example-maxWidth.png
--------------------------------------------------------------------------------
/docs/pinlayout-logo-small.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/layoutBox/PinLayout/babea9c8e821dfb0687e66c123fed2006e688929/docs/pinlayout-logo-small.png
--------------------------------------------------------------------------------
/docs/pinlayout-logo-text.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/layoutBox/PinLayout/babea9c8e821dfb0687e66c123fed2006e688929/docs/pinlayout-logo-text.png
--------------------------------------------------------------------------------
/docs/pinlayout-logo.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/layoutBox/PinLayout/babea9c8e821dfb0687e66c123fed2006e688929/docs/pinlayout-logo.png
--------------------------------------------------------------------------------
/docs/pinlayout-margin-01.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/layoutBox/PinLayout/babea9c8e821dfb0687e66c123fed2006e688929/docs/pinlayout-margin-01.png
--------------------------------------------------------------------------------
/docs/pinlayout-margin-02.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/layoutBox/PinLayout/babea9c8e821dfb0687e66c123fed2006e688929/docs/pinlayout-margin-02.png
--------------------------------------------------------------------------------
/docs/pinlayout-margin-03.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/layoutBox/PinLayout/babea9c8e821dfb0687e66c123fed2006e688929/docs/pinlayout-margin-03.png
--------------------------------------------------------------------------------
/docs/pinlayout-margin-04.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/layoutBox/PinLayout/babea9c8e821dfb0687e66c123fed2006e688929/docs/pinlayout-margin-04.png
--------------------------------------------------------------------------------
/docs/pinlayout-margin-05.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/layoutBox/PinLayout/babea9c8e821dfb0687e66c123fed2006e688929/docs/pinlayout-margin-05.png
--------------------------------------------------------------------------------
/docs/pinlayout-margin-pinEdges-01.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/layoutBox/PinLayout/babea9c8e821dfb0687e66c123fed2006e688929/docs/pinlayout-margin-pinEdges-01.png
--------------------------------------------------------------------------------
/docs/pinlayout-margin-pinEdges-02.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/layoutBox/PinLayout/babea9c8e821dfb0687e66c123fed2006e688929/docs/pinlayout-margin-pinEdges-02.png
--------------------------------------------------------------------------------
/docs/pinlayout-margin-pinEdges-03.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/layoutBox/PinLayout/babea9c8e821dfb0687e66c123fed2006e688929/docs/pinlayout-margin-pinEdges-03.png
--------------------------------------------------------------------------------
/docs/pinlayout-relative-multi.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/layoutBox/PinLayout/babea9c8e821dfb0687e66c123fed2006e688929/docs/pinlayout-relative-multi.png
--------------------------------------------------------------------------------
/docs/pinlayout-relative-visible.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/layoutBox/PinLayout/babea9c8e821dfb0687e66c123fed2006e688929/docs/pinlayout-relative-visible.png
--------------------------------------------------------------------------------
/docs/pinlayout-relative-with-alignment.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/layoutBox/PinLayout/babea9c8e821dfb0687e66c123fed2006e688929/docs/pinlayout-relative-with-alignment.png
--------------------------------------------------------------------------------
/docs/pinlayout-relative.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/layoutBox/PinLayout/babea9c8e821dfb0687e66c123fed2006e688929/docs/pinlayout-relative.png
--------------------------------------------------------------------------------
/docs/pinlayout_example_adjust_to_container-landscape.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/layoutBox/PinLayout/babea9c8e821dfb0687e66c123fed2006e688929/docs/pinlayout_example_adjust_to_container-landscape.png
--------------------------------------------------------------------------------
/docs/pinlayout_example_adjust_to_container-portrait.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/layoutBox/PinLayout/babea9c8e821dfb0687e66c123fed2006e688929/docs/pinlayout_example_adjust_to_container-portrait.png
--------------------------------------------------------------------------------
/docs/pinlayout_example_adjust_to_container.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/layoutBox/PinLayout/babea9c8e821dfb0687e66c123fed2006e688929/docs/pinlayout_example_adjust_to_container.png
--------------------------------------------------------------------------------
/docs/pinlayout_example_adjust_to_container2.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/layoutBox/PinLayout/babea9c8e821dfb0687e66c123fed2006e688929/docs/pinlayout_example_adjust_to_container2.png
--------------------------------------------------------------------------------
/docs/pinlayout_example_aspectratio.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/layoutBox/PinLayout/babea9c8e821dfb0687e66c123fed2006e688929/docs/pinlayout_example_aspectratio.png
--------------------------------------------------------------------------------
/docs/pinlayout_example_form.gif:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/layoutBox/PinLayout/babea9c8e821dfb0687e66c123fed2006e688929/docs/pinlayout_example_form.gif
--------------------------------------------------------------------------------
/docs/pinlayout_example_hCenter_edge.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/layoutBox/PinLayout/babea9c8e821dfb0687e66c123fed2006e688929/docs/pinlayout_example_hCenter_edge.png
--------------------------------------------------------------------------------
/docs/pinlayout_example_wrapContent.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/layoutBox/PinLayout/babea9c8e821dfb0687e66c123fed2006e688929/docs/pinlayout_example_wrapContent.png
--------------------------------------------------------------------------------
/docs/pinlayout_exampleapp_auto_adjusting_size.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/layoutBox/PinLayout/babea9c8e821dfb0687e66c123fed2006e688929/docs/pinlayout_exampleapp_auto_adjusting_size.png
--------------------------------------------------------------------------------
/docs/pinlayout_exampleapp_automatic_sizing.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/layoutBox/PinLayout/babea9c8e821dfb0687e66c123fed2006e688929/docs/pinlayout_exampleapp_automatic_sizing.png
--------------------------------------------------------------------------------
/docs/pinlayout_exampleapp_collectionview.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/layoutBox/PinLayout/babea9c8e821dfb0687e66c123fed2006e688929/docs/pinlayout_exampleapp_collectionview.png
--------------------------------------------------------------------------------
/docs/pinlayout_exampleapp_intro.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/layoutBox/PinLayout/babea9c8e821dfb0687e66c123fed2006e688929/docs/pinlayout_exampleapp_intro.png
--------------------------------------------------------------------------------
/docs/pinlayout_exampleapp_multi_relative_position.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/layoutBox/PinLayout/babea9c8e821dfb0687e66c123fed2006e688929/docs/pinlayout_exampleapp_multi_relative_position.png
--------------------------------------------------------------------------------
/docs/pinlayout_exampleapp_relative_position.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/layoutBox/PinLayout/babea9c8e821dfb0687e66c123fed2006e688929/docs/pinlayout_exampleapp_relative_position.png
--------------------------------------------------------------------------------
/docs/pinlayout_exampleapp_tableview.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/layoutBox/PinLayout/babea9c8e821dfb0687e66c123fed2006e688929/docs/pinlayout_exampleapp_tableview.png
--------------------------------------------------------------------------------
/docs/rtl_support.md:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 | ## PinLayout Right to left languages (RTL) support
6 |
7 | Every method/properties with a name containing `left`/`right`, has RTL enabled equivalent methods with a name containing `start`/`end`.
8 |
9 | Using `start` or `end` methods, you can position views without having to think about whether your item will show up on the left or the right side of the screen (depending on the person’s language).
10 |
11 | :pushpin: In this documentation all methods that support RTL languages are marked using the following icon :left_right_arrow:
12 |
13 | **Method**:
14 |
15 | * **`Pin.layoutDirection(direction: LayoutDirection)`**:left_right_arrow::
16 | Set the PinLayout layout direction. Note that this set PinLayout's layout direction globally. By default PinLayout use the left-to-right direction.
17 |
18 | Layout direction modes:
19 | * `.ltr`: Layout views from left to right. (Default)
20 | * `.rtl`: Layout views from right to left.
21 | * `.auto`: Layout views based on `UIView.userInterfaceLayoutDirection(for: semanticContentAttribute)` (>= iOS 9) or `UIApplication.shared.userInterfaceLayoutDirection` (< iOS 9). If you want to control the layout direction individually for each views, you should use this mode and control the view's layout direction using `UIView.userInterfaceLayoutDirection` property.
22 |
23 | ###### Usage examples:
24 |
25 | ```swift
26 | override func layoutSubviews() {
27 | super.layoutSubviews()
28 |
29 | // Layout the contentView using the view's safeArea
30 | contentView.pin.all(pin.safeArea)
31 |
32 | let padding: CGFloat = 10
33 | logo.pin.top().start(padding).width(100).aspectRatio().marginTop(10)
34 | segmented.pin.after(of: logo, aligned: .top).end(padding).marginStart(10)
35 | textLabel.pin.below(of: segmented, aligned: .start).width(of: segmented).pinEdges().marginTop(10).sizeToFit(.width)
36 | separatorView.pin.below(of: [logo, textLabel], aligned: .start).end(to: segmented.edge.end).marginTop(10)
37 | }
38 | ```
39 |
40 | :pushpin: The complete RTL "Introduction example" [source code](https://github.com/layoutBox/PinLayout/blob/master/Example/PinLayoutSample/UI/Examples/IntroRTL/IntroRTLView.swift). This example is available in the [Examples App](#examples_app)
--------------------------------------------------------------------------------
/docs/xcode_playground.md:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
PinLayout and Xcode Playgrounds
6 |
7 | ## Using PinLayout with Xcode Playgrounds
8 | PinLayout layouts views immediately after the line containing `.pin` has been fully executed, thanks to ARC (Automatic Reference Counting) this works perfectly on iOS/tvOS/macOS simulators and devices. But in Xcode Playgrounds, ARC doesn't work as expected, object references are kept much longer. This is a well documented issue. The impact of this problem is that PinLayout doesn't layout views at the time and in the order required. To handle this situation in playgrounds it is possible to call the `layout()` method to complete the layout.
9 |
10 | **Method:**
11 |
12 | * **`layout()`**
13 | The method will execute PinLayout commands immediately. This method is **required only if your source codes should also work in Xcode Playgrounds**. Outside of playgrounds, PinLayout executes this method implicitly, it is not necessary to call it.
14 |
15 | ###### Usage Examples:
16 |
17 | ```swift
18 | view.pin.top(20).bottom(20).width(100).layout()
19 | view2.pin.below(of: view).horizontally().layout()
20 | ```
21 |
22 | **TIP**: If your codes needs to work in Xcode playgrounds, you may set to `true` the property `Pin.logMissingLayoutCalls`, this way any missing call to `layout()` will generate a warning in the Xcode console.
23 |
--------------------------------------------------------------------------------
/index.md:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
PinLayout
6 |
7 |
8 |
9 |
10 |
11 |
12 |
13 |
14 |
15 |
16 |
17 |
18 |
19 | Extremely Fast views layouting without auto layout. No magic, pure code, full control and blazing fast. Concise syntax, intuitive, readable & chainable.
20 |
21 | > "No auto-layout constraints attached"
22 |
23 |
24 |
25 | [See GitHub PinLayout' page for the complete documentation](https://github.com/layoutBox/PinLayout)
--------------------------------------------------------------------------------