JFoenix中文教程：6、JFXRadioButton单选框组件

JFoenix提供的弹窗组件为JFXRadioButton，JFXRadioButton样式如下：

对应源码如下：

<HBox spacing="100" maxWidth="400" maxHeight="300" alignment="BASELINE_CENTER">
	<VBox spacing="40">
		<children>
			<Label styleClass="radio-button-title-label">默认单选框</Label>
			<JFXRadioButton selected="true" text="选项一" styleClass="custom-jfx-radio-button">
				<toggleGroup>
					<ToggleGroup fx:id="toggleGroup_1"/>
				</toggleGroup>
			</JFXRadioButton>
			<JFXRadioButton selected="false" text="选项二" toggleGroup="$toggleGroup_1"/>
			<JFXRadioButton selected="false" text="选项三" toggleGroup="$toggleGroup_1"/>
		</children>
	</VBox>
	<VBox spacing="40">
		<children>
			<Label styleClass="radio-button-title-label">自定义样式单选框</Label>
			<JFXRadioButton fx:id="radio_1" text="选项一" style="-jfx-selected-color: #5264AE; -jfx-unselected-color: #212121; -fx-text-fill: #5264AE;">
				<toggleGroup>
					<ToggleGroup fx:id="toggleGroup_2"/>
				</toggleGroup>
			</JFXRadioButton>
			<JFXRadioButton fx:id="radio_2" selected="true" text="选项二" toggleGroup="$toggleGroup_2"
							style="-jfx-selected-color: #f44336; -jfx-unselected-color: #b71c1c; -fx-text-fill: #f44336;"/>
			<JFXRadioButton fx:id="radio_3" text="选项三" toggleGroup="$toggleGroup_2"
							style="-jfx-selected-color: #4caf50; -jfx-unselected-color: #1b5e20; -fx-text-fill: #4caf50;"/>
		</children>
	</VBox>
</HBox>

其中，toggleGroup 标签用于定义单选框的组，相同组的单选框通过 toggleGroup="$XX" 来限定。

同 JFXCheckBox 多选框一样，JFXRadioButton 提供了两个自定义属性：

-jfx-checked-color

用于定义多选框选中时的颜色，默认是：#0F9D58（绿色系）

 

-jfx-unchecked-color

用于定义多选框未选中时的颜色，默认是：#5A5A5A（黑色系）