Constrictor

Constrictor

(Boe) Constrictor’s AutoLayout µFramework with the goal of simplifying your constraints by reducing the amount of code you have to write.

Build Status codecov CocoaPods Carthage compatible apm

Installation

CocoaPods

Constrictor’s available through CocoaPods. To do so, add the following line to your PodFile:

pod 'Constrictor'

And then run the following command in terminal:

pod install

Carthage

Add this to your Cartfile:

github "pedrommcarrasco/Constrictor"

And then run the following command in terminal:

carthage update

Usage Example

After installing Constrictor, you should import the framework:

import Constrictor

Once imported you can start using Constrictor to apply constraints to your views programmatically.

Bellow, you’ll be able to see a working example. First, we start by configuring three simple UIViews (assuming we’re in a UIViewController)

let redView = UIView()
redView.backgroundColor = .red
view.addSubview(redView)

let blueView = UIView()
blueView.backgroundColor = .blue    
view.addSubview(blueView)

let greenView = UIView()
greenView.backgroundColor = .green    
redView.addSubview(greenView)

Bellow, there’s a comparison on how to apply constraints with and without Constrictor. There’s also a documentation dedicated page available here.

How you’re probably doing it without Constrictor

[redView, blueView, greenView].forEach { $0.translatesAutoresizingMaskIntoConstraints = false }

if #available(iOS 11.0, *) {
  let safeArea = view.safeAreaLayoutGuide

  NSLayoutConstraint.activate([
    blueView.centerXAnchor.constraint(equalTo: view.centerXAnchor),
    blueView.centerYAnchor.constraint(equalTo: view.centerYAnchor)
  ]) 
} else {
  let safeLayoutGuide = UILayoutGuide()
  view.addLayoutGuide(safeLayoutGuide)

  NSLayoutConstraint.activate([
    safeLayoutGuide.topAnchor.constraint(equalTo: topLayoutGuide),
    safeLayoutGuide.bottomAnchor.constraint(equalTo: bottomLayoutGuide),
    safeLayoutGuide.leadingAnchor.constraint(equalTo: view.leadingAnchor),
    safeLayoutGuide.trailingAnchor.constraint(equalTo: view.trailingAnchor),

    blueView.centerXAnchor.constraint(equalTo: safeLayoutGuide.centerXAnchor),
    blueView.centerYAnchor.constraint(equalTo: safeLayoutGuide.centerYAnchor)
  ]) 
}

NSLayoutConstraint.activate([
  redView.topAnchor.constraint(equalTo: view.topAnchor),
  redView.bottomAnchor.constraint(equalTo: view.bottomAnchor),
  redView.leadingAnchor.constraint(equalTo: view.leadingAnchor),
  redView.trailingAnchor.constraint(equalTo: view.trailingAnchor),

  blueView.widthAnchor.constraint(equalToConstant: 75.0),
  blueView.heightAnchor.constraint(equalToConstant: 75.0),

  greenView.widthAnchor.constraint(equalTo: blueView.widthAnchor),
  greenView.heightAnchor.constraint(equalTo: redView.heightAnchor),
  greenView.centerYAnchor.constraint(equalTo: blueView.centerYAnchor),
  greenView.trailingAnchor.constraint(equalTo: blueView.leadingAnchor, constant: 50.0)
])

How you can do it with Constrictor

redView.constrictEdges(to: self, withinGuides: false)

blueView.constrictSize(to: 75.0)
  .constrictCenter(in: self)

greenView.constrict(to: blueView, attributes: .width, .centerYGuide)
  .constrictToParent(attributes: .height)
  .constrict(.trailing, to: blueView, attribute: .leading, with: 50.0)

Sample Project

There’s a sample project in this repository called Example, if you want to take a look at Constrictor before using it in your projects, feel free to take a look at it and try to apply some constraints with it.