Repository files navigation

Powerful autolayout framework, that can manage UIView(NSView), CALayer and not rendered views. Has cross-hierarchy coordinate space. Implementation performed on rect-based constraints.
Fast, asynchronous, declarative, cacheable, extensible. Supported iOS, macOS, tvOS, Linux.

Layout withCGLayout built using layout-blocks. To combine blocks into single unit useLayoutScheme entity (or other entities that has suffixScheme).

letsubviewsScheme=LayoutScheme(blocks:[// ... layout blocks])

To define block for "view" element useLayoutBlock entity, or just use convenience getter methodsfunc layoutBlock(with:constraints:).

titleLabel.layoutBlock(    with:Layout(x:.center(), y:.top(5), width:.scaled(1), height:.fixed(120)),    constraints:[        logoImageView.layoutConstraint(for:[.bottom(.limit(on:.inner))])])/// or using anchorstitleLabel.layoutBlock(    with:Layout(x:.center(), y:.top(5), width:.scaled(1), height:.fixed(120)),    constraints:{ anchorsin        anchors.top.equal(to: logoImageView.layoutAnchors.bottom)})

For understanding how need to built layout block, let's see layout process inLayoutBlock.For example we have this configuration:

LayoutBlock(    with: layoutElement,     layout:Layout(x:.left(10), y:.top(10), width:.boxed(10), height:.boxed(10)),    constraints:[        element1.layoutConstraint(for:[.bottom(.limit(on:.outer)),.right(.limit(on:.inner))]),        element2.layoutConstraint(for:[.right(.limit(on:.outer)),.bottom(.limit(on:.inner))])])

Layout anchors are limiters, that is oriented on frame properties (such as sides, size, position).
Any side-based anchors have three base implementations: alignment, limitation(cropping), pulling. Each this implementation have dependency on working space: inner and outer.
Size-based anchors are represented by two implementations: size, insets.
All layout anchors you can find inenum LayoutAnchor.

To create associated layout constraints useprotocol LayoutConstraintProtocol.
Framework provides such default implementations:

• LayoutConstraint: simple associated constraint that usesvar frame of passed element to constrain source rect. Use him to build dependency on external workspace.
• AdjustLayoutConstraint: associated constraint to adjust size of source space. Only elements conform toprotocol AdjustableLayoutElement can use it.
• ContentLayoutConstraint: associated constraint that uses internal bounds to constrain, defined in 'layoutBounds' property ofprotocol LayoutElement. Use it if you need to create dependency on internal workspace. For example, element insideUIScrollView.
• AnonymConstraint: constraint to restrict source space independently from external environment.
• MutableLayoutConstraint: Layout constraint that creates possibility to change active state.
  You can find all this constraints through convenience functions in related elements. Use him to build layout blocks.

In common case, adjust constraints should be apply after any other constraints (but not always).

weatherLabel.layoutBlock(    with:Layout(x:.left(10), y:.top(), width:.scaled(1), height:.scaled(1)),    constraints:[        weatherImageView.layoutConstraint(for:[.top(.limit(.inner)),.right(.limit(.outer)),.height()]),        weatherLabel.adjustLayoutConstraint(for:[.width()])])

AnonymConstraint(anchors:[Inset(UIEdgeInsets(top:0, left:10, bottom:0, right:15))])

For implementing custom layout entities and save strong typed code, usestatic func build(_ base: Conformed) -> Self method.

Each layout-block has methods for layout, take snapshot and applying snapshot.Consequently you may use layout-blocks for direct layout, background layout and cached layout:

// layout directlylayoutScheme.layout()// layout in backgroundletbounds= view.boundsDispatchQueue.global(qos:.background).async{letsnapshot=self.layoutScheme.snapshot(for: bounds)DispatchQueue.main.sync{self.layoutScheme.apply(snapshot: snapshot)}}// cached layoutifUIDevice.current.orientation.isPortrait,let snapshot= portraitSnapshot{    layoutScheme.apply(snapshot: snapshot)}elseifUIDevice.current.orientation.isLandscape,let snapshot= landscapeSnapshot{    layoutScheme.apply(snapshot: snapshot)}else{    layoutScheme.layout()}

Typical implementationsizeThatFits(_:) method

func sizeThatFits(_ size:CGSize)->CGSize{letsourceRect=CGRect(origin:.zero, size: size)letsnapshot= scheme.snapshot(for: sourceRect)return snapshot.frame}

Framework providesLayoutGuide as analogueUILayoutGuide. It has possible to generate views and add them to hierarchy.
LayoutGuide can used as invisible limiter and also as layout container.
Default layout containers:

• StackLayoutGuide - simple implementation of stack.
• ScrollLayoutGuide - has similar interface withUIScrollView. By use him we can enable scrolling absolutely everywhere.
• LayoutPlaceholder - single element container that can load view lazily. Has default implementations forCALayer -LayerPlaceholder andUIView -ViewPlaceholder.
• UIViewPlaceholder - single element container based onUILayoutGuide.

UILayouGuide also adoptsLayoutElement protocol. Therefore you can safely build constraints based onUIView.safeAreaLayoutGuide and others.

To enable Righ-to-Left mode use global configuration:

CGLConfiguration.default.isRTLMode=true

For more details, see documentation and example project.

Seehere

To run the example project, clone the repo, and runpod install from the Example directory first.

To run the example project, clone the repo, and runswift run from thelinux_example directory first.

Swift 5

CGLayout is available throughCocoaPods. To installit, simply add the following line to your Podfile:

pod"CGLayout"

I will be happy your feedback, advices and pull requests. For more information readhere

Denis KoryttsevEmail:koden.u8800@gmail.comTwitter:https://twitter.com/K_o_D_e_N

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