LogoLogo
FeaturesHelp & ResourcesShowcasePricingLogin
Learn Section
Learn Section
  • Introduction
  • Getting Started
    • Finding your way around
    • Core concepts
      • Data Binding
      • Data Insertion
      • Dynamic Visibility
    • Creating and managing projects
      • Creating a Project
      • Saving a Project
      • Opening a Project
      • Version History
    • Templates
  • Components
    • Overview
    • Layout & Positioning
    • Charts
      • Line Chart
      • Column Chart
      • Bar Chart
      • Pie Chart
      • Combination Chart
      • Area Chart
      • Spline Chart
      • Step Chart
    • DataViz
      • Gauge
      • Word Cloud
      • Chord Diagram
      • Sankey Diagram
      • Schedule (Gantt)
      • Metric Tile
      • Progress Bar
      • Trend Icon
      • Mapbox
      • Loading Animation
    • Tables
      • Scorecard
      • Data Table
    • Controls
      • Push Button
      • Dropdown
      • Multi Select Dropdown
      • Listbox
      • Label Based Menu
      • Checkbox
      • Radio Button
      • Slider
      • Value Input
      • Print Button
      • URL Button
      • Screenshot
      • Hotspot
      • Date Picker
      • Toggle Switch
      • Scenario
    • Text
      • Text Label
      • Text Input
      • Text Area
    • Shapes
      • Rectangle
      • Ellipse
      • Line
    • Media
      • Image
      • Icon
    • Containers
      • Container
      • Web View
      • Repeat Container
      • Row Layout
      • Column Layout
  • Functions
    • Overview
    • Data Mover
    • External Parameters
    • Export to Excel
    • Export to PDF
    • Timer
    • Tableau Parameters
    • Browser Info
    • TextJoin
    • Unique List
  • Connections
    • Overview
    • Excel One Drive
      • Excel One Drive Read
      • Excel One Drive Writeback
    • Google Sheets
      • Google Sheets Read
      • Google Sheets Writeback
    • Ninox Connections
    • Smartsheets
    • CSV Connector
    • SAP Webi Connector
    • XDC Connections
    • Database Connections
    • Zapier Trigger
  • Spreadsheet
    • Overview
    • Spreadsheet functionality
    • Supported Spreadsheet Functions
    • Spreadsheet performance
  • Best practices for the Squirrel spreadsheet
  • Publishing & Sharing
    • Overview
    • Project Settings
    • Publishing to Squirrel Cloud
    • Publishing Locally
    • Using the Project Manager
    • Adding projects to PowerPoint
    • Adding projects to Tableau
    • Progressive Web Apps (PWA)
  • SETTINGS
    • Image Library
    • Custom Fonts
  • Account Management
    • Manage your account Profile
    • Understanding your Squirrel plan usage
    • Changing your Plan
    • Billing
    • How do I delete my account?
  • Frequent Questions
    • What data do you keep and for how long?
  • How-Tos
    • Overview
    • Add-ons
      • Add-on Documentation
      • Window Size – Add responsive behavior to your components
      • Window Size - Getting responsive behavior in the canvas
    • Adding your own Google Fonts
    • Chart title and Checkbox label text case formatting
    • Deleting functions and connections
    • Find & Replace Fonts
    • Getting a Mapbox API access token
    • Renaming a component, function or connection
    • Seeing Data from a Connector at Design time
    • Troubleshooting Projects in the Console
    • Using colors and color values
  • Tutorials
    • Create a temperature conversion app
    • Create a revenue growth app from an existing spreadsheet
    • Whack-A-Squirrel Game
    • Filtered Rows Insertion: Building a Filtered Selection
Powered by GitBook
LogoLogo

Explore

  • Home
  • Features
  • Pricing
  • Download Squirrel

Help

  • Learn
  • Community
  • Support
  • FAQ's

Updates

  • Blog
  • Events
  • Release Notes

Company

  • Contact Us
  • Privacy Policy
  • Terms of Use

Copyright © 2019 - 2024 InfoSol Ltd. All rights reserved.

On this page
  • Checkbox Properties
  • DATA INSERTION
  • CHECKBOX STYLING
  • INTERACTIVITY

Was this helpful?

  1. Components
  2. Controls

Checkbox

This article describes the Checkbox component and its properties.

PreviousLabel Based MenuNextRadio Button

Last updated 3 months ago

Was this helpful?

Who can use this feature?

All Squirrel365 plans include the Checkbox component.

For more details, see our .

Squirrel 1.12 introduced a “Quick Set-up” tab on many property panels. The properties described on this page are available on the “All Properties” tab of the property panel. For more details on “Quick Set-Up” properties see

The Checkbox component allows the user to select or deselect a single option. Multiple Checkbox components can be positioned together but they are not linked:

Select Checkbox from the controls category of the component library. Move the mouse over the canvas and click to add a Checkbox component to your project:

Checkbox Properties


DATA INSERTION

  • Source – This property requires two values. If it isn’t bound to a source, the defaults of unchecked and checked will be used. If you do bind to a source, you will need to add two values into two adjacent cells and bind the source property to both cells. Place the unchecked value in the first source cell and the checked value in the second source cell. For a check box that asks if a user wishes to sign up to receive a newsletter, the source values could be Not subscribed/Subscribed, a check box requesting permission to store personal data could use Declined/Granted, or it could just be a simple No/Yes or the default unchecked/checked.

  • Destination – Bind to a single, empty cell that will receive the checked or unchecked value (or other source values) relating to the current state of the check box component.

CHECKBOX STYLING

The appearance of the Checkbox component can be altered to suit a theme or particular style by using the CHECKBOX STYLING properties.

Checkbox Size – Increase or decrease the value of this property to increase or decrease the size of the square checkbox area.

LABEL TEXT

The following properties apply to the Checkbox component text label.

  • Label Text – Type in a label value for the Checkbox or bind to one in the spreadsheet.

  • Font – Choose a font style for the checkbox label from the dropdown list

  • Size – Change the font size of the label

  • B I U – Use these toggle buttons (bold, italic, underline) to change the format of the label. When toggled on, the button is blue:

  • Position – Select from the dropdown list. The checkbox label will move to a corresponding position relative to the checkbox.

  • Padding – Increase to add more space between the checkbox and the checkbox label.

    • Individual Padding - selected this property to apply different amounts of padding to each of the component's edges. Each of these individual inputs can be manually edited or bound to the spreadsheet.

If you don’t require a label in your Checkbox component uncheck the checkbox adjacent to the LABEL TEXT section heading to remove it.

MARKER

These formatting properties apply to the icon used inside the checkbox to indicate it is being checked or unchecked.

  • Mark Type – Select an icon preference from the dropdown list, and choose from Tick, Cross, or Dot.

  • Mark Color – Determines the color of the icon used inside the checkbox.

    • Opacity – This determines the transparency of the icon used inside the checkbox.

UNCHECKED STYLE

These formatting properties apply to the unchecked checkbox component.

  • Unchecked Text Color – This property sets the label text color.

    • Opacity – This changes the opacity of the label text.

  • Fill – This property sets the background color of the checkbox. Uncheck if a fill color is not required.

    • Opacity – This changes the opacity of the checkbox.

  • Border – This property sets the border color of the checkbox.

    • Weight – This changes the line thickness of the checkbox border.

      • Individual Weight - selected this property to apply different widths to each of the component's borders. Each of these individual inputs can be manually edited or bound to the spreadsheet.

    • Line style – Select a checkbox border line style. The options are solid and dashed:

    • Corners – This property determines the corner radius of the checkbox border. Use the slider to amend this property, or type a numerical value into the property field.

      • Individual Corners - selected this property to apply different radii to each of the component's corners. Each of these individual inputs can be manually edited or bound to the spreadsheet.

CHECKED STYLE

These formatting properties apply if the checkbox is checked.

  • Checked Text Color – This property sets the label text color.

    • Opacity – This changes the opacity of the label text.

  • Fill – This property sets the background color of the checkbox. Uncheck if a fill color is not required.

    • Opacity – This changes the opacity of the checkbox.

  • Border – This property sets the border color of the checkbox.

    • Weight – This changes the line thickness of the checkbox border.

      • Individual Weight - selected this property to apply different widths to each of the component's borders. Each of these individual inputs can be manually edited or bound to the spreadsheet.

    • Line style – Select a checkbox border line style. The options are solid and dashed:

    • Corners – This property determines the corner radius of the checkbox border. Use the slider to amend this property, or type a numerical value into the property field.

      • Individual Corners - selected this property to apply different radii to each of the component's corners. Each of these individual inputs can be manually edited or bound to the spreadsheet.

HOVER STATE

These formatting properties can be used to apply a different style to the Checkbox component when the user’s mouse is positioned over it.

  • Hover Text Color – This property sets the color that the label text will change to when the mouse is positioned over the component.

    • Opacity – This changes the opacity of the label text.

INTERACTIVITY

LABEL INTERACTION

Allow Label Click – a simple check box property that allows the user to click on the label text to check or uncheck the Checkbox component as well as the check box. The default setting is on, uncheck to turn it off.

DYNAMIC DISABLED STATE

It is possible to disable the Checkbox component if you want to limit the user’s interaction with the Checkbox component for any reason.

SELECTED ITEM

Selected Item – A new Checkbox component will by default be checked. Select Unchecked from the dropdown list to change the default setting to unchecked.

To bypass the Selected Item property or to set the default state of the Checkbox component dynamically, bind the blank property field beneath the Selected Item property to a cell in the spreadsheet that contains either checked or unchecked or a formula that will produce either value.

Ensure that checked or unchecked is written in lower caps.

The Checkbox properties consist of DATA INSERTION, CHECKBOX STYLING, INTERACTIVITY, and DYNAMIC VISIBILITY sections. We’ll cover the first 3 here as dynamic visibility properties are generic to each component and a separate guide and tutorial on dynamic visibility can be found .

The component properties are set and edited using different methods, some have multiple methods, some just one. See this article for more information on using the different methods.

Data insertion is triggered when the user checks or unchecks the Checkbox. As data insertion is one of the core concepts within Squirrel, if you aren’t sure what it is, take a look at the tutorial for more information.

Bold Italics Underline selection panel

Capitalization rules – Click to apply a rule to the checkbox label. Click again to remove the rule. Only one rule can be applied at any one time. (See this article on how to for more info.)

Line styles
Line styles

The DYNAMIC DISABLED STATE property utilizes Conditional Logic. For more information on Conditional Logic and its uses, see .

here
Set Property Values
Getting Started: Data Insertion
Use the capitalization rules
this article
pricing comparison matrix
this article