Scroll Pane and Link Container Screen Components

Introduction

Radiobuttons allow selecting a single option from a set of options. This feature distinguishes them from other Screen Components such as the Checkbox. Both the Checkbox and the Radiobutton Screen Components are used for a small or medium number of options, compared to other components such as the Dropdown List, which is used for lists with a larger number of options. Two Radiobutton Screen Components are available: Radiobutton and Radiobutton List.

Radiobutton Screen Component

Radiobutton Configuration

Properties Tab:

  • Group Name – Name of the group the Radiobutton belongs to.
  • Group Value – Value stored in the Data Property if this Radiobutton has been selected by the user.
  • Label – The text to be displayed on the right side of the Radiobutton.

Radiobutton groups are virtual collections of Radiobutton Components, linked to each other by the same group name. All Radiobuttons with the same value for Group Name build such a group. Only one of these Radiobuttons can be active at a given time. All the Radiobuttons belonging to the same group should have unique values for the Group Value and should all be bound to the same Data Property. Otherwise, unexpected behavior and results may occur.

Note: if you set the Use Legacy Style option, the Alignment legacy property becomes available in the Properties tab. From Appway 7 onwards, this styling property are replaced by the Radiobutton Style Business Object.

Actions Tab: If an Action is executed when a Radiobutton is selected, this Action has to be defined on all the Radiobuttons that belong to the same group. Otherwise, the Action is executed only if the Radiobutton defining the Action is selected.

For complete information on Actions, see the General Properties article.

Other Configuration Tabs: For information on other configuration properties (Converter, Validators), see the Screen Components: Properties article.

If no Radiobutton is selected, `null` is submitted to the server.

Radiobutton List Screen Component

A Radiobutton List presents the user with several options. The Radiobutton List allows only one option to be active at any given time.

Radiobutton List Configuration

Properties Tab

Radiobutton List properties are:

  • Orientation – Whether the options are distributed horizontally or vertically.
  • Alignment – Alignment of the text labels relative to the Radiobuttons.

Data Source Tab

Radiobutton Lists need Data Sources that specify the options shown in the list.

For information on Data Sources, see the Data Sources Tab section in the Screen Components: Properties article.

Other Configuration Tabs

For information on other configuration properties (Converter, Validators), see the Screen Components: Properties article.

If no Radiobutton is selected, `null` is submitted to the server.

Radiobutton and Radiobutton List Style Business Object

The Radiobutton and Radiobutton List Style Business Objects allow styling radiobuttons and radiobutton lists consistently.

States

The Radiobutton and Radiobutton List Style Business Objects have the following states:

  • Default
  • Disabled
  • ReadOnly (only for the Radiobutton List Style Business Object)
  • Error

Styling Properties

  • Inner Spacing: defines the space between the element inside the Radiobutton or Radiobutton List and the border.
  • Outer Spacing: defines the space between the element outside the Radiobutton or Radiobutton List and the border.
  • Text: refers to a Text Style Business Object to define style of the option displayed next to each radiobutton.
  • Radio: refers to a RadioInput (virtual) Style Business Object to define the style (outline and spacing) of the radiobuttons.
  • Error Box (virtual): refers to an ErrorBox (virtual) Style Business Object to define the style of the error message when in Error state.

Radio Input (Virtual) Style Business Object

States The Radio Input (Virtual) Style Business Object has the following states:

  • Default
  • Disabled
  • ReadOnly
  • Error

Styling Properties

  • Outline: defines the color of the radio button outline.
  • Outer Spacing: defines the space between the radio button and the outside element.

For more information on Style Business Objects and styling properties, refer to the Style Business Object article.