Compositing Components

This section discusses extending existing components and compositing components together to create new reusable components. This approach does not require the developer to create any HTML/JavaScript rendering code.

Extending

If you have developed an Echo application, you have probably already created a composite component by extending one of Echo's built-in components. The simple example below shows such a case:

public class GreenButton extends Button {
    public GreenButton(String text) {
        super(text);
        setForeground(Color.BLACK);
        setBackground(Color.GREEN);
    }
}

The above component is a button that will display black text on a green background. This example, while trivial and having little real world application, is nevertheless a legitimate new component.

Compositing

Custom components can also be created by extending a base component and adding children to it. The following example shows a component, AlertDialog, which extends WindowPane and adds several components to it to create a custom reusable dialog window.

public class AlertDialog extends WindowPane {
    public AlertDialog(String message) {
        setModal(true);
        SplitPane sp = new SplitPane(SplitPane.ORIENTATION_VERTICAL_BOTTOM_TOP);
        sp.setSeparatorPosition(32);
        add(sp);
        Button okButton = new Button("Ok");
        okButton.addActionListener(new ActionListener({
            public void actionPerformed(ActionEvent e) {
                getParent().remove(this);
            }
        });
        sp.add(okButton);
        sp.add(new Label(message);
    }
}