Skip to content

Commit 384c5c1

Browse files
author
Luc Dion
committed
Add properties:
* `UIView.pin.readableMargins`: Expose UIKit `UIView.readableContentGuide`. * `UIView.pin.layoutMargins`: Expose UIKit `UIView.layoutMargins` / `UIView.layoutMarginsGuide`.
1 parent 91df3ed commit 384c5c1

10 files changed

+71
-14
lines changed

Example/PinLayoutSample/UI/Examples/TableViewReadableContent/Cells/MethodReadableInsetsCell.swift

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -42,7 +42,7 @@ class MethodReadableInsetsCell: UITableViewCell {
4242

4343
private func layout() {
4444
// 1) Layout the contentView
45-
contentView.pin.top(layoutMargins).horizontally(pin.readableMargins)
45+
contentView.pin.top(margin).horizontally(pin.readableMargins)
4646

4747
// 2) Layout contentView's childs
4848
iconImageView.pin.top().left().size(30)
@@ -61,6 +61,6 @@ class MethodReadableInsetsCell: UITableViewCell {
6161
layout()
6262

6363
// 3) Returns a size that contains all views
64-
return CGSize(width: size.width, height: contentView.frame.maxY + margin + layoutMargins.bottom)
64+
return CGSize(width: size.width, height: contentView.frame.maxY + margin)
6565
}
6666
}

Example/PinLayoutSample/UI/Menu/MenuViewController.swift

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -119,7 +119,7 @@ class MenuViewController: UIViewController {
119119

120120
override func viewDidAppear(_ animated: Bool) {
121121
super.viewDidAppear(true)
122-
didSelect(pageType: .safeArea)
122+
//didSelect(pageType: .safeArea)
123123
}
124124
}
125125

README.md

Lines changed: 52 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -38,13 +38,14 @@ Extremely Fast views layouting without auto layout. No magic, pure code, full co
3838
* Swift 3.2+ / Swift 4.1 / Objective-C
3939

4040
### Recent changes/features
41+
* :star: Add [`pin.readableMargins` and `pin.layoutMargins`](#layout_margins) properties.
4142
* :star: Add `sizeToFit()` method. See [Adjusting size](#adjusting_size).
4243
* :star: PinLayout can now layout CALayer. See [CALayer Support](#calayer_support) for more information.
4344
* :star: PinLayout is in the Top 10 of Swift Layout frameworks on [Awesome Swift](https://swift.libhunt.com/categories/714-layout)
4445
* :star: PinLayout has moved to the **[layoutBox](https://github.com/layoutBox)** organization. See other **[layoutBox](https://github.com/layoutBox)** projects.
4546
* :star: Add `wrapContent()` methods that adjust view's width and height to wrap all its subviews. See [wrapContent](#wrapContent) for more information.
4647
* :star: PinLayout now support macOS. See [macOS Support](#macos_support) for more information.
47-
* :star: PinLayout expose the `safeAreaInsets` through [`UIView.pin.safeArea`](#safeAreaInsets), this property support not only iOS 11, but is also backward compatible for earlier iOS releases (7/8/9/10). See [safeAreaInsets support](#safeAreaInsets) for more information.
48+
* :star: PinLayout expose the `safeAreaInsets` through [`pin.safeArea`](#safeAreaInsets), this property support not only iOS 11, but is also backward compatible for earlier iOS releases (7/8/9/10). See [safeAreaInsets support](#safeAreaInsets) for more information.
4849

4950

5051

@@ -185,13 +186,12 @@ As you can see in the following chart, PinLayout are faster or equal to manual l
185186
### UIKit safeAreaInsets support
186187
PinLayout can easily handle iOS 11 `UIView.safeAreaInsets`, but it goes even further by supporting safeAreaInsets for previous iOS releases (including iOS 7/8/9/10) by adding a property `UIView.pin.safeArea`. [See here for more details](#safeAreaInsets)
187188

188-
<a name="rtl_support"></a>
189-
190189
### macOS support
191190
PinLayout support macOS 10.9+.
192191

193192
:pushpin: In this documentation, any methods with parameters of type UIView or UIEdgeInsets are also supported on macOS, using NSView and NSEdgeInsets. See [macOS Support](#macos_support) for more information.
194193

194+
<a name="rtl_support"></a>
195195
### Right to left languages (RTL) support
196196
PinLayout supports left-to-right (LTR) and right-to-left (RTL) languages.
197197
#### [See here for more details](docs/rtl_support.md).
@@ -1120,7 +1120,22 @@ This example layout an UIImageView at the top and center it horizontally, it als
11201120

11211121

11221122
<a name="safeAreaInsets"></a>
1123-
## UIKit safeAreaInsets support
1123+
## UIKit safeArea, readable and layout margins
1124+
1125+
UIKit expose 3 kind of areas/guides that can be used to layout views.
1126+
PinLayout expose them using these properties:
1127+
1128+
1. **`UIView.pin.safeArea`**: Expose UIKit `UIView.safeAreaInsets` / `UIView.safeAreaLayoutGuide`.
1129+
2. **`UIView.pin.readableMargins`**: Expose UIKit `UIView.readableContentGuide`.
1130+
3. **`UIView.pin.layoutMargins`**: Expose UIKit `UIView.layoutMargins` / `UIView.layoutMarginsGuide`.
1131+
1132+
The following image display the 3 areas on an iPad in landscape mode.
1133+
1134+
<img src="docs/images/pinlayout_example_layout_margins_landscape.png" width="440" />
1135+
1136+
See the **SafeArea & readableMargins** example in the [Examples App](#examples_app).
1137+
1138+
### 1. pin.safeArea
11241139

11251140
PinLayout can handle easily iOS 11 `UIView.safeAreaInsets`, but it goes further by supporting safeAreaInsets for previous iOS releases (including iOS 7/8/9/10) by adding a property `UIView.pin.safeArea`. PinLayout also extends the support of `UIView.safeAreaInsetsDidChange()` callback on iOS 7/8/9/10.
11261141

@@ -1146,8 +1161,6 @@ The safe area of a view represent the area not covered by navigation bars, tab b
11461161
button.pin.top(view.pin.safeArea)
11471162
```
11481163

1149-
1150-
11511164
##### UIView.safeAreaInsetsDidChange():
11521165

11531166
* iOS 11 has also introduced the method [`UIView.safeAreaInsetsDidChange()`](https://developer.apple.com/documentation/uikit/uiview/2891104-safeareainsetsdidchange) which is called when the safe area of the view changes. This method is called only when your app runs on a iOS 11 device. **PinLayout's extend that and support this method also on older iOS releases including iOS 9/10**.
@@ -1194,8 +1207,6 @@ The safe area of a view represent the area not covered by navigation bars, tab b
11941207
}
11951208
```
11961209
* **disable**: In this mode PinLayout won't call `UIView.safeAreaInsetsDidChange` on iOS 8/9/10. Note that this is the default mode on iOS 8.
1197-
1198-
<br>
11991210

12001211
###### Example using `UIView.pin.safeArea`
12011212
This example layout 4 subviews inside the safeArea. The UINavigationBar and UITabBar are translucent, so even if the container UIView goes under both, we can use its `UIView.pin.safeArea` to keeps its subviews within the safeArea.
@@ -1214,6 +1225,38 @@ This example runs perfectly on a iPhone X (iOS 11), but it also runs on any devi
12141225
:pushpin: This example is available in the [Examples App](#examples_app). See example complete [source code](https://github.com/layoutBox/PinLayout/blob/master/Example/PinLayoutSample/UI/Examples/SafeArea/SafeAreaView.swift)
12151226

12161227

1228+
<br/>
1229+
1230+
<a name="readableMargins"></a>
1231+
### 2. pin.readableMargins
1232+
1233+
##### Property:
1234+
* **`pin.readableMargins: UIEdgeInset`**:
1235+
PinLayout's `UIView.pin.readableMargins` property expose UIKit [`UIView.readableContentGuide`](https://developer.apple.com/documentation/uikit/uiview/1622644-readablecontentguide) as an UIEdgeInsets. This is really useful since UIKit only expose the readableContent area to Auto Layout using UILayoutGuide.
1236+
1237+
###### Usage examples:
1238+
```swift
1239+
label.pin.horizontally(pin.readableMargins) // the label fill horizontally the readable area.
1240+
view.pin.all(container.pin.readableMargins) // the view fill its parent's readable area.
1241+
view.pin.left(pin.readableMargins)
1242+
```
1243+
1244+
:pushpin: The [Examples App](#examples_app) contains some examples using `pin.readableMargins`.
1245+
1246+
<br/>
1247+
1248+
### 3. pin.layoutmargins
1249+
1250+
##### Property:
1251+
* **`pin.layoutmargins: UIEdgeInset`**
1252+
PinLayout's `UIView.pin.layoutMargins` property expose directly the value of UIKit [`UIView.layoutMargins`](https://developer.apple.com/documentation/uikit/uiview/1622566-layoutmargins). The property exists only to be consistent with the other areas: `pin.safeArea`, `pin.readableMargins` and `pin.layoutmargins`. So its usage is not necessary.
1253+
1254+
###### Usage example:
1255+
```swift
1256+
view.pin.left(container.pin.layoutmargins)
1257+
view.pin.left(container.layoutmargins) // Similar to the previous line
1258+
```
1259+
12171260
<br/>
12181261

12191262
<a name="wrapContent"></a>
@@ -1593,7 +1636,7 @@ Included examples:
15931636
* Example using a UITableView with variable height cells.
15941637
* Example using a UICollectionView with variable height cells.
15951638
* Example showing how to animate with PinLayout.
1596-
* Example using [`UIView.pin.safeArea`](#safeAreaInsets)
1639+
* Example using [`pin.safeArea`, `pin.readableMargins` and `pin.layoutMargins`](#safeAreaInsets)
15971640
* Example using [`wrapContent()`](#wrapContent)
15981641
* Example showing right-to-left (RTL) language support.
15991642
* Example showing a simple form example

docs/examples.md

Lines changed: 16 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -43,6 +43,15 @@ Example using a UITableView with variable height cells.
4343

4444
<img src="pinlayout_exampleapp_tableview.png" width=180/>
4545

46+
47+
## UITableView Example with cells using `pin.readableMargins`
48+
Similar to the UITableView Example, but in this one cells use `pin.readableMargins` to layout their content inside the zone defined by `UIView.readableContentGuide`.
49+
50+
[Source code](https://github.com/layoutBox/PinLayout/blob/master/Example/PinLayoutSample/UI/Examples/TableViewExample/TableViewExampleView.swift)
51+
52+
<img src="images/pinlayout_example_tableview_readable_content_all.png" width=420/>
53+
54+
4655
## UICollectionView Example
4756
Example using a UICollectionView with variable height cells.
4857

@@ -66,12 +75,17 @@ This example show how PinLayout can support simultaneously Left to right and rig
6675

6776

6877
## pin.safeArea example
69-
Example showing the usage of `UIView.pin.safeArea`] with UINavigationController and UITabViewController.
78+
Example showing the usage of `UIView.pin.safeArea`] with UINavigationController and UITabViewController:
7079

7180
[Source code](https://github.com/layoutBox/PinLayout/blob/master/Example/PinLayoutSample/UI/Examples/SafeArea/SafeAreaView.swift)
7281

7382
<img src="images/pinlayout_safearea_example_iphonex.png" width=420/>
74-
<img src="images/pinlayout_safearea_2_example_iphonex.png" width=420/>
83+
84+
Also display the usage of `pin.readableMargins` and `pin.layoutMargins`:
85+
86+
[Source code](https://github.com/layoutBox/PinLayout/blob/master/Example/PinLayoutSample/UI/Examples/SafeArea/SafeAreaAndMarginsView.swift)
87+
88+
<img src="images/pinlayout_example_layout_margins_all.png" width=420/>
7589

7690

7791
## Adjust To Container Example
66 KB
Loading
52.9 KB
Loading
79.6 KB
Loading
293 KB
Loading
195 KB
Loading
248 KB
Loading

0 commit comments

Comments
 (0)