Checkboxes

The following example demonstrates how to use the Checkbox class in a Pivot application. Selecting a checkbox shows or hides an associated icon:

The BXML source for the example is below:

            
            <Window title="Checkboxes" maximized="true"
                xmlns:bxml="http://pivot.apache.org/bxml"
                xmlns="org.apache.pivot.wtk">
                <TablePane styles="{showHorizontalGridLines: true, showVerticalGridLines:true,
                    padding:4, horizontalSpacing:1, verticalSpacing:1,
                    horizontalGridColor:10, verticalGridColor:10}">
                    <columns>
                        <TablePane.Column width="-1"/>
                        <TablePane.Column width="24"/>
                    </columns>

                    <TablePane.Row height="24">
                        <BoxPane styles="{verticalAlignment:'center'}">
                            <Checkbox buttonData="Bell"
                                ButtonPressListener.buttonPressed="bellImageView.setVisible(!bellImageView.isVisible());"/>
                        </BoxPane>
                        <ImageView bxml:id="bellImageView" image="/org/apache/pivot/tutorials/bell.png" visible="false"/>
                    </TablePane.Row>

                    <TablePane.Row height="24">
                        <BoxPane styles="{verticalAlignment:'center'}">
                            <Checkbox buttonData="Clock"
                                ButtonPressListener.buttonPressed="clockImageView.setVisible(!clockImageView.isVisible());"/>
                        </BoxPane>
                        <ImageView bxml:id="clockImageView" image="/org/apache/pivot/tutorials/clock.png" visible="false"/>
                    </TablePane.Row>

                    <TablePane.Row height="24">
                        <BoxPane styles="{verticalAlignment:'center'}">
                            <Checkbox buttonData="House"
                                ButtonPressListener.buttonPressed="houseImageView.setVisible(!houseImageView.isVisible());"/>
                        </BoxPane>
                        <ImageView bxml:id="houseImageView" image="/org/apache/pivot/tutorials/house.png" visible="false"/>
                    </TablePane.Row>
                </TablePane>
            </Window>
            
        

Note that this example uses the TablePane layout container. TablePane defines a two-dimensional grid structure and is similar to an HTML table. It is discussed in more detail in the Layout Containers section.

Also note the use of script code to respond to button press events fired by the checkboxes. The ButtonPressListener.buttonPressed attribute of each component contains JavaScript code that toggles the visibility of the corresponding image view, causing the image to appear and disappear based on the checkbox's selection state. It is common in Pivot development to implement simple event handlers in script code this way, since it can often be much less verbose than performing the same logic in Java.

In fact, since all of the logic for this application is implemented in script, there is no Java source associated with this example.