MultiSelectSegmentedControl 2.4.0

MultiSelectSegmentedControl 2.4.0

测试已测试
语种语言 Obj-CObjective C
许可协议 MIT
发布最后发布Apr 2024

Paul SilvisYonat Sharon维护。




  • Yonat Sharon

MultiSelectSegmentedControl

Swift Version Build Status License CocoaPods Compatible
Platform PRs Welcome

UISegmentedControl的重制版,支持多段选择、垂直堆叠以及文本和图像的组合。

功能

  • 单选或多选。
  • 水平或垂直堆叠。
  • 可以同时显示文本和图像。
  • 可以从Storyboard或代码中使用。
  • 支持UIAppearance。

使用方法

UISegmentedControl非常相似,在大多数情况下可以作为替代品使用。

如果您使用Interface Builder,请添加一个常规的UIView,然后将其类设置为MultiSelectSegmentedControl

SwiftUI 使用方法

MultiSegmentPicker(
    selectedSegmentIndexes: $indexSet,
    items: ["One", "Two", image, [image2, "Text"], "Last"]
)

以下提到的属性可以作为参数传递给MultiSegmentPicker初始化器,也可以作为视图修饰符使用(例如,.borderWidth(3))。

创建段落

每个段落可以包含图片、文本或两者兼具

let multiSelect = MultiSelectSegmentedControl()
multiSelect.items = ["One", "Two", image, [image2, "Text"], "Last"]

图片以全色显示(与UISegmentedControl不同)。要使它们以与控件相同的tintColor渲染,请使用模板模式

multiSelect.items = [image1, image2, image3].map { $0.withRenderingMode(.alwaysTemplate) }

选择段落

multiSelect.selectedSegmentIndexes = [1, 2, 4]

或仅进行单选

multiSelect.allowsMultipleSelection = false
multiSelect.selectedSegmentIndex = 3

获取所选段落

let selectedIndices: IndexSet = multiSelect.selectedSegmentIndexes

或获取标题

let titles: [String] = multiSelect.selectedSegmentTitles

处理用户选择变化

可以使用标准的目标-操作

multiSelect.addTarget(self, action: #selector(selectionChanged), for: .valueChanged)

或遵守代理协议

extension MyViewController: MultiSelectSegmentedControlDelegate {
    func multiSelect(_ multiSelectSegmentedControl: MultiSelectSegmentedControl, didChange value: Bool, at index: Int) {
        print("selected \(value) at \(index)")
    }
}

... 并设置代理

multiSelect.delegate = self

更改外观

颜色

multiSelect.tintColor = .green

背景颜色(可选,如果背景颜色应不同于调色色,则使用)

multiSelect.selectedBackgroundColor = .blue

形状

multiSelect.borderWidth = 3 // Width of the dividers between segments and the border around the view.
multiSelect.borderRadius = 32 // Corner radius of the view.

垂直堆叠段落

multiSelect.isVertical = true

当段落包含图片和文本时,垂直堆叠每个段落的文本内容

multiSelect.isVerticalSegmentContents = true

文本样式

multiSelect.setTitleTextAttributes([.foregroundColor: UIColor.yellow], for: .selected)
multiSelect.setTitleTextAttributes([.obliqueness: 0.25], for: .normal)

更多标签样式

multiSelect.titleConfigurationHandler = {
    $0.numberOfLines = 0
    $0.lineBreakMode = .byWordWrapping
}

安装

CocoaPods

pod 'MultiSelectSegmentedControl'

Swift Package Manager

dependencies: [
    .package(url: "https://github.com/yonat/MultiSelectSegmentedControl", from: "2.3.5")
]

TODO

  • 选中的段的背景色应该为透明色
  • 配置段 layoutMarginsstackView.spacing

Meta

@yonatsharon

https://github.com/yonat/MultiSelectSegmentedControl