在iOS上创建美观、可自定义、可扩展的动画复选框。完全可通过界面构建器进行配置。拥有多个内置动画、自定义值支持、混合状态、勾选和单选样式、圆形和圆角矩形框形状,以及全颜色自定义。查看演示应用以尝试所有功能。
目录
文档
查看演示应用以更改复选框的属性并实时看到变化。
动画
-
动画
枚举
:切换到和从未选中状态的可能的动画。 -
stateChangeAnimation
Animation
: 在从未选中的状态切换到任何其他状态时要进行的动画类型。 -
animationDuration
NSTimeInterval
: 复选框状态切换时发生的动画持续时间。默认值为0.3秒。
值
- value
(Any)
: 根据复选框的状态返回checkedValue
、uncheckedValue
或mixedValue
。 - checkedValue
Any
: 当复选框被选中时从value
返回的对象。 - uncheckedValue
Any
: 当复选框未被选择时从value
返回的对象。 - mixedValue
Any
: 当复选框处于混合状态时从value
返回的对象。
状态
- CheckState
enum
: 复选框可能的状态。unchecked
— 不显示任何勾选。checked
— 显示勾选标记。mixed
— 显示破折号。
- checkState
CheckState
: 复选框的当前状态。 - setCheckState(newState:
CheckState
, animated:Bool
): 带有动画选项更改检查状态。 - toggleCheckState:animated:
Bool
= false: 在Unchecked
和Checked
状态之间切换检查状态。
外观
- MarkType: 标记的可能形状。
checkmark
— 标记是一个标准勾选标记。radio
— 标记为单选样式填充。
- BoxType: 方框的可能形状。
circle
— 方框是圆形。square
— 方框是正方形,可选圆角。
- tintColor: 某些动画的
Selected
和Mixed
状态的主要颜色。 - secondaryTintColor
UIColor
: 未选择状态下方框的颜色。 - secondaryCheckmarkTintColor
UIColor
: 某些动画中勾选标记或单选的颜色。(大多数是填充样式的动画。) - checkmarkLineWidth
CGFloat
: 勾选标记的线条宽度。 - markType
MarkType
: 显示的标记类型。 - boxLineWidth
CGFloat
: 方框的线条宽度。 - cornerRadius
CGFloat
: 当方框类型为Square
时方框的圆角。 - boxType
BoxType
: 复选框的形状。 - hideBox
Bool
: 是否隐藏方框。
开始使用
示例
沙箱
要查看正在运行的沙箱示例,请运行位于路径 M13Checkbox Demo Playground/LaunchMe.xcworkspace
的工作空间。在沙箱开始之前,您可能需要运行框架方案并等待 Xcode 处理文件。打开辅助编辑器以实时预览 UI。
这是在代码中对复选框进行自定义以满足您需求的好方法。
应用程序
要查看复选框在设备上的工作情况,请运行包含在 M13Checkbox.xcodeproj
中的示例应用程序。该示例应用程序演示了所有可用功能。您需要运行 pod install
以构建示例应用程序。
安装
CocoaPods
通过 CocoaPods 安装 M13Checkbox 是最简单的方法。简化您的 podfile 添加以下内容。
pod 'M13Checkbox'
Carthage
要通过Carthage安装,请将以下内容添加到您的cartfile中:
github "Marxon13/M13Checkbox"
Swift Package Manager
要通过Swift Package Manager安装,请将以下内容作为依赖项添加到您的Package.swift文件中:
.Package(url: "[email protected]:Marxon13/M13Checkbox.git", versions: Version(2,2,0)..<Version(2,2,3)),
手动
另一种选择是将“Sources”文件夹中的文件复制到您的项目中。
使用
Storyboard
在故事板中添加自定义视图并将其类设置为"M13Checkbox"。根据需要,在属性检查器中自定义可用的参数。
注意:添加了一个垫片来支持通过接口生成器设置枚举属性。只需检索与所需的枚举值相对应的整数值,并将其输入到属性检查器中的属性中即可。
以编程方式
只需像初始化UIView一样初始化复选框,并将其添加到视图层级结构中即可。
let checkbox = M13Checkbox(frame: CGRect(x: 0.0, y: 0.0, width: 40.0, height: 40.0))
view.addSubview(checkbox)
项目结构
M13Checkbox M13Checkbox 的主要接口是 M13Checkbox
类。它是 UIControl
的子类,用于处理可配置的属性以及触摸事件。
M13CheckboxController 每个 M13Checkbox
都引用一个 M13CheckboxController
实例,该实例控制其层的外观和动画。控制器将一系列层传递给 M13Checkbox
,将其添加到层的层级结构中。复选框随后要求控制器对这些层执行必要的动画以在状态之间进行动画处理。每种动画类型都有自己的 M13CheckboxController
子类。要添加动画,可以扩展 M13CheckboxController
,并将动画类型添加到 Animation
枚举中,如果适用,支持 AnimationStyle
。查看现有的控制器,以了解要覆盖的变量和函数。
M13CheckboxAnimationGenerator 每个 M13CheckboxController
都引用一个 M13CheckboxAnimationGenerator
实例,该实例在状态转换期间生成用于层的动画。基础类包含在多个动画样式之间共享的动画。动画可以扩展 M13CheckboxAnimationGenerator
以生成针对动画类型特定的新动画。
M13CheckboxPathGenerator 每个 M13CheckboxManager
都引用一个 M13CheckboxPathGenerator
实例,该实例生成将由层显示的路径。基础类包含在多个动画样式之间共享的路径,以及一些用于确定使用哪个路径的样板代码。一些动画有一个 M13CheckboxPathGenerator
子类,用于添加针对动画类型特定的新路径,或覆盖现有路径以自定义外观。
M13CheckboxPathGenerator
使用比基本缩放偏移更加复杂的方式来计算勾选标记点的位置。这使得勾选标记在不同的复选框大小下始终看起来相同。包含在 checkmarkLongArmBoxIntersectionPoint
和 checkmarkLongArmEndPoint
中的数学是一个更简洁的、可读的解决方案。要查看创建这些方程的数学,请查看 "Other" 文件夹中的 "Math.nb" 或 "Math.pdf"。
M13Checkbox+IB 一个中间件,使您能够在 Interface Builder 中设置 M13Checkbox
的枚举值。
项目详情
要求
- iOS 8+
- Xcode 10.2+
- Swift 5
待办事项
- 修复当标记为单选按钮时,选中状态和混合状态之间的动画。当圆圈几乎呈扁平状态时,左右边缘不是圆滑的,渲染出一些图形瑕疵。
- 为UIControl的选中状态添加视觉反馈。因此,当点击复选框时,它会稍微动一下到新状态。
- 添加中断动画中间动画的支持。因此,如果连续快速点击复选框,则它从当前值开始动画,而不是重置复选框并重新启动动画。这可能涉及替换为使用CADisplayLink手动执行动画。或者新的UIViewPropertyAnimator。
- tvOS支持。
- watchOS支持。
- macOS支持。
- 复选框单元格(重新添加标签支持)
- 复选框组(单选/多选)
许可证
M13Checkbox
在 MIT 许可证 下可用。