Versions Compared

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.

Author: Jindrich Dinga

1. Introduction

This document is the user experience specification for JavaFX RadioButton control. 


2. Interaction Design

A radio button represents an exclusive choice within a set of related options. Within a set of radio buttons, only one button can be ON at any given time. The following figure shows active radio buttons and inactive radio buttons in both ON and OFF states.

Figure 1 Radio Buttons
Image RemovedImage Added

When users click a radio button, its setting is always set to ON. An inner filled circle within the round button graphic indicates that the setting is selected. If another button in the set has previously been selected, its state changes to OFF. When a radio button is unavailable, users cannot change its setting.

...

Display radio button text to the right of the graphic unless the application is designed for locales with right-to-left writing systems, such as Arabic and Hebrew. In those locales, place the text to the left of the graphic.

 

Radio Button Menu Items

A radio button menu item is a menu item that appears with a radio button next to it to represent an OFF or ON setting. Each radio button menu item offers users a single choice within a set of radio button menu items, as illustrated in the following set of alignment options.

Figure 2 Radio Button Menu Items 
Image RemovedImage Added

 

Note that there is no difference in behavior of radio buttons on Desktop and Embedded, except that there is no mnemonic support on Embedded platforms.

 

3. Navigation

The following chapters describe how radio buttons are activated. Navigation for radio button menu items is described in the Menu UE Spec.

Mouse Support

The following table describes actions that are performed when users click on:

 Radio ButtonAction
State: ONNo action is performed.
State: OFFRadio button is set to ON. All other radio buttons are set to OFF.

Touch Support

The following table describes actions that are performed when users tap on:

 Radio ButtonAction
State: ONNo action is performed.
State: OFFRadio button is set to ON. All other radio buttons are set to OFF.

Directional Keys + OK/Select Support

The following table describes actions that are performed when a radio button is focused and users press the following keys:

 Action
UP/DOWN/LEFT/RIGHTMove focus up/down/left/right.
OK/SELECT[Focused radio button is set to ON] No action is performed.

[Focused radio button is set to OFF] Radio button is set to ON. All other radio buttons are set to OFF.

Keyboard Support

The following table describes actions that are performed when a radio button is focused and users press the following keys:

...