All Projects → kean → Arranged

kean / Arranged

Licence: mit
Open source replacement of UIStackView for iOS 8 (100% layouts supported)

Programming Languages

swift
15916 projects

Projects that are alternatives of or similar to Arranged

wwlayout
Swifty DSL for programmatic Auto Layout in iOS
Stars: ✭ 46 (-77.23%)
Mutual labels:  layout, constraints
Snapkit
A Swift Autolayout DSL for iOS & OS X
Stars: ✭ 18,091 (+8855.94%)
Mutual labels:  layout, constraints
EZAnchor
An easier and faster way to code Autolayout
Stars: ✭ 25 (-87.62%)
Mutual labels:  layout, constraints
SuperPuperDuperLayout
Super puper duper mega easy awesome wrapper over auto layout!!111!!1!!!1!!!11111!!!1!!
Stars: ✭ 14 (-93.07%)
Mutual labels:  layout, constraints
Uicollectionview Layouts Kit
📐 A set of custom layouts for UICollectionView with examples [Swift 5.3, iOS 12].
Stars: ✭ 410 (+102.97%)
Mutual labels:  layout, constraints
Easypeasy
Auto Layout made easy
Stars: ✭ 1,877 (+829.21%)
Mutual labels:  layout, constraints
Stevia
🍃 Concise Autolayout code
Stars: ✭ 3,182 (+1475.25%)
Mutual labels:  layout, constraints
VanillaConstraints
🍦 Simplified and chainable AutoLayout constraints for iOS.
Stars: ✭ 42 (-79.21%)
Mutual labels:  layout, constraints
Nerdyui
An easy way to create and layout UI components for iOS.
Stars: ✭ 381 (+88.61%)
Mutual labels:  layout, constraints
Tinyconstraints
Nothing but sugar.
Stars: ✭ 3,721 (+1742.08%)
Mutual labels:  layout, constraints
Core Layout
Flexbox & CSS-style Layout in Swift.
Stars: ✭ 215 (+6.44%)
Mutual labels:  layout, constraints
Kvconstraintkit
An Impressive Auto Layout DSL for iOS, tvOS & OSX. & It is written in pure swift.
Stars: ✭ 91 (-54.95%)
Mutual labels:  layout, constraints
Cupcake
An easy way to create and layout UI components for iOS (Swift version).
Stars: ✭ 273 (+35.15%)
Mutual labels:  layout, constraints
Easyswiftlayout
Lightweight Swift framework for Apple's Auto-Layout
Stars: ✭ 345 (+70.79%)
Mutual labels:  layout, constraints
Mylinearlayout
MyLayout is a powerful iOS UI framework implemented by Objective-C. It integrates the functions with Android Layout,iOS AutoLayout,SizeClass, HTML CSS float and flexbox and bootstrap. So you can use LinearLayout,RelativeLayout,FrameLayout,TableLayout,FlowLayout,FloatLayout,PathLayout,GridLayout,LayoutSizeClass to build your App 自动布局 UIView UITab…
Stars: ✭ 4,152 (+1955.45%)
Mutual labels:  layout, constraints
Snapkitextend
SnapKit的扩展,SnapKit类似于Masonry,但是其没有对Arry的设置和对等间距排列的布局等,此扩展是类似Masonry的写法对SnapKit的补充,同时补充九宫格布局方式
Stars: ✭ 110 (-45.54%)
Mutual labels:  layout, constraints
Flagception Bundle
Feature flags on steroids!
Stars: ✭ 162 (-19.8%)
Mutual labels:  constraints
Joiful
TypeScript Declarative Validation for Joi
Stars: ✭ 177 (-12.38%)
Mutual labels:  constraints
Expansionpanel
Android - Expansion panels contain creation flows and allow lightweight editing of an element.
Stars: ✭ 1,984 (+882.18%)
Mutual labels:  layout
Iota
A responsive micro-framework for the grid spec powered by CSS custom properties.
Stars: ✭ 189 (-6.44%)
Mutual labels:  layout

Arranged.StackView

Open source replacement of UIStackView 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'([email protected])] priority:51>
<'UISV-ambiguity-suppression' V:[content-view-1([email protected])] priority:25>
<'UISV-ambiguity-suppression' V:[content-view-2([email protected])] 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([email protected])] priority:51>
<'ASV-ambiguity-suppression' V:[content-view-1([email protected])] priority:25>
<'ASV-ambiguity-suppression' V:[content-view-2([email protected])] priority:25>

Usage

Arranged.StackView is used the same way UIStackView is:

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:

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, 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)

Installation

CocoaPods

To install Arranged add a dependency to your Podfile:

# source 'https://github.com/CocoaPods/Specs.git'
# use_frameworks!
# platform :ios, "8.0"

pod "Arranged"

Carthage

To install Arranged add a dependency to your Cartfile:

github "kean/Arranged"

Import

Import installed modules in your source files

import Arranged

License

Arranged is available under the MIT license. See the LICENSE file for more info.

Note that the project description data, including the texts, logos, images, and/or trademarks, for each open source project belongs to its rightful owner. If you wish to add or remove any projects, please contact us at [email protected].