Checkbox(iOS)

There are 2 checkbox components, Checkbox and LabelCheckbox.

Checkbox is a square box that is empty, checked or has an intermediate state.

LabelCheckbox is a Checkbox with a Label. The label can be on the left or right side of the checkbox.

Empty Checkbox

let checkbox = Checkbox()

Empty LabelCheckbox

let labelCheckbox = LabelCheckbox(text: "This is a label checkbox")

Checked Checkbox

let checkbox = Checkbox()
checkbox.isSelected = true

Checked LabelCheckbox

let labelCheckbox = LabelCheckbox(text: "This is a label checkbox")
labelCheckbox.isSelected = true

Intermediate Checkbox

let checkbox = Checkbox()
checkbox.mark = .intermediate

Intermediate LabelCheckbox

let labelCheckbox = LabelCheckbox(text: "This is a label checkbox")
labelCheckbox.mark = .intermediate

hasError

I true, the checkbox will be red. Use this property if something’s wrong and the checkbox needs a user’s attention.

checkbox.hasError = true

If false, the user cannot interact with the checkbox and the checkbox will be gray.

checkbox.isEnabled = false

If true, the checkbox will be checked and blue.

checkbox.isSelected = false

Defines the mark displayed inside the checkbox. Can be either empty, checked or intermediate. The default value is empty.

checkbox.mark = .intermediate

This defines the width/height of the checkbox. The checkbox always has a square shape. The default value is 20.

checkbox.checkboxSize = 32

text

Sets the text of the label.

labelCheckbox.text = "This is a cool label checkbox!"

attributedText

Sets the attributed text of the label.

labelCheckbox.attributedText = attributedString

textStyle

Sets the text style of the label.

labelCheckbox.textStyle = .title1

contentInsets

Sets the content insets of the full control.

labelCheckbox.contentInsets = UIEdgeInsets(left: 10, top: 10, bottom: 10, right: 10)

If false, the user cannot interact with the checkbox and the control will be gray.

labelCheckbox.isEnabled = false

If true, the checkbox will be checked and blue.

labelCheckbox.isSelected = false

contentPlacement

Determines on what side of the checkbox the label is shown. The default value is .right.

labelCheckbox.contentPlacement = .left

numberOfLines

Determines the number of lines for the label. The default is 1. When set to 0 there will be as many lines as needed to display the full text.

labelCheckbox.numberOfLines = 0
labelCheckbox.text = "This is a checkbox label text that will spread out over multiple lines because this text is too big to fit on one line"

hasError

I true, the checkbox and label will be red. Use this property if something’s wrong and the control needs a user’s attention.

labelCheckbox.hasError = true

Defines the mark displayed inside the checkbox. Can be either empty, checked or intermediate. The default value is empty.

labelCheckbox.mark = .intermediate

This defines the width/height of the checkbox. The checkbox always has a square shape. The default value is 20.

labelCheckbox.checkboxSize = 32