Skip to content

Commit

Permalink
Percent padding support. Solves layoutBox#186
Browse files Browse the repository at this point in the history
  • Loading branch information
@albertocsouto
albertocsouto committed Nov 22, 2021
1 parent 0125967 commit 94c8458
Show file tree
Hide file tree
Showing 2 changed files with 99 additions and 14 deletions.
83 changes: 83 additions & 0 deletions FlexLayoutTests/PaddingSpec.swift
View file
Original file line number Diff line number Diff line change
Expand Up @@ -12,6 +12,7 @@

import Quick
import Nimble
import FlexLayout

class PaddingSpec: QuickSpec {
override func spec() {
Expand Down Expand Up @@ -41,6 +42,15 @@ class PaddingSpec: QuickSpec {
rootFlexContainer.flex.layout()
expect(aView.frame).to(equal(CGRect(x: 0.0, y: 10.0, width: 400.0, height: 390.0)))
}

it("adjust the aView size and position") {
rootFlexContainer.flex.paddingTop(10%).define { (flex) in
flex.addItem(aView).grow(1)
}

rootFlexContainer.flex.layout()
expect(aView.frame).to(equal(CGRect(x: 0.0, y: 40.0, width: 400.0, height: 360.0)))
}

it("adjust the aView size and position") {
rootFlexContainer.flex.paddingLeft(10).define { (flex) in
Expand All @@ -49,6 +59,14 @@ class PaddingSpec: QuickSpec {
rootFlexContainer.flex.layout()
expect(aView.frame).to(equal(CGRect(x: 10.0, y: 0.0, width: 390.0, height: 400.0)))
}

it("adjust the aView size and position") {
rootFlexContainer.flex.paddingLeft(10%).define { (flex) in
flex.addItem(aView).grow(1)
}
rootFlexContainer.flex.layout()
expect(aView.frame).to(equal(CGRect(x: 40.0, y: 0.0, width: 360.0, height: 400.0)))
}

it("adjust the aView size and position") {
rootFlexContainer.flex.paddingBottom(10).define { (flex) in
Expand All @@ -57,6 +75,14 @@ class PaddingSpec: QuickSpec {
rootFlexContainer.flex.layout()
expect(aView.frame).to(equal(CGRect(x: 0.0, y: 0.0, width: 400.0, height: 390.0)))
}

it("adjust the aView size and position") {
rootFlexContainer.flex.paddingBottom(10%).define { (flex) in
flex.addItem(aView).grow(1)
}
rootFlexContainer.flex.layout()
expect(aView.frame).to(equal(CGRect(x: 0.0, y: 0.0, width: 400.0, height: 360.0)))
}

it("adjust the aView size and position") {
rootFlexContainer.flex.paddingRight(10).define { (flex) in
Expand All @@ -65,6 +91,14 @@ class PaddingSpec: QuickSpec {
rootFlexContainer.flex.layout()
expect(aView.frame).to(equal(CGRect(x: 0.0, y: 0.0, width: 390.0, height: 400.0)))
}

it("adjust the aView size and position") {
rootFlexContainer.flex.paddingRight(10%).define { (flex) in
flex.addItem(aView).grow(1)
}
rootFlexContainer.flex.layout()
expect(aView.frame).to(equal(CGRect(x: 0.0, y: 0.0, width: 360.0, height: 400.0)))
}

it("adjust the aView size and position") {
rootFlexContainer.flex.padding(10).define { (flex) in
Expand All @@ -73,6 +107,14 @@ class PaddingSpec: QuickSpec {
rootFlexContainer.flex.layout()
expect(aView.frame).to(equal(CGRect(x: 10.0, y: 10.0, width: 380.0, height: 380.0)))
}

it("adjust the aView size and position") {
rootFlexContainer.flex.padding(10%).define { (flex) in
flex.addItem(aView).grow(1)
}
rootFlexContainer.flex.layout()
expect(aView.frame).to(equal(CGRect(x: 40.0, y: 40.0, width: 320.0, height: 320.0)))
}

it("adjust the aView size and position") {
rootFlexContainer.flex.padding(10, 20, 30, 40).define { (flex) in
Expand All @@ -81,6 +123,14 @@ class PaddingSpec: QuickSpec {
rootFlexContainer.flex.layout()
expect(aView.frame).to(equal(CGRect(x: 20.0, y: 10.0, width: 340.0, height: 360.0)))
}

it("adjust the aView size and position") {
rootFlexContainer.flex.padding(10%, 20%, 30%, 40%).define { (flex) in
flex.addItem(aView).grow(1)
}
rootFlexContainer.flex.layout()
expect(aView.frame).to(equal(CGRect(x: 80.0, y: 40.0, width: 160.0, height: 240.0)))
}

it("adjust the aView size and position") {
rootFlexContainer.flex.paddingStart(10).define { (flex) in
Expand All @@ -89,6 +139,14 @@ class PaddingSpec: QuickSpec {
rootFlexContainer.flex.layout()
expect(aView.frame).to(equal(CGRect(x: 10.0, y: 0.0, width: 390.0, height: 400.0)))
}

it("adjust the aView size and position") {
rootFlexContainer.flex.paddingStart(10%).define { (flex) in
flex.addItem(aView).grow(1)
}
rootFlexContainer.flex.layout()
expect(aView.frame).to(equal(CGRect(x: 40.0, y: 0.0, width: 360.0, height: 400.0)))
}

it("adjust the aView size and position") {
rootFlexContainer.flex.paddingEnd(10).define { (flex) in
Expand All @@ -97,6 +155,14 @@ class PaddingSpec: QuickSpec {
rootFlexContainer.flex.layout()
expect(aView.frame).to(equal(CGRect(x: 0.0, y: 0.0, width: 390.0, height: 400.0)))
}

it("adjust the aView size and position") {
rootFlexContainer.flex.paddingEnd(10%).define { (flex) in
flex.addItem(aView).grow(1)
}
rootFlexContainer.flex.layout()
expect(aView.frame).to(equal(CGRect(x: 0.0, y: 0.0, width: 360.0, height: 400.0)))
}

it("adjust the aView size and position") {
rootFlexContainer.flex.paddingVertical(10).define { (flex) in
Expand All @@ -105,6 +171,14 @@ class PaddingSpec: QuickSpec {
rootFlexContainer.flex.layout()
expect(aView.frame).to(equal(CGRect(x: 0.0, y: 10.0, width: 400.0, height: 380.0)))
}

it("adjust the aView size and position") {
rootFlexContainer.flex.paddingVertical(10%).define { (flex) in
flex.addItem(aView).grow(1)
}
rootFlexContainer.flex.layout()
expect(aView.frame).to(equal(CGRect(x: 0.0, y: 40.0, width: 400.0, height: 320.0)))
}

it("adjust the aView size and position") {
rootFlexContainer.flex.paddingHorizontal(10).define { (flex) in
Expand All @@ -113,6 +187,15 @@ class PaddingSpec: QuickSpec {
rootFlexContainer.flex.layout()
expect(aView.frame).to(equal(CGRect(x: 10.0, y: 0.0, width: 380.0, height: 400.0)))
}

it("adjust the aView size and position") {
rootFlexContainer.flex.paddingHorizontal(10%).define { (flex) in
flex.addItem(aView).grow(1)
}
rootFlexContainer.flex.layout()
expect(aView.frame).to(equal(CGRect(x: 40.0, y: 0.0, width: 320.0, height: 400.0)))
}

}
}
}
30 changes: 16 additions & 14 deletions README.md
View file
Original file line number Diff line number Diff line change
Expand Up @@ -959,27 +959,29 @@ Padding specify the **offset children should have** from a certain edge on the c

**Methods:**

* `paddingTop(_ value: CGFloat)`
* `paddingLeft(_ value: CGFloat)`
* `paddingBottom(_ value: CGFloat)`
* `paddingRight(_ value: CGFloat)`
* `paddingStart(_ value: CGFloat)`
* `paddingEnd(_ value: CGFloat)`
* `paddingHorizontal(_ value: CGFloat)`
* `paddingVertical(_ value: CGFloat)`
* `padding(_ insets: UIEdgeInsets)`
* **`paddingTop(_ value: CGFloat)`, `paddingTop(_ percent: FPercent)`**
* **`paddingLeft(_ value: CGFloat)`, `paddingLeft(_ percent: FPercent)`**
* **`paddingBottom(_ value: CGFloat)`, `paddingBottom(_ percent: FPercent)`**
* **`paddingRight(_ value: CGFloat)`, `paddingRight(_ percent: FPercent)`**
* **`paddingStart(_ value: CGFloat)`, `paddingStart(_ percent: FPercent)`**
* **`paddingEnd(_ value: CGFloat)`, `paddingEnd(_ percent: FPercent)`**
* **`paddingHorizontal(_ value: CGFloat)`, `paddingHorizontal(_ percent: FPercent)`**
* **`paddingVertical(_ value: CGFloat)`, `paddingVertical(_ percent: FPercent)`**
* **`padding(_ insets: UIEdgeInsets)`**
Set all paddings using an UIEdgeInsets. This method is particularly useful to set all paddings using iOS 11 `UIView.safeAreaInsets`.
* `padding(_ insets: NSDirectionalEdgeInsets)`
* **`padding(_ insets: NSDirectionalEdgeInsets)`**
Set all paddings using an NSDirectionalEdgeInsets. This method is particularly useful to set all padding using iOS 11 `UIView. directionalLayoutMargins` when layouting a view supporting RTL/LTR languages.
* `padding(_ value: CGFloat) `
* `padding(_ vertical: CGFloat, _ horizontal: CGFloat)`
* `padding(_ top: CGFloat, _ horizontal: CGFloat, _ bottom: CGFloat)`
* `padding(_ top: CGFloat, _ left: CGFloat, _ bottom: CGFloat, _ right: CGFloat) `
* **`padding(_ value: CGFloat)`, `padding(_ percent: FPercent)`**
* **`padding(_ vertical: CGFloat, _ horizontal: CGFloat)`, `padding(_ vertical: FPercent, horizontal: FPercent`**
* **`padding(_ top: CGFloat, _ horizontal: CGFloat, _ bottom: CGFloat)`, `padding(_ top: FPercent, _ horizontal: FPercent, _ bottom: FPercent)`**
* **`padding(_ top: CGFloat, _ left: FPercent, _ bottom: FPercent, _ right: FPercent)`, `padding(_ top: FPercent, _ left: FPercent, _ bottom: FPercent, _ right: FPercent)`**



###### Usage examples:
```swift
view.flex.padding(20)
view.flex.paddingTop(20%).paddingLeft(20%)
view.flex.paddingBottom(20)
view.flex.paddingHorizontal(20)
view.flex.padding(10, 12, 0, 12)
Expand Down

0 comments on commit 94c8458

Please sign in to comment.