Docs

You are viewing documentation for an older Vaadin version. View latest documentation

Docs

Button

Live Demo

The Button component is normally used for initiating some action, such as finalizing input in forms. When the user clicks a button, a Button.ClickEvent is fired, which can be handled with a Button.ClickListener in the buttonClick() method.

You can handle button clicks with an anonymous class as follows:

Button button = new Button("Do not press this button");

button.addClickListener(new Button.ClickListener() {
    public void buttonClick(ClickEvent event) {
        Notification.show("Do not press this button again");
    }
});

// Java 8
button.addClickListener(click ->
    Notification.show("Do not press this button again"));

See the on-line example.

The listener can also be given in the constructor, which is often perhaps simpler.

The button component can be styled in many ways, as illustrated in Button in Different Styles of Valo Theme.

button example1
Button in Different Styles of Valo Theme

If you handle several buttons in the same listener, you can differentiate between them either by comparing the Button object reference returned by the getButton() method of Button.ClickEvent to a kept reference. For a detailed description of these patterns together with some examples, please see "Events and Listeners".

CSS Style Rules

.v-button { }
  .v-button-wrap { }
    .v-button-caption { }

A button has an overall v-button style. The caption has v-button-caption style. There is also an intermediate wrap element, which may help in styling in some cases.

Some built-in themes contain a small style, which you can enable by adding Reindeer.BUTTON_SMALL, etc. The BaseTheme also has a BUTTON_LINK style, which makes the button look like a hyperlink.