ExpandableButton
需求
- iOS 9.0+
安装
CocoaPods
- 将以下行添加到您的
Podfile
pod 'ExpandableButton'- 在您的
Podfile中添加use_frameworks! - 运行
pod install - 添加到文件中
import ExpandableButton 使用方法
您可以使用 frame(默认为 .zero)、direction(默认为 .right)和项目(每个项目都是按钮)初始化 ExpandableButton。direction 是打开方向。items 是包含有关将来按钮信息的 [ExpandableButtonItem]。方向示例
let rightButton = ExpandableButtonView(frame: frame, direction: .right, items: items)
let leftButton = ExpandableButtonView(frame: frame, direction: .left, items: items)
let upButton = ExpandableButtonView(frame: frame, direction: .up, items: items)
let downButton = ExpandableButtonView(frame: frame, direction: .down, items: items)带有 image 和 action 的项目
// create items with images and actions
let items = [
ExpandableButtonItem(
image: UIImage(named: "delete"),
action: {_ in
print("delete")
}
),
ExpandableButtonItem(
image: UIImage(named: "edit"),
action: {_ in
print("edit")
}
),
ExpandableButtonItem(
image: UIImage(named: "share"),
action: { _ in
print("share")
}
)
]
// create ExpandableButton
let buttonView = ExpandableButtonView(items: items)
buttonView.frame = CGRect(x: 0, y: 0, width: 60, height: 60)
buttonView.backgroundColor = .white
view.addSubview(buttonView)带有 image、highlightedImage 和 imageEdgeInsets
let insets = UIEdgeInsets(top: 16, left: 16, bottom: 16, right: 16)
// create items with image, highlighted image, image insets.
let items = [
ExpandableButtonItem(
image: UIImage(named: "delete"),
highlightedImage: UIImage(named: "highlightedDelete"),
imageEdgeInsets: insets,
action: {_ in
print("delete")
}
)
...
]和 arrowWidth、separatorWidth 以及 cornerRadius
buttonView.arrowWidth = 2
buttonView.separatorWidth = 2
buttonView.layer.cornerRadius = 30自定义 open 和 close 动作的图标,closeOpenImagesInsets
// custom open and close images
buttonView.openImage = UIImage(named: "open")
buttonView.closeImage = UIImage(named: "close")
buttonView.closeOpenImagesInsets = insets支持 attributedTitle,highlightedAttributedTitle 和自定义项 size
// with attributed string, highlighted attributed string, custom size.
let items = [
ExpandableButtonItem(
attributedTitle: NSAttributedString(
string: "Attributed Text",
attributes: [.foregroundColor: UIColor.red]
),
highlightedAttributedTitle: NSAttributedString(
string: "Attributed Text",
attributes: [.foregroundColor: UIColor.green]
),
size: CGSize(width: 160, height: 60)
)
]将 attributedTitle 放置于 image 下方(使用 contentEdgeInsets、titleEdgeInsets、imageEdgeInsets、titleAlignment、imageContentMode、size)
let attributedTitle = NSAttributedString(
string: "Share",
attributes: [.foregroundColor: UIColor.black,
.font: UIFont.systemFont(ofSize: 12)]
)
let highlightedAttributedTitle = NSAttributedString(
string: "Share",
attributes: [.foregroundColor: UIColor.lightGray,
.font: UIFont.systemFont(ofSize: 12)]
)
let items = [
ExpandableButtonItem(
image: UIImage(named: "share"),
highlightedImage: UIImage(named: "haglightedShare"),
attributedTitle: attributedTitle,
highlightedAttributedTitle: highlightedAttributedTitle,
contentEdgeInsets: UIEdgeInsets(top: 6, left: 6, bottom: 6, right: 6),
titleEdgeInsets: UIEdgeInsets(top: 24, left: -200, bottom: 0, right: 0),
imageEdgeInsets: UIEdgeInsets(top: 6, left: 0, bottom: 24, right: 0),
size: CGSize(width: 80, height: 60),
titleAlignment: .center,
imageContentMode: .scaleAspectFit
)
]您可以调用 open() 和 close()
let buttonView = ExpandableButtonView(items: items)
buttonView.open()
buttonView.close()所有选项
ExpandableButtonView
| 名称 | 类型 | 默认值 | 描述 |
|---|---|---|---|
direction |
方向 |
.right |
打开方向。可以是 .left、.right、.up 或 .down。只在 init(frame:direction:items:) 中设置。 |
state |
状态 |
.closed |
当前状态。可以是 .opened、.closed 或 .animating。 |
animationDuration |
时间间隔 |
0.2 |
打开、关闭和箭头动画持续时间。 |
closeOnAction |
布尔值 |
false |
如果为 true,则在任何项目动作后调用 close()。 |
isHapticFeedback |
布尔值 |
true |
开启触觉反馈(Taptic engine) |
arrowInsets |
UIEdgeInsets |
top: 12 left: 12 bottom: 12 right: 12 |
箭头内边距。 |
arrowWidth |
CGFloat |
1 |
箭头线宽。 |
arrowColor |
UIColor |
UIColor.black |
箭头颜色。 |
closeOpenImagesInsets |
UIEdgeInsets |
.zero |
自定义关闭和打开图像的内边距。 |
closeImage |
UIImage? |
nil |
自定义关闭图像。 |
openImage |
UIImage? |
nil |
自定义打开图像。 |
isSeparatorHidden |
布尔值 |
false |
如果为 true,则隐藏分隔视图。 |
separatorColor |
UIColor |
UIColor.black |
分隔线颜色。 |
separatorInset |
CGFloat |
8 |
分隔线从顶部、底部对 .left、.right 方向的偏移量和从左边、右边对 up、down 方向的偏移量。 |
separatorWidth |
CGFloat |
1 |
分隔视图宽度。 |
ExpandableButtonItem
| 名称 | 类型 | 默认值 | 描述 |
|---|---|---|---|
image |
UIImage? |
nil |
.normal 状态的图标。 |
highlightedImage |
UIImage? |
nil |
.highlighted 状态的图标。 |
attributedTitle |
NSAttributedString? |
nil |
.normal 状态的属性字符串。 |
highlightedAttributedTitle |
NSAttributedString? |
nil |
.highlighted 状态的属性字符串。 |
contentEdgeInsets |
UIEdgeInsets |
.zero |
对应于 UIButton 的 contentEdgeInsets。 |
titleEdgeInsets |
UIEdgeInsets |
.zero |
对应于 UIButton 的 titleEdgeInsets。 |
imageEdgeInsets |
UIEdgeInsets |
.zero |
对应于 UIButton 的 imageEdgeInsets。 |
size |
CGSize? |
nil |
当前项的 UIButton 大小。如果为 nil,则与箭头按钮大小相同。 |
titleAlignment |
NSTextAlignment |
.center |
titleAlignment 用于在 UIButton 中的 titleLabel。 |
imageContentMode |
UIViewContentMode |
.scaleAspectFit |
imageContentMode 用于在 UIButton 中的 imageView。 |
action |
(ExpandableButtonItem) -> Void |
{_ in} |
动作闭包。在 .touchUpInside 时调用 |
identifier |
String |
"" |
ExpandableButtonItem 的标识符。 |
您还可以在项目中使用 ArrowButton(可使用核心图形绘制左、右、上和下箭头的按钮,只需调用 showLeftArrow()、showRightArrow()、showUpArrow() 或 showDownArrow())和 ActionButton(具有 actionBlock 属性的简单 UIButton,在 .touchUpInside 时调用)。
许可证
ExpandableButton 携带 MIT 许可证。有关更多信息,请参阅 LICENSE 文件。










