Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/kean/Arranged
Open source replacement of UIStackView for iOS 8 (100% layouts supported)
https://github.com/kean/Arranged
constraints layout uistackview
Last synced: 1 day ago
JSON representation
Open source replacement of UIStackView for iOS 8 (100% layouts supported)
- Host: GitHub
- URL: https://github.com/kean/Arranged
- Owner: kean
- License: mit
- Archived: true
- Created: 2016-03-01T17:20:45.000Z (over 8 years ago)
- Default Branch: master
- Last Pushed: 2019-11-16T18:11:50.000Z (almost 5 years ago)
- Last Synced: 2024-10-09T04:47:24.959Z (about 1 month ago)
- Topics: constraints, layout, uistackview
- Language: Swift
- Homepage:
- Size: 146 KB
- Stars: 209
- Watchers: 8
- Forks: 16
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- Changelog: CHANGELOG.md
- License: LICENSE
Awesome Lists containing this project
README
# Arranged.StackView
)
Open source replacement of [UIStackView](https://developer.apple.com/library/prerelease/ios/documentation/UIKit/Reference/UIStackView_Class_Reference/) for iOS 8 (100% layouts supported)
> **Deprecated**. UIStackView was introduces in iOS 9, please use the native one.
- Supports all `alignments` and `distributions`, `spacing`, `baselineRelativeArrangement`, `layoutMarginsRelativeArrangement`, `axis`
- Unit tested, thousands of layouts covered
- Supports animations
- Generates exactly the same sets of constraints as `UIStackView`:
**UIStackView** (`Alignment.Leading`, `Distribution.FillEqually`)
```
<'UISV-alignment' content-view-1.top == content-view-2.top>
<'UISV-canvas-connection' UIStackView:0x7f9cf4816930.leading == content-view-1.leading>
<'UISV-canvas-connection' H:[content-view-2]-(0)-|>
<'UISV-canvas-connection' UIStackView:0x7f9cf4816930.top == content-view-1.top>
<'UISV-canvas-connection' V:[_UILayoutSpacer:0x7f9cf4849f80'UISV-alignment-spanner']-(0)-|>
<'UISV-fill-equally' content-view-2.width == content-view-1.width>
<'UISV-spacing' H:[content-view-1]-(10)-[content-view-2]>
<'UISV-spanning-boundary' _UILayoutSpacer:0x7f9cf4849f80'UISV-alignment-spanner'.top == content-view-1.top priority:999.5>
<'UISV-spanning-boundary' _UILayoutSpacer:0x7f9cf4849f80'UISV-alignment-spanner'.bottom >= content-view-1.bottom>
<'UISV-spanning-boundary' _UILayoutSpacer:0x7f9cf4849f80'UISV-alignment-spanner'.top == content-view-2.top priority:999.5>
<'UISV-spanning-boundary' _UILayoutSpacer:0x7f9cf4849f80'UISV-alignment-spanner'.bottom >= content-view-2.bottom>
<'UISV-spanning-fit' V:[_UILayoutSpacer:0x7f9cf4849f80'UISV-alignment-spanner'(0@51)] priority:51>
<'UISV-ambiguity-suppression' V:[content-view-1(0@25)] priority:25>
<'UISV-ambiguity-suppression' V:[content-view-2(0@25)] priority:25>
```
**Arranged** (`Alignment.Leading`, `Distribution.FillEqually`)
```
<'ASV-alignment' content-view-1.top == content-view-2.top>
<'ASV-canvas-connection' Arranged.StackView:0x7f9cf4822c90.leading == content-view-1.leading>
<'ASV-canvas-connection' H:[content-view-2]-(0)-|>
<'ASV-canvas-connection' Arranged.StackView:0x7f9cf4822c90.top == content-view-1.top>
<'ASV-canvas-connection' V:[Arranged.LayoutSpacer:0x7f9cf2c4f3f0]-(0)-|>
<'ASV-fill-equally' content-view-1.width == content-view-2.width>
<'ASV-spacing' H:[content-view-1]-(10)-[content-view-2]>
<'ASV-spanning-boundary' Arranged.LayoutSpacer:0x7f9cf2c4f3f0.top == content-view-1.top priority:999.5>
<'ASV-spanning-boundary' Arranged.LayoutSpacer:0x7f9cf2c4f3f0.bottom >= content-view-1.bottom>
<'ASV-spanning-boundary' Arranged.LayoutSpacer:0x7f9cf2c4f3f0.top == content-view-2.top priority:999.5>
<'ASV-spanning-boundary' Arranged.LayoutSpacer:0x7f9cf2c4f3f0.bottom >= content-view-2.bottom>
<'ASV-spanning-fit' V:[Arranged.LayoutSpacer:0x7f9cf2c4f3f0(0@51)] priority:51>
<'ASV-ambiguity-suppression' V:[content-view-1(0@25)] priority:25>
<'ASV-ambiguity-suppression' V:[content-view-2(0@25)] priority:25>
```
## Usage
`Arranged.StackView` is used the same way `UIStackView` is:
```swift
let stackView = StackView(arrangedSubviews: [view1, view2, view3])
stackView.alignment = .leading
stackView.distribution = .fillEqually
stackView.spacing = 20
stackView.axis = .vertical
stackView.isLayoutMarginsRelativeArrangement = true
```
The only difference is hiding items:
```swift
UIView.animateWithDuration(0.33) {
stackView.setArrangedView(view, hidden: true)
stackView.layoutIfNeeded()
}
```
## Requirements
- iOS 8.0, tvOS 9.0
- Xcode 9
- Swift 4
## Getting Started
- Get a demo project using `pod try Arranged` command
- [Install](#installation), `import Arranged` and enjoy!
## Differences
- `UIStackView` observes `hidden` property of arranged views, delays its effect if called inside animation block, and updates constraints accordingly. I believe this behavior is confusing and impractical to implement. `Arranged.StackView` provides a straightforward method `setArrangedView(_:hidden:)` which updates constraints exactly the same way as `UIStackView` does, but it doesn't affect `hidden` property.
- Animations require you to call `view.layoutIfNeeded()` - just like with any regular layout
- `StackViewDistribution.FillProportionally` doesn't update its constrains when `intrinsicContentSize` of arranged views changes due to the fact that `UIStackView` uses private API (`_intrinsicContentSizeInvalidatedForChildView`) to achieve that
- `UISV-text-width-disambiguation` constraints are not implemented because they are not documented (and you probably should disambiguate text views the way that fits your app anyway)
### [CocoaPods](http://cocoapods.org)
To install Arranged add a dependency to your Podfile:
```ruby
# source 'https://github.com/CocoaPods/Specs.git'
# use_frameworks!
# platform :ios, "8.0"
pod "Arranged"
```
### [Carthage](https://github.com/Carthage/Carthage)
To install Arranged add a dependency to your Cartfile:
```
github "kean/Arranged"
```
### Import
Import installed modules in your source files
```swift
import Arranged
```
## License
Arranged is available under the MIT license. See the LICENSE file for more info.