ExpandableButton 1.1.0

ExpandableButton 1.1.0

Dima Mishchenko 维护。



  • Dima Mishchenko

ExpandableButton

Swift 4.2 CocoaPods compatible Packagist

需求

  • iOS 9.0+

安装

CocoaPods

  • 将以下行添加到您的 Podfile
pod 'ExpandableButton'
  • 在您的 Podfile 中添加 use_frameworks!
  • 运行 pod install
  • 添加到文件中
import ExpandableButton  

使用方法

您可以使用 frame(默认为 .zero)、direction(默认为 .right)和项目(每个项目都是按钮)初始化 ExpandableButtondirection 是打开方向。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)

带有 imageaction 的项目

// 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)

带有 imagehighlightedImageimageEdgeInsets

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")
        }
    )
    ...
]

arrowWidthseparatorWidth 以及 cornerRadius

buttonView.arrowWidth = 2
buttonView.separatorWidth = 2
buttonView.layer.cornerRadius = 30

自定义 openclose 动作的图标,closeOpenImagesInsets

// custom open and close images
buttonView.openImage = UIImage(named: "open")
buttonView.closeImage = UIImage(named: "close")
buttonView.closeOpenImagesInsets = insets

支持 attributedTitlehighlightedAttributedTitle 和自定义项 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 下方(使用 contentEdgeInsetstitleEdgeInsetsimageEdgeInsetstitleAlignmentimageContentModesize

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 方向的偏移量和从左边、右边对 updown 方向的偏移量。
separatorWidth CGFloat 1 分隔视图宽度。

ExpandableButtonItem

名称 类型 默认值 描述
image UIImage? nil .normal 状态的图标。
highlightedImage UIImage? nil .highlighted 状态的图标。
attributedTitle NSAttributedString? nil .normal 状态的属性字符串。
highlightedAttributedTitle NSAttributedString? nil .highlighted 状态的属性字符串。
contentEdgeInsets UIEdgeInsets .zero 对应于 UIButtoncontentEdgeInsets
titleEdgeInsets UIEdgeInsets .zero 对应于 UIButtontitleEdgeInsets
imageEdgeInsets UIEdgeInsets .zero 对应于 UIButtonimageEdgeInsets
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 文件。