Directory

LevelIndicator

Cellphone style level indicator

View larger

Close

View larger

Close

View larger

Close

Scalable cellphone style level indicator that can have customised amount of bars. Well suited for displaying data like battery or signal level.

Uses raphael4gwt for drawing. raphael4gwt is included in the add-on. The bars are filled red when less than third of the bars are set filled, yellow between one and two thirds filled and green when more than two thirds are filled.

Sample code

package test.app;

import org.vaadin.addon.levelindicator.Levelindicator;

import com.vaadin.server.VaadinRequest;
import com.vaadin.ui.Button;
import com.vaadin.ui.Button.ClickEvent;
import com.vaadin.ui.Label;
import com.vaadin.ui.UI;
import com.vaadin.ui.VerticalLayout;

/**
 * The Application's "main" class
 */
@SuppressWarnings("serial")
public class MyVaadinUI extends UI {

	@Override
	protected void init(VaadinRequest request) {
		final VerticalLayout layout = new VerticalLayout();
		layout.setMargin(true);
		setContent(layout);

		layout.addComponent(new Levelindicator(10, 5));
	}

}

Links

• Source Code
• raphael4gwt Homepage
• Online Demo
• Issue Tracker
• See also
• Usecase in a TouchKit application

Compatibility