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
  • Radio Button Properties
  • GENERAL
  • DATA INSERTION
  • STYLING
  • INTERACTIVITY

Was this helpful?

  1. Components
  2. Controls

Radio Button

This article describes the radio button component and its properties.

PreviousCheckboxNextSlider

Last updated 3 months ago

Was this helpful?

Who can use this feature?

All Squirrel365 plans include the Radio Button 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 Radio Button allows a user to select one of several alternative options. The options can be laid out either vertically or horizontally:

Select Radio Button from the Controls category of the component library. Move the mouse over the canvas and click to add the component to your project:

Radio Button Properties


GENERAL

  • Ignore Blank Cells – Checked by default. If you bind the List Items property to a range of 10 cells, but only the first 8 contain data, then 8 labels will be added to the component. If this property is unchecked, 10 labels will be added to the component, but the captions of the last two labels (9 and 10) will be blank.

  • Orientation – By default, this property places the labels in a vertical line. Selecting Horizontal will change the same labels to a horizontal layout. (See the examples shown above.)

  • Spacing – This property, measured in pixels, is the amount of space between each label item.


DATA INSERTION

  • Insert data by – Choose between the radio button options of Series Type or Filtering Rows:

    • Series Type – If you select this option the component allows you to insert more than one series of data. This means that when a user selects an option, one or more series of data can be inserted into the spreadsheet. Series 1 could add Position data to a destination in the spreadsheet, Series 2 could copy a whole row of data from the spreadsheet and paste it into a destination row, Series 3 could insert a label, and so on, all triggered by one selection from the radio button.

    • Series – This property lists all of the series for the component. Add a new series by clicking on the plus button above the property field. Delete a series by selecting it and then clicking the trash icon.

    • Name – Rename the series if you wish by editing the name within the property field or by binding the name property to a cell in the spreadsheet. In both cases, the name of the series in the Series property field will be updated accordingly.

    • Source – If the type selected requires a source, this property will become enabled. Bind to a cell or range of cells in the spreadsheet that will supply the source data.

    • Destination – Bind to a cell or range of cells where the data will be inserted.

  • Filtering Rows – Selecting this option of the Insert data by property will change the appearance of the DATA INSERTION drawer. This option only allows for one series of data insertions to happen on selection.

    • Source – Select a range of rows as the source property.

    • Destination – Select a row for the selected source row to be pasted into. If the first item in the checkbox is selected then the first row of the source will be copied to the destination, if the second item is selected then the second row will be copied, and so on. Usually, the labels for the radio button will come from the first column of the rows but this does not need to be the case the insertion happens only based on the position of the labels and the rows in their respective ranges

    • Refresh On Data Change – Enabled by default, this will apply any changes in the source data to data that has been already inserted into cells bound to the Destination property. Uncheck if you don’t wish this to happen.


STYLING

The appearance of the Radio Button can be altered to suit a theme or particular style by using the STYLING properties.

LABEL TEXT

These properties apply to the text of the options in the component.

  • Font – Choose a font style for the labels

  • Size – Change the font size of the labels

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

  • Text Color – The labels will be shown in the color that matches the value entered in the property field.

    • Opacity – This determines the transparency of the labels.

  • Padding – Changing the value of this property changes the amount of space between the label caption and its border.

    • 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.

RADIO STYLE

These formatting properties apply to the selection dots of the radio buttons.

  • Size – This determines the size of the radio buttons. The value can be changed either using the slider or by entering a value into the input box. It is also possible to bind the input box value to a value in the spreadsheet.

  • Indicator dot – This property determines the color of the dot which indicates that a particular selection is active.

    • Opacity – This property determines the opacity of the indicator dot.

    • Indicator dot size – This property determines the size of the indicator dot. Use the slider to amend this property, or type a numerical value into the property field (note that this value cannot be greater than the size of the radio button itself.

UNCHECKED STYLE

These formatting properties can be used to apply a different style to unchecked buttons.

  • Fill – This property determines the color of the inside of the main radio circle.

    • Opacity – This property determines the opacity of the inside of the main radio circle.

  • Border – This property determines the color of the outline of the main radio circle.

    • Opacity – This property determines the opacity of the outline of the main radio circle.

  • Weight – This option determines the thickness of the outer circle

HOVER STATE

These formatting properties apply when the mouse cursor hovers over an item

  • Hover Text Colour – This property sets the text color.

    • Opacity – This changes the opacity of the text.

  • B I U – Use these toggle buttons (bold, italic, underline) to change the font format of the text. When toggled on, the button is blue (each of the options can be independently toggled on and off) :

SELECTED STATE

These formatting properties apply to the selected item of the Radio Button.

  • Selected Text Color – This property determines the color of the label text.

    • Opacity – This property determines the opacity of label text.

  • Fill – This property determines the color of the inside of the main radio circle.

    • Opacity – This property determines the opacity of the inside of the main radio circle.

  • Border – This property determines the color of the outline of the main radio circle.

    • Opacity – This property determines the opacity of the outline of the main radio circle.

  • Weight – This option determines the thickness of the outer circle


INTERACTIVITY

SELECTED ITEM

A new Radio Button will by default not have any option initially selected. It is possible to make one of the labels selected by default.

  • Selected Item – select Label or Position from the dropdown. Then bind the blank property field underneath to one of the following:

    • Label – one of the cells containing the label captions previously bound to the List Items property. This will become the default selection. You cannot select more than one option.

    • Position – a cell in the spreadsheet that contains a number equal to the position of the option that is to be selected by default i.e. 1 will select the first label bound to the List Items property, 2 will select the second label, and so on. Again, only one option can be selected by default.

DYNAMIC DISABLED STATE

It is possible to disable the Radio Button if you want to limit the user’s access to it.

The Radio Button properties are organized into GENERAL, DATA INSERTION, STYLING, INTERACTIVITY, and DYNAMIC VISIBILITY drawers. This guide will describe the general, data insertion, styling, and interactivity properties only; the dynamic visibility properties are generic 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.

List Items – This property can only be set by to a range of cells in the spreadsheet. The number of labels in the radio button will depend upon the number of cells that are bound to this property, the captions of the labels will correspond to the data in those cells.

Data insertion is triggered when a selection is made by the user. 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.

Type – Choose a data insertion type from the dropdown box. For more information about the types, take a look at Series Data Insertion in the Step-by-Step section of .

Bold Italics Underline selection panel

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

here
Set Property Values
binding
Getting Started: Data Insertion
this article on Data Insertion
this article
pricing comparison matrix
this article