Declarative iOS UI sugar framework built on FlexLayout

Related tags

Layout ios flex layout flexbox
Overview

KarrotFlex

CI Status Version License Platform

Declarative UI sugar framework built on FlexLayout
👨‍🔧 Beware, Under construction 🧑‍🔧

Example

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

self.someView.flex.define { flex in
  FlexRow(flex) { row in
    FlexSpacer(row, width: 24.0)
    FlexColumn(row) { col in
      FlexItem(col, view: self.titleLabel)
      FlexSpacer(col, height: 8.0)
      FlexItem(col, view: self.descLabel)
      FlexSpacer(col, height: 24.0)
      FlexItem(col, view: self.infoLabel)
    }
  }
  .padding(16.0)
}

Requirements

Installation

CocoaPods

pod 'KarrotFlex'

Swift Package Manager

In your Package.swift:

let package = Package(
  name: "Example",
  dependencies: [
    .package(url: "https://github.com/daangn/KarrotFlex.git", from: "0.0.1")
  ],
  targets: [
    .target(name: "Example", dependencies: ["KarrotFlex"])
  ]
)

Author

License

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

Comments
  • add flex center

    add flex center 

    FlexCenter(overlay, option: .XY) { center in
  FlexItem(center, view: self.indexLabel)
}

    or

    FlexCenter(
  overlay,
  option: .XY,
  view: self.indexLabel
)

    option Y

    스크린샷 2021-11-03 오후 9 13 37

    option X

    스크린샷 2021-11-03 오후 9 13 21

    option XY

    스크린샷 2021-11-03 오후 9 25 22 enhancement in dependent 
    opened by GeekTree0101 3
  • Support a FlexWrap with direction

    Support a FlexWrap with direction

    https://yogalayout.com/docs/flex-wrap/ YogaKit does not support line-spacing and item-spacing for flex wraps like a ASStackLayoutSpce(Texture) We need to think about how to improve development convenience in the future.

    enhancement 
    opened by GeekTree0101 2
  • add FlexRatio

    add FlexRatio

    Add FlexRatio

    Usage

    self.contentView.define { flex in
   FlexRatio(flex, view: self.label, ratio: 1.0)
}

    or

    self.contentView.define { flex in
   FlexRatio(
     FlexItem(flex, view: self.label),
     ratio: 1.0
   )
}
    enhancement 
    opened by GeekTree0101 2
  • add snapshot test

    add snapshot test

    Before run unit test, you must set recordMode as true.

    class KarrotFlexSnapshotTestCase: FBSnapshotTestCase {

  var testView: KarrotFlexTestView!

  override func setUp() {
    super.setUp()
    self.testView = KarrotFlexTestView()
    self.testView.backgroundColor = .green
    self.recordMode = false // <- HERE
  }

  func verify() {
    FBSnapshotVerifyView(self.testView)
  }

  func testDefine(parentSize: CGSize, _ closure: @escaping (Flex) -> Void) {
    self.testView.flex.define(closure)
    self.testView.bounds = CGRect(origin: .zero, size: parentSize)
    self.testView.flex.layout()
    self.testView.setNeedsLayout()
  }
}

    test_center_X@3x test_center_Y@3x test_center_XY@3x

    enhancement in dependent 
    opened by GeekTree0101 1
  • add FlexInset

    add FlexInset

    Flex base inset

    FlexInset(someFlex, insets: UIEdgeInsets(top: 16.0, left: 16.0, bottom: 16.0, right: 16.0)

    View base inset

    FlexInset(parentFlex, someView, insets: UIEdgeInsets(top: 16.0, left: 16.0, bottom: 16.0, right: 16.0)
    enhancement in dependent 
    opened by GeekTree0101 1
  • Fix pod trunk warning (swift-version issue)

    Fix pod trunk warning (swift-version issue)

    WARN | [iOS] swift: The validator used Swift 4.0 by default because no Swift version was specified. To specify a Swift version during validation, add the swift_versions attribute in your podspec. Note that usage of a .swift-version file is now deprecated.

    opened by GeekTree0101 0
  • Support a Stack with direction & register method

    Support a Stack with direction & register method

    Flex+Extension provide a register method to store and control flex with an animation example.

    https://user-images.githubusercontent.com/19504988/145706106-667d19f0-27ac-40fd-a22d-a104947038d8.MP4

    enhancement in dependent 
    opened by GeekTree0101 0
  • Remove KarrotFlex+Sugar

    Remove KarrotFlex+Sugar

    Changes

    • FlexColumn/Row -> FlexVStack/HStack.
    • FlexOverlay -> FlexOverlay is provided as an extension method of Flex.
    • FlexInset is deprecated, you must use a padding or margin. Cuz It's a concept that SwiftUI doesn't have. only have Texture(AsyncDisplayKit)
    • FlexSpacer parameters(width/height) merged to spacing(CGFloat), Improve it to adapt to changes in screen orientation.
    • Remove FlexRatio. Cuz It's a concept that SwiftUI doesn't have. only have Texture(AsyncDisplayKit)
    enhancement 
    opened by GeekTree0101 0
Releases(1.1.0)

  • 1.1.0(Feb 8, 2022)

    What's Changed

    • Migrate to Swift Package Manager by @OhKanghoon in https://github.com/daangn/KarrotFlex/pull/22
    • update README.md by @magi82 in https://github.com/daangn/KarrotFlex/pull/23

    New Contributors

    • @magi82 made their first contribution in https://github.com/daangn/KarrotFlex/pull/23

    Full Changelog: https://github.com/daangn/KarrotFlex/compare/1.0.1...1.1.0

    Source code(tar.gz)
    Source code(zip)

  • 1.0.1(Jan 14, 2022)

    What's Changed

    • Delete travis.yml file by @OhKanghoon in https://github.com/daangn/KarrotFlex/pull/18
    • Update FlexWrap.swift by @DevVenusK in https://github.com/daangn/KarrotFlex/pull/19
    • Fix pod trunk warning (resolve #17) by @ElonPark in https://github.com/daangn/KarrotFlex/pull/20

    New Contributors

    • @DevVenusK made their first contribution in https://github.com/daangn/KarrotFlex/pull/19
    • @ElonPark made their first contribution in https://github.com/daangn/KarrotFlex/pull/20

    Full Changelog: https://github.com/daangn/KarrotFlex/compare/1.0.0...1.0.1

    Source code(tar.gz)
    Source code(zip)

  • 1.0.0(Jan 11, 2022)

    What's Changed

    • Support SPM by @OhKanghoon in https://github.com/daangn/KarrotFlex/pull/1
    • add FlexRatio by @GeekTree0101 in https://github.com/daangn/KarrotFlex/pull/2
    • add snapshot test by @GeekTree0101 in https://github.com/daangn/KarrotFlex/pull/5
    • Fix FlexInset bug & add snapshot test by @GeekTree0101 in https://github.com/daangn/KarrotFlex/pull/6
    • Remove KarrotFlex+Sugar by @GeekTree0101 in https://github.com/daangn/KarrotFlex/pull/7
    • Support a Stack with direction & register method by @GeekTree0101 in https://github.com/daangn/KarrotFlex/pull/8
    • fix test code by @LeeHongHwa in https://github.com/daangn/KarrotFlex/pull/10
    • setup ci using github action by @LeeHongHwa in https://github.com/daangn/KarrotFlex/pull/9
    • add PinLayout by @GeekTree0101 in https://github.com/daangn/KarrotFlex/pull/11
    • Fix SPM import Error by @OhKanghoon in https://github.com/daangn/KarrotFlex/pull/12
    • Support a FlexWrap with direction by @GeekTree0101 in https://github.com/daangn/KarrotFlex/pull/13
    • Do not render a FlexSpacer on view hierarchy by @GeekTree0101 in https://github.com/daangn/KarrotFlex/pull/14
    • Support a non-clipsToBounds by @GeekTree0101 in https://github.com/daangn/KarrotFlex/pull/15
    • Update a LICENSE by @GeekTree0101 in https://github.com/daangn/KarrotFlex/pull/16

    New Contributors

    • @OhKanghoon made their first contribution in https://github.com/daangn/KarrotFlex/pull/1
    • @LeeHongHwa made their first contribution in https://github.com/daangn/KarrotFlex/pull/10

    Full Changelog: https://github.com/daangn/KarrotFlex/commits/1.0.0

    Thank you all.

    Source code(tar.gz)
    Source code(zip)
Owner
당근마켓
당신의 근처에서 만나는 중고 직거래 앱, 당근마켓을 만들고 있습니다
당근마켓
GitHub
TinyConstraints is the syntactic sugar that makes Auto Layout sweeter for human use.

TinyConstraints is the syntactic sugar that makes Auto Layout sweeter for human use. Features Pure Swift 5 sweetness. Everything you can do with Auto

Robert-Hein Hooijmans 3.8k Jan 5, 2023
✨ Super sweet syntactic sugar for SwiftUI.View initializers.

ViewCondition ✨ Super sweet syntactic sugar for SwiftUI.View initializers. At a Glance struct BorderTextView: View { var color: Color? @ViewBuild

Yoon Joonghyun 76 Dec 17, 2022
A declarative UI framework for iOS

Layout Layout is a native Swift framework for implementing iOS user interfaces using XML template files and runtime-evaluated expressions. It is inten

Nick Lockwood 2.2k Dec 23, 2022
Lightweight declarative auto-layout framework for Swift

SwiftyLayout SwiftyLayout is a framework that allows to describe layout constraints (ie NSLayoutConstraint) as a simple mathematical formula in a Swif

Hisakuni Fujimoto 15 Nov 7, 2017
A declarative UIKit for improve layout productivity when developing an iOS application

TifoKit A declarative UIKit for improve layout productivity when developing an iOS application Requirements Min. iOS 11 Swift 5+ Installation Currentl

Tifo Audi A.P 22 Aug 9, 2022
A declarative Auto Layout DSL for Swift :iphone::triangular_ruler:

Cartography ?? ?? Using Cartography, you can set up your Auto Layout constraints in declarative code and without any stringly typing! In short, it all

Robb Böhnke 7.3k Jan 4, 2023
⚓️ Declarative, extensible, powerful Auto Layout

EasyAnchor ❤️ Support my apps ❤️ Push Hero - pure Swift native macOS application to test push notifications PastePal - Pasteboard, note and shortcut m

Khoa 449 Nov 10, 2022
🌵Declarative UIKit

Viewtiful Example To run the example project, clone the repo, and run pod install from the Example directory first. Requirements Installation Viewtifu

Yongjun Lee 2 Oct 28, 2021
Declarative Auto Layout in Swift, clean and simple

Tails Tails is a take on declarative Auto Layout. If you don't like typing (like me), it might be your kind of thing! Tails is written in Swift and cu

Nick Tymchenko 17 Jan 31, 2019
The declarative approach to UIKit.

SugarKit SugarKit is a declarative approach to the UIKit framework. It allows you to Declare your views in a clean and concise way like let button = U

Roman Nabiullin 3 Oct 31, 2022
Boardy - Boardy serves as a digital bulletin board on iOS platforms built for high schoolers to share and view information from others in a convenient manner.

Boardy Boardy serves as a lightweight digital bulletin board on iOS platforms built for high schoolers to share and view information from others in a

Jacky Luong 0 Dec 31, 2021
VerticalFlowLayout - This implementation is built using a UICollectionView and a custom flowLayout.

VerticalFlowLayout This implementation is built using a UICollectionView and a custom flowLayout. Table of contents Requirements Installation CocoaPod

Alexander Sibirtsev 2 Apr 19, 2022
A custom layout built on top of SwiftUI's Layout API that lays elements out in multiple lines. Similar to flex-wrap in CSS, CollectionViewFlowLayout.

WrapLayout A custom layout built on top of SwiftUI's Layout API that lays elements out in multiple lines. Similar to flex-wrap in CSS, CollectionViewF

Hiroshi Kimura 6 Sep 27, 2022
MyLayout is a simple and easy objective-c framework for iOS view layout

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 UITableView UICollectionView RTL

欧阳大哥2013 4.2k Dec 30, 2022
IOS-IntegratedPhotoCapture - Integrated photo capture framework use podspec

IOS-IntegratedPhotoCapture integrated photo capture framework use podspec ======

Nguyễn Thành Nam 1 Dec 30, 2021
A Set of Tools To Extend UIKit (Classic iOS Framework)

RVS_UIKit_Toolbox A set of basic UIKit tools, for Swift iOS app development. Overview This package offers a few extensions of standard UIKit classes,

The Great Rift Valley Software Company 2 Jul 8, 2022
A iOS SwiftUI framework for displaying data from an api inside a List.

FeedListKit FeedListKit is a high level framework for representing data from an Api inside a SwiftUi List. It automatically handles refreshing and loa

Knoggl 3 Nov 2, 2022
Powerful autolayout framework, that can manage UIView(NSView), CALayer and not rendered views. Not Apple Autolayout wrapper. Provides placeholders. Linux support.

CGLayout Powerful autolayout framework, that can manage UIView(NSView), CALayer and not rendered views. Has cross-hierarchy coordinate space. Implemen

Koryttsev Denis 45 Jun 28, 2022
A powerful Swift programmatic UI layout framework.

Build dynamic and beautiful user interfaces like a boss, with Swift. Neon is built around how user interfaces are naturally and intuitively designed.

Mike 4.6k Dec 26, 2022