IOS 一款简单的Swift布局框架-EasyLayout

来源:互联网 发布:php5权威编程 pdf 编辑:程序博客网 时间:2024/05/16 18:13

EasyLayout 简介

EasyLayout 是一个服务于ios,基于swift编写的布局框架。它定义了运算符,通过编写view之间的关系生成对应的NSLayoutConstraint对象,简化了NSLayoutConstraint对象的生成代码,它使得约束的显示方式和xib的约束显示很相似

EasyLayout通过扩展UIView和UIViewController添加API,通过编写UIView与UIView之间关系或者UIView与UIViewController的LayoutGuide之间的关系就可以生成对应的NSLayoutConstraint

项目和Demo地址: https://github.com/wangmuhuo/EasyLayoutDemo.git

使用事例

swift代码:

////  ViewController.swift//  EasyLayoutDemo////  Created by Jejay on 17/3/14.//  Copyright © 2017年 jejay. All rights reserved.//import UIKitimport EasyLayoutclass ViewController: UIViewController {        override func viewDidLoad() {        super.viewDidLoad()        let view1: UIView = {            let view = UIView()            view.backgroundColor = UIColor.redColor()            return view        }()        let view2: UIView = {            let view = UIView()            view.backgroundColor = UIColor.greenColor()            return view        }()                self.view.addSubview(view1)        self.view.addSubview(view2)                view1.translatesAutoresizingMaskIntoConstraints = false        view2.translatesAutoresizingMaskIntoConstraints = false                self.view.addConstraints([            view1.es.top .= self.es_topLayoutGuideBottom .+ 50,            view1.es.centerX .= self.view.es.centerX,            view1.es.height .= 50,            view1.es.width .= self.view.es.width .* 0.5,                        view2.es.top .= view1.es.bottom .+ 50,            view2.es.centerX .= view1.es.centerX,            view2.es.height .= view1.es.height .* 2 .+ 50,            view2.es.width .= 1000 .| 900,            view2.es.width .<= view1.es.width .- 50,                        ])            }    }

效果:


EasyLayout api 简单介绍


目录文件结构

ESLayout.swift  提供布局相关api

ESNumberConversion.swift 提供数值类型相关api

布局属性

和 NSLayoutAttribute对应,我就不多说了,
1、UIView的布局属性:通过 view.es. 就可以通过联想得到,
2、UIViewController的LayoutGuide的布局属性:通过viewController.es_ 就可以通过联想得到

运算符

考虑到很运算符与系统冲突,所以本框架运算符前面都带有点(.),这点是 模仿Matlab运算符来设计的,matlab中,两个矩阵 A和B,A*B 表示两个矩阵之间进行矩阵相乘运算,A.*B 表示矩阵内部元素对应相乘


一、.= 、.<= .>=:

双目运算符,参数是两个布局属性,用于创建两个布局属性之间的约束关系,分别对应于系统NSLayoutRelation下的.Equal、.LessThanOrEqual、.GreaterThanOrEqual

如:

let c1 = view1.es.height.= 50

等同于:

let c1 = NSLayoutConstraint(

            item: view1, attribute:NSLayoutAttribute.Height,

            relatedBy: .Equal,

            toItem: nil, attribute: .NotAnAttribute,

            multiplier: 1,

            constant: 50)


二、 .*、./、.+ 、.-:

双目运算符,参数是属性和一个数值类型,用于给属性增加偏移或者倍数关系,对应NSLayoutConstraint的constant属性和multiplier属性

如:

let c2 = view1.es.height.= view2.es.height .* 2

等同于:

let c2 = NSLayoutConstraint(

            item: view1, attribute: NSLayoutAttribute.Height,

            relatedBy: .Equal,

            toItem: view2, attribute:NSLayoutAttribute.Height,

            multiplier: 2,

            constant: 0)


三、   .|:

双目运算符,参数是NSLayoutConstraint和一个数值类型,用于给属性增加权重值,对应NSLayoutConstraint的priority

如:

let c3 = view1.es.height.= 50 .| 500

等同于以下两句代码:

let c3 = NSLayoutConstraint(

            item: view1, attribute:NSLayoutAttribute.Height,

            relatedBy: .Equal,

            toItem: nil, attribute: .NotAnAttribute,

            multiplier:1,

            constant: 50)

c3.priority = 500




0 0
原创粉丝点击