Search
Dashboard Layout

The Dashboard class is the class you use when you want to create a dashboard. The hierarchy of dashboard's components starts from its RootPanel. By default, the RootPanel contains an ImageComponent for drawing a BackgroundImage, and the LayoutPanel where you  add objects that participate in layout and are placed relatively to each other:

Java  Copy Code

TextComponent title = new TextComponent();
title.setHorizontalAlignment(LayoutAlignment.Center);
title.setText("Popular Web Apps");
title.setMargin(new Margins(10));
........
dashboard.getLayoutPanel().getChildren().add(title);

The Dashboard class can be paired with the powerful LayoutBuilder class that creates a variety of predefined GridPanel and StackPanel instances some of which might contain AxisRenderer and Plot instances.

Java  Copy Code

Dashboard dashboard = new Dashboard();
LayoutBuilder builder = new LayoutBuilder(dashboard);
....................................
GridPanel linePanel = builder.createAndAddPlotWithBottomAndLeftAxes
   (linePlot, linePlotXRenderer, linePlotYRenderer);

The LayoutBuilder takes care of the dynamic alignment of its Component-s. Use the method of your choice to create a Plot with axis at given positions - left, right, top and bottom. The LayoutBuilder takes care of setting the various alignment and orientation properties to achieve and maintain the chosen layout.

The major part of a Dashboard is taken by Panel-s that render and arrange graphical elements. You can choose among:

  • SimplePanel that arranges its children on top of each other and can be useful for hosting overlapping components with transparent regions.
  • StackPanel that arranges its children in horizontal or vertical stacks.
  • GridPanel that arranges its children in a grid of rows and columns. The target cell of a component inside a GridPanel is specified via its GridRow and GridColumn properties.

Java  Copy Code

GridPanel pnlGrid = new GridPanel();
pnlGrid.getColumns().add(new GridColumn());
pnlGrid.getRows().add(new GridRow());

TextComponent barText = new TextComponent();
barText.setGridRow(0);
barText.setGridColumn(1);
.......................
pnlGrid.getChildren().add(barText);
dashboard.getLayoutPanel().getChildren().add(pnlGrid);

You can add your own components and panels to any of the pre-defined panels listed above.

Chart and its derived classes automatically add PlotPanel to LayoutPanel to host Plot, AxisRenderer and ImageComponent for PlotImage.

Here is a sample Dashboard that illustrates a possible layout of various Component-s, Panel-s and Renderer-s: