From JAXXWiki

This example program creates a number of components which are used to control the appearance of a JLabel. Everything is performed through data binding; there are no script tags or explicit event handlers anywhere.

Screen shot

letovar

See it in action

To run this example in Java Web Start, click the following link:

To compile and run it yourself, first follow the instructions for installing JAXX. Then download and save the source code using the link below. Once you have done that, compile and run it as follows:

c:\jaxx\examples> jaxxc LabelStyle.jaxx
c:\jaxx\examples> java -classpath .;c:\jaxx\lib\jaxx-runtime.jar LabelStyle

The first command above assumes that you are in the directory containing the LabelStyle.jaxx file. Compiling it as shown will produce a class file named LabelStyle.class in the current directory, and because you were in the same directory as the JAXX file the resulting class will not be placed in a package (its fully-qualified name is just LabelStyle).

At this point LabelStyle is a perfectly ordinary Java class, and the only special requirement to run it is that jaxx-runtime.jar be in the classpath.

Source code

Download the source code: LabelStyle.jaxx

<Application title="LabelStyle.jaxx">
  <style source="LabelStyle.css"/>

  <Table anchor='north' fill='both'>
    <row>
      <cell weightx='1' weighty='1' insets='6, 3, 0, 0'>
        <Table anchor='west' fill='both'>
          <row>
            <cell><JLabel text='Text:'/></cell>
            <cell weightx='1'><JTextField id='text' text='Data Binding'/></cell>
          </row>
        
          <row>
            <cell><JLabel text='Red:'/></cell>
            <cell><JSlider id='red' value='128' maximum='255' styleClass='color'/></cell>
          </row>
          
          <row>
            <cell><JLabel text='Green:'/></cell>
            <cell><JSlider id='green' value='0' maximum='255' styleClass='color'/></cell>
          </row>
        
          <row>
            <cell><JLabel text='Blue:'/></cell>
            <cell><JSlider id='blue' value='255' maximum='255' styleClass='color'/></cell>
          </row>
          
          <row>
            <cell><JLabel text='Size:'/></cell>
            <cell><JSlider id='size' value='36' minimum='6' maximum='60'/></cell>
          </row>
            
          <row>
            <cell columns='2' fill='both' weighty='1'>
              <JPanel border='{BorderFactory.createTitledBorder("Preview")}'
                      height='90'
                      layout='{new BorderLayout()}'>
                <VBox background='{backgroundCheckbox.isSelected() ? backgroundColor.getSelectedValue() : null}' 
                      margin='0'
                      horizontalAlignment='center'
                      verticalAlignment='middle'>
                  <JLabel text='{text.getText()}' font-size='{size.getValue()}' foreground='{new Color(red.getValue(), green.getValue(), blue.getValue())}'/>
                </VBox>
              </JPanel>
            </cell>
          </row>
        </Table>
      </cell>
      
      <cell>
        <VBox spacing='0' border='{BorderFactory.createTitledBorder("Background")}'>
          <JCheckBox id='backgroundCheckbox' text='Show Background'/>
          <JRadioButton text='Red'    buttonGroup='backgroundColor' value='{Color.RED}'    selected='true'/>
          <JRadioButton text='Orange' buttonGroup='backgroundColor' value='{Color.ORANGE}'/>
          <JRadioButton text='Yellow' buttonGroup='backgroundColor' value='{Color.YELLOW}'/>
          <JRadioButton text='Green'  buttonGroup='backgroundColor' value='{Color.GREEN}'/>
          <JRadioButton text='Cyan'   buttonGroup='backgroundColor' value='{Color.CYAN}'/>
          <JRadioButton text='Blue'   buttonGroup='backgroundColor' value='{Color.BLUE}'/>
          <JRadioButton text='Purple' buttonGroup='backgroundColor' value='{new Color(160, 30, 255)}'/>
        </VBox>
      </cell>
    </row>
  </Table>
</Application>

Stylesheet: LabelStyle.css

JSlider {
    paintTicks: true;
}

JSlider.color {
    minorTickSpacing: 10;
    majorTickSpacing: 50;
    border: { BorderFactory.createEmptyBorder(1, 1, 1, 1) };
}

JSlider.color:focused {
    border: { BorderFactory.createLineBorder(Color.BLACK, 1) };
}

JSlider#red:focused {
    background: #E7ADAD;
}

JSlider#green:focused {
    background: #B2E7AD;
}

JSlider#blue:focused {
    background: #ADB2E7;
}

JSlider#size {
    minorTickSpacing: 2;
    majorTickSpacing: 6;
}

JRadioButton {
    enabled: { backgroundCheckbox.isSelected() };
}