Bixby Developer Center

A control component that is used in a form, which enables users to indicate a choice through a checkbox.

If there is only a single object that users can select, it is stylistically recommended to use a switch-input instead of a checkbox.

Examples

Here is a structure, which has a property favoriteColors that can be populated with a checkbox element in a form:

structure (Survey) {
  property (fullName) {
    type (FullName)
    min (Required) max (One)
  }
  property (email) {
    type(Email)
    min (Required) max(One)
  }
  property (comments) {
    type (Comments)
    min (Optional) max (One)
  }
  property (isSigningUp) {
    type (IsSigningUp)
    min (Required) max (One)
  }
  property (favoriteColors) {
    type (FavoriteColors)
    min (Required) max (One)
  }
  property (funMeter) {
    type (FunMeter)
    min (Required) max (One)
  }
  property (age) {
    type (Age)
    min (Required) max (One)
  }
}

View master on GitHub

For the input view of a checkbox:

input-view {
  match {
    FavoriteColors (favoriteColors) { 
      to-input: SubmitSurvey
    }
  }

  message {
    template ("What are your favorite colors?")
  }

  render {
    form {
      elements {
        checkbox {
          id (isRed)
          type (viv.core.Boolean)
          primary-text("Red")
        }
        checkbox {
          id (isBlue)
          type (viv.core.Boolean)
          primary-text("Blue")
        }
        checkbox {
          id (isGreen)
          type (viv.core.Boolean)
          primary-text("Green")
        }
        checkbox {
          id (isYellow)
          type (viv.core.Boolean)
          primary-text("Yellow")
        }
      }
      on-submit {
        goal: FavoriteColors
        value: FavoriteColors {
          isRed: viv.core.FormElement(isRed)
          isBlue: viv.core.FormElement(isBlue)
          isGreen: viv.core.FormElement(isGreen)
          isYellow: viv.core.FormElement(isYellow)
        }
      }
    }
  }
}

View master on GitHub

You can run the sample capsule in the Simulator to see how this component displays on different devices, if supported.