TNSwiftyCheckboxGroup

一个用于轻松创建复选框组的 Swift 组件

是什么

TNSwiftyCheckboxGroup 是一个基于 UICollectionView 的创建复选框组的组件。

有三种预定义样式

• 方形复选框
• 圆形复选框
• 图片复选框

并且您可以选择创建自己的子类并构建自己的复选框类型。

它可以在横屏和竖屏模式下运行。

如何使用

编程方式

编程方式设置起来更快，因为您不需要在 Interface Builder 中编排。

1. 使用 TNSwiftyCheckboxModel 类创建数组。

   var checkboxModels = [
   
       TNSwiftyCheckboxModel(name: "Elephant with a very long proboscis", checked: false),
       TNSwiftyCheckboxModel(name: "Tiger", checked: true),
       TNSwiftyCheckboxModel(name: "Antilope", checked: false),
       TNSwiftyCheckboxModel(name: "Monkey", checked: true),
       TNSwiftyCheckboxModel(name: "Spider", checked: false)
   
   ]
   

2. a) 如果您通过 CocoaPods 添加了此类，您应该在类的顶部导入模块

   import TNSwiftyCheckboxGroup
   

3. b) 创建 TNSwiftyCheckboxViewController 的一个实例并将其添加到视图控制器中。

   checkboxVC = TNSwiftyCheckboxViewController()
   addChildViewController(checkboxVC)
   
   view.addSubview(checkboxVC.view)
   checkboxVC.didMoveToParentViewController(self)
   

4. 使用步骤 1 中创建的数组设置 checkboxModels 属性

   checkboxVC.checkboxModels = checkboxModels 
   

Storyboard

要将 TNSwiftyCheckboxGroup 添加到您的 Storyboard，您需要执行以下步骤。别担心，不会花很长时间。

1. 从 对象库 中拖拽一个 Container View 对象到您的场景中。设置您喜欢的约束。

2. 删除附加的视图控制器（这将在您添加容器视图时自动添加）。

3. 从 对象库 中拖拽一个 Collection View Controller 对象。注意：您可以安全地删除 Interface Builder 添加的原型 UICollectionViewCell 接口。

4. 从容器视图控制器按 Ctrl 键拖拽到 UICollectionViewController 并选择 embed 转场类型。

5. 将 UICollectionView 的 Custom Class 属性更改为 TNSwiftyCheckboxViewController。

6. 现在我们需要向视图控制器提供一个包含 TNSwiftyCheckboxModel 对象的数组。为了做到这一点，我们将使用 prepareForSegue(_:sender:)。选择您在步骤 3 中创建的 embed 转场，转到 属性检查器。在这里，您可以设置一个标识符。

7. （a）打开您的视图控制器类，并实现prepareForSegue(_:sender:)方法。

8. （b）如果您通过CocoaPods添加了这个类，您应该在类的顶部导入该模块。

   import TNSwiftyCheckboxGroup
   

9. 在这个方法中，我们将首先检查正确的segue。

   override func prepareForSegue(segue: UIStoryboardSegue, sender: AnyObject?) {
   
       if( segue.identifier == "YOUR-SEGUE-IDENTIFIER" ) {
   
           // Add code for step 9 here
   
       }
   
   }
   

10. 为每个您想可视化的复选框创建一个TNSwiftyCheckboxModel对象数组。

    var checkboxModels = [
    
        TNSwiftyCheckboxModel(name: "Elephant with a very long proboscis", checked: false),
        TNSwiftyCheckboxModel(name: "Tiger", checked: true),
        TNSwiftyCheckboxModel(name: "Antilope", checked: false),
        TNSwiftyCheckboxModel(name: "Monkey", checked: true),
        TNSwiftyCheckboxModel(name: "Spider", checked: false)
    
    ]
    

11. 您可以通过segue.destinationViewController属性引用TNSwiftyCheckboxViewController。

    checkboxVC = segue.destinationViewController as! TNSwiftyCheckboxViewController
    

12. 使用您在步骤9中创建的数组设置checkboxModels属性。

    checkboxVC.checkboxModels = checkboxModels
    

13. 就这样了 ：）

委托

如果您想在一个复选框值更改时得到通知，可以将您的类设置为TNSwiftyCheckboxViewController的委托。只需让您的类符合TNSwiftyCheckboxViewControllerDelegate即可。

class YourViewController: UIViewController, TNSwiftyCheckboxViewControllerDelegate {}

实现swiftyCheckboxViewController(viewController:checkedValueChangedTo:ofCheckboxModel:)方法

样式数据源

您可以通过将您的类设置为样式数据源来覆盖类的外观。这只是一个返回具有类型[String:AnyObject]的Dictionary。此字典的键在结构TNSwiftyCheckboxStyleOptions中定义。

例如

func styleDictionaryForCheckboxView() -> [String : AnyObject] {

    return [

    TNSwiftyCheckboxStyleOptions.CheckboxOuterColor : UIColor.redColor(),

    ]

}

便利属性

• uncheckedModels：返回所有当前处于未选中状态的TNSwiftyCheckboxModel对象数组

• checkedModels：返回所有当前处于已选中状态的TNSwiftyCheckboxModel对象数组

便利方法

TNSwiftyCheckboxGroup类有一些便利方法来询问您组的当前状态。

• areAllCheckboxesChecked：如果所有复选框都被选中，则返回bool类型
• areAllCheckboxesUnchecked：如果所有复选框都被未选中，则返回bool类型

创建自定义单元格

您还可以创建自己的复选框单元格并将它们注册到TNSwiftyCheckboxViewController。以下是您必须采取的步骤。

代码部分

1. 创建一个新类并从UICollectionViewCell派生出来。选中字段同时创建XIB文件。在这个例子中，我将类命名为TriangleCollectionViewCell。

2. 打开您的TriangleCollectionViewCell.swift文件

3. 在文件顶部添加导入语句

   import TNSwiftyCheckboxGroup
   

4. 将超类从 UICollectionViewCell 修改为 TNSwiftyCheckboxView

界面构建器部分

在继续之前，你现在可以在界面构建器中创建自己的复选框视图。

1. 将 对象库 中的 UIView 对象拖动到您的 XIB 文件中

2. 将 对象库 中的 UILabel 对象拖动到您的 XIB 文件中

3. 为它们设置约束

4. 在步骤 1 中创建的 UIView 上右键单击并从三角 Collection View 控制器拖动一个引用出口，并选择 checkboxContentView

5. 在步骤 2 中创建的 UILabel 上右键单击并从三角 Collection View 控制器拖动一个引用出口，并选择 nameLabel

6. 选择顶级视图（三角 Collection View Cell）并转到 属性检查器，添加一个 重用标识符。只需使用与您的类文件相同的方式命名（在本例中为 TriangleCollectionViewCell）

回到代码部分

现在，我们只需要将我们的自定义复选框类注册到 TNSwiftyCheckboxGroupViewController。您可以通过将 type 属性设置为 .Custom 并使用方法 registerCustomViewWithClassName(:) 注册您自己的类来完成此操作。

在您的自己的视图中添加以下代码。

let vc = segue.destinationViewController as! TNSwiftyCheckboxViewController
vc.type = .Custom
vc.registerCustomViewWithClassName("TriangleCollectionViewCell")
vc.checkboxModels = checkboxModels

如果您构建并运行，您将会看到自定义单元格出现。但您的类中还没有逻辑。有几个方法您可以覆盖来为您的单元格添加更多功能。

• setup()：在此方法中，您可以添加额外视图或添加动画。不要忘记在此方法的末尾调用 super.setup，这将自动设置 nameLabel。当然，如果您想自己这样做，不要调用 super.setup() :-)

• checkCheckbox( checkValue:withAnimation: )：此方法在单元格（未）被选中时被调用，是一个提供自定义（未）检查动画的好地方。

示例

要运行示例项目，克隆仓库，并首先从示例目录中运行 pod install。

安装

TNSwiftyCheckboxGroup 可以通过 CocoaPods 进行获取。要安装它，只需在 Podfile 中添加以下行即可

pod "TNSwiftyCheckboxGroup"

作者

Frederik Jacques, [email protected]

• 博客
• Twitter

许可

TNSwiftyCheckboxGroup 在 MIT 许可下提供。有关更多信息，请参阅 LICENSE 文件。