FrameLayoutKit

7.0.5

A super fast and easy-to-use layout library for iOS. FrameLayoutKit supports complex layouts, including chaining and nesting layout with simple and intuitive operand syntax.
kennic/FrameLayoutKit

What's New

2023-10-09T12:43:42Z

FrameLayoutKit

Platform Language Version SwiftPM Compatible License

image

A super fast and easy-to-use layout library for iOS. FrameLayoutKit supports complex layouts, including chaining and nesting layout with simple and intuitive operand syntax.

It simplifies the UI creation process, resulting in cleaner and more maintainable code.

Why?

Say NO to autolayout constraint nightmare:

Autolayout FrameLayoutKit
No Yes!!!

Installation

FrameLayoutKit is available through Swift Package Manager (Recommended) and CocoaPods:

Regardless, make sure to import the project wherever you may use it:

import FrameLayoutKit

Cocoapods:

FrameLayoutKit can be installed as a CocoaPod. To install, include this in your Podfile.

pod "FrameLayoutKit"

Swift Package Manager

Swift Package Manager is recommended to install FrameLayoutKit.

  1. Click File
  2. Add Packages...
  3. Specify the git URL for FrameLayoutKit.
https://github.com/kennic/FrameLayoutKit.git

Example

Some examples of how FrameLayoutKit works:

Source Result
let frameLayout = HStackLayout()
frameLayout + VStackLayout {
   ($0 + earthImageView).alignment = (.top, .center)
   ($0 + 0).flexible() // add a flexible space
   ($0 + rocketImageView).alignment = (.center, .center)
}
frameLayout + VStackLayout {
   $0 + [nameLabel, dateLabel] // add an array of views
   $0 + 10 // add a space with a minimum of 10 pixels
   $0 + messageLabel // add a single view
}.spacing(5.0)

frameLayout
   .spacing(15)
   .padding(top: 15, left: 15, bottom: 15, right: 15)
   .debug(true) // show dashed lines to visualize the layout
result 1
Source Result
let frameLayout = VStackLayout {
  ($0 + imageView).flexible()
  $0 + VStackLayout {
     $0 + titleLabel
     $0 + ratingLabel
  }
}.padding(top: 12, left: 12, bottom: 12, right: 12)
 .distribution(.bottom)
 .spacing(5)
result 1
Source Result
let posterSize = CGSize(width: 100, height: 150)
let frameLayout = ZStackLayout()
frameLayout + backdropImageView
frameLayout + VStackLayout {
 $0 + HStackLayout {
  ($0 + posterImageView).fixedSize(posterSize)
    $0 + VStackLayout {
      $0 + titleLabel
      $0 + subtitleLabel
    }.padding(bottom: 5).flexible().distribution(.bottom)
  }.spacing(12).padding(top: 0, left: 12, bottom: 12, right: 12)
}.distribution(.bottom)
result 2
Source Result
let buttonSize = CGSize(width: 45, height: 45)
let cardView = VStackLayout()
  .spacing(10)
  .padding(top: 24, left: 24, bottom: 24, right: 24)

cardView + titleLabel
(cardView + emailField).minHeight = 50
(cardView + passwordField).minHeight = 50
(cardView + nextButton).fixedHeight = 45
(cardView + separateLine)
  .fixedContentHeight(1)
  .padding(top: 4, left: 0, bottom: 4, right: 40)
cardView + HStackLayout {
 ($0 + [facebookButton, googleButton, appleButton])
  .forEach { $0.fixedContentSize(buttonSize) }
}.distribution(.center).spacing(10)
result 2

Two types of code syntax:

Regular syntax Chained syntax
frameLayout.distribution = .center
frameLayout.spacing = 16
frameLayout.isFlexible = true
frameLayout
  .distribution(.center)
  .spacing(16)
  .flexible()

Benchmark

FrameLayoutKit is one of the fastest layout libraries. Benchmark Results

See: Layout libraries benchmark's project

Todo

  • Swift Package Manager
  • CocoaPods support
  • Objective-C version (Deprecated - Not recommended)
  • Swift version
  • Examples
  • Documents

Author

Nam Kennic, namkennic@me.com

License

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

Description

  • Swift Tools 5.1.0
View More Packages from this Author

Dependencies

  • None
Last updated: Sat May 25 2024 15:46:58 GMT-0900 (Hawaii-Aleutian Daylight Time)