Xavier has posted 3 posts at DZone. View Full User Profile

EaSynth Look And Feel Customization (2)

  • submit to reddit

Radio Button Customization

There are five states defined for radio button in EaSynth look and feel, the states and their appearance are shown below:


Nothing surprise here, EaSynth look and feel use the "RadioButton.icon" typical property to define the icon for each state. The xml code to define the radio button looks like:

<!-- The style for radio button. -->
<style id="Radio Button">
<property key="RadioButton.margin" type="insets" value="2 2 2 2"/>
<state value="ENABLED">
<imageIcon id="Radio_Button_Normal" path="resource/1204454221531_radio_enabled.png"/>
<property key="RadioButton.icon" type="idref" value="Radio_Button_Normal"/>
<state value="MOUSE_OVER">
<imageIcon id="Radio_Button_MouseOver" path="resource/1204454231234_radio_mouseover.png"/>
<property key="RadioButton.icon" type="idref" value="Radio_Button_MouseOver"/>
<state value="PRESSED">
<imageIcon id="Radio_Button_Pressed" path="resource/1204454241875_radio_pressed.png"/>
<property key="RadioButton.icon" type="idref" value="Radio_Button_Pressed"/>
<state value="DISABLED">
<imageIcon id="Radio_Button_Disabled" path="resource/1204121589843_radio_disabled.png"/>
<property key="RadioButton.icon" type="idref" value="Radio_Button_Disabled"/>
<state value="SELECTED">
<imageIcon id="Radio_Button_Selected" path="resource/1204454252156_radio_selected.png"/>
<property key="RadioButton.icon" type="idref" value="Radio_Button_Selected"/>
<bind style="Radio Button" type="region" key="RadioButton" />

So again it will be an easy job to custom the look of radio button: just change those image files.

Comparing with the checkbox button customization, we will find that the radio button has one more state: PRESSED. Can checkbox button also have a PRESSED state? The answer is positive. EaSynth look and feel omits the PRESSED state for checkbox button; it is just a decision for designing. We can custom the PRESSED state for checkbox button by adding a new state node with "PRESSED" value under the checkbox style node.

Published at DZone with permission of its author, Xavier Young.

(Note: Opinions expressed in this article and its replies are the opinions of their respective authors and not those of DZone, Inc.)