Expander: A Swift repository from yutingLei

Expander

导入

使用Carthage导入

若未安装Carthage，使用下面方法安装：

$ brew update
$ brew install carthage

创建Cartfile文件并添加以下内容.

github "yutingLei/Expander" "master"

在终端，cd到工程根目录，运行carthage update命令，将编译好的Expander.framework添加到Xcode项目中去。

手动导入

直接复制Expander文件夹到项目中去，并添加到工程中即可.

可能需要移除Info.plist文件，视情况而定。

使用

首先, 在需要的文件中导入Expander.

import Expander

初始化

只能使用类方法初始化EView实例:

/// 参数view是EView的父视图
/// 无需担心交叉强引用，该视图在EView中是weak类型
let eView = EView.serialization(in: view)
view.addSubview(eView)

配置`EView`

使用默认的配置可以跳过配置.

实例化配置. 注意：EViewConfig是struct类型.

var config = EViewConfig()

可设置的属性:

属性名	类型	描述	默认值
size	CGSize	EView的初始大小	`80x80`
expandSize	CGSize	EView扩展后的大小，其中宽度小于0时，使用默认宽度；高度同理	`Optional`
expandCornerRadius	CGFloat	EView展开后的边角弧度	`10`
distanceToTop	CGFloat	EView到父视图顶部的距离	`Optional`
padding	EViewPadding	EView相对父视图的边缘填充	`EViewPadding(0, 8)`
expandType	EViewExpandType	EView展开时的模式(或者说是方向)	`.center`
located	EViewLocated	决定EView位于父视图的左/右边	`.left`
stateFlag	Touple	控制按钮展开/收拢状态的标题	`("Expand", "Fold")`
isViscosity	Bool	是否具有粘性，为`true`时，可以移动EView，但在手指松开后会回到原来的位置	`Optional`

配置完成后，必须调用一次applyConfig函数.

eView.applyConfig(config)

扩展

如果我想自己控制EView的展开和收拢怎么办?

下面两个方法用于展开和收拢

/// 展开动作
/// rect: 如果设置了rect，那么展开后的frame = rect，仅限本次有效
public func expand(to rect: CGRect? = nil)
/// 收拢动作
/// rect: 如果设置了rect，那么收拢后的frame = rect，仅限本次有效
public func fold(to rect: CGRect? = nil)

为EView添加视图

当创建EView后，可以获取一个contentView的属性，此时可以向里面添加任意视图。

有快速的方法显示数据吗?

当然，可以使用默认的显示方式，而这仅需一点代码。
首先，假设有以下一个数组:

let datas = [["title": "Gemany", "image": "GM.png"],
            ["title": "India", "image": "IN.png"],
            ["title": "Japan", "image": "JP.png"],
            ["title": "Netherlands", "image": "NL.png"],
            ["title": "UK", "image": "UK.png"],
            ["title": "US", "image": "US.png"],
            ["title": "Canada", "image": "CA.png"],
            ["title": "Singapore", "image": "SP.png"]]

初始化cell配置 EViewCellConfig:

/// 初始化配置
/// 注意：传入的keys是取字典值的key,第一个必须是标题的key，第二个必须是图片的key
let cellConfig = EViewCellConfig(keys: ["title", "image"])

设置一些其它属性. 使用默认的可以跳过设置。

属性名	类型	描述	默认值
mode	EViewCellMode	cell的显示模式，`.default`表示上面是标题，下面是图片; `.classic`与之相反	`.default`
isMultiSelect	Bool	是否多选	`false`
sureTitle	String	确认按钮的标题，仅在`isMultiSelect = true`时有效	`Sure`
multiSelectedHandler	Closure	当`isMultiSelect = true`时，点击确认按钮的回调函数	`Optional`
backgroundColor	UIColor	每个cell的背景色	`.white`
selectedBackgroundColor	UIColor	cell在选中状态下的背景色，需`isMultiSelect = false`	`Optional`
selectedImage	UIImage	选中状态的图片，仅`isMultiSelect = true`有效	`Optional`
layout	UICollectionViewFlowLayout	cell的排列方式	`Optional`

调用函数来显示数据:

eView.showDatas(datas, with: config) { idx in print("Current select: \(idx)")}

我想控制多个EView,该怎么破?

别担心！你可以使用EViewGroup这个类.

假设声明了多个EView的实例： eView1, eView2, eView3...

然后我们创建EViewGroup管理组

let eGroup = EViewGroup.init(layout: .center, mode: .one, with: eView1, eView2, eView3)
eGroup.formed()

就这样!?, 如果简单使用，两行代码就可以为解决问题。

当然，还有可配置参数（使配置参数生效必须在调用formed函数之前）：

属性	类型	描述
layout	EViewGroupLayout	被管理视图的排列方式
mode	EViewGroupExpande	被管理视图同时能够展开个数
interItemSpacing	CGFloat	相邻两个EView视图间隔. 只支持`layout =` `.start`/`.end`/`.center`

案例

简单的EView使用方法和配置

使用EView显示数据

EViewGroup的使用方法

TODO

Basic functions
Add dynamic behaviors?
Multiple EViews EViewGroup
Shadow color

yutingLei/Expander