Question

In this part of the Java SWT tutorial, we present the Table widget. Table is a two-dimensional grid of cells. It is possible to write data into each of these cells. The widget was introduced by spreadsheet applications.

Table can display column headers, and when there are a lot of cells, Table can show scrollbars.

Empty table

The first example creates a simple, empty table.

TableEx.java

package com.zetcode;

import org.eclipse.swt.SWT;
import org.eclipse.swt.layout.GridData;
import org.eclipse.swt.layout.GridLayout;
import org.eclipse.swt.widgets.Display;
import org.eclipse.swt.widgets.Shell;
import org.eclipse.swt.widgets.Table;
import org.eclipse.swt.widgets.TableColumn;
import org.eclipse.swt.widgets.TableItem;

/**
 * ZetCode Java SWT tutorial
 *
 * In this program, we create a simple, empty
 * table widget.
 *
 * Author: Jan Bodnar
 * Website: zetcode.com
 * Last modified: June 2015
 */

public class TableEx {

  public TableEx(Display display) {

    initUI(display);
  }

  @SuppressWarnings("unused")
  private void initUI(Display display) {

    Shell shell = new Shell(display);
    shell.setLayout(new GridLayout());

    Table table = new Table(shell, SWT.BORDER);
    table.setHeaderVisible(true);
    table.setLinesVisible(true);

    GridData data = new GridData(SWT.FILL, SWT.FILL, true, true);
    data.heightHint = 300;
    data.widthHint = 350;
    table.setLayoutData(data);

    String[] titles = { "A", "B", "C" };

    for (int i = 0; i < titles.length; i++) {
      TableColumn column = new TableColumn(table, SWT.CENTER);
      column.setWidth(120);
      column.setText(titles[i]);
    }

    for (int i = 0; i < 15; i++) {
      TableItem item = new TableItem(table, SWT.NONE);
    }

    shell.setText("Empty table");

    shell.pack();
    shell.open();

    while (!shell.isDisposed()) {
      if (!display.readAndDispatch())
        display.sleep();
    }
  }

  @SuppressWarnings("unused")
  public static void main(String[] args) {

    Display display = new Display();
    TableEx ex = new TableEx(display);
    display.dispose();
  }
}

The code example creates a table widget with three columns and fifteen rows. The table cells are empty.

Table table = new Table(shell, SWT.BORDER);

An instance of a Table widget is created.

table.setHeaderVisible(true);

The setHeaderVisible() makes the table header visible. The header consists of table column names.

table.setLinesVisible(true);

The setLinesVisible() displays the borders of the table cells. By default, the cells are not visible.

String[] titles = { "A", "B", "C" };

These are the column titles.

for (int i = 0; i < titles.length; i++) {
  TableColumn column = new TableColumn(table, SWT.CENTER);
  column.setWidth(120);
  column.setText(titles[i]);
}

In this for loop, we create the table columns. Instances of TableColumn represent a column in a table widget. The setWidth() sets the width of the column, and the setText() method sets the column name.

for (int i = 0; i < 15; i++) {
  TableItem item = new TableItem(table, SWT.NONE);
}

TableItem represents a row in the table. This code creates fifteen empty cells.

Figure: Empty table

Filling cells with data

In the second example, the table cells show some data.

TableEx2.java

package com.zetcode;

import org.eclipse.swt.SWT;
import org.eclipse.swt.layout.FillLayout;
import org.eclipse.swt.widgets.Display;
import org.eclipse.swt.widgets.Shell;
import org.eclipse.swt.widgets.Table;
import org.eclipse.swt.widgets.TableColumn;
import org.eclipse.swt.widgets.TableItem;

/**
 * ZetCode Java SWT tutorial
 *
 * In this program, we fill table cells
 * with data.
 *
 * Author: Jan Bodnar
 * Website: zetcode.com
 * Last modified: June 2015
 */

public class TableEx2 {

  public TableEx2(Display display) {

    initUI(display);
  }

  private void initUI(Display display) {

    Shell shell = new Shell(display, SWT.SHELL_TRIM | SWT.CENTER);
    shell.setLayout(new FillLayout());

    Table table = new Table(shell, SWT.BORDER);
    table.setHeaderVisible(true);
    table.setLinesVisible(true);
    
    TableColumn tc1 = new TableColumn(table, SWT.CENTER);
    TableColumn tc2 = new TableColumn(table, SWT.CENTER);
    TableColumn tc3 = new TableColumn(table, SWT.CENTER);

    tc1.setText("First Name");
    tc2.setText("Last Name");
    tc3.setText("Profession");

    tc1.setWidth(70);
    tc2.setWidth(70);
    tc3.setWidth(80);

    TableItem item1 = new TableItem(table, SWT.NONE);
    item1.setText(new String[] { "Jane", "Brown", "Accountant" });
    TableItem item2 = new TableItem(table, SWT.NONE);
    item2.setText(new String[] { "Tim", "Warner", "Lawyer" });
    TableItem item3 = new TableItem(table, SWT.NONE);
    item3.setText(new String[] { "Bob", "Milton", "Police officer" });

    shell.setText("Table widget");
    shell.pack();
    shell.open();

    while (!shell.isDisposed()) {
      if (!display.readAndDispatch())
        display.sleep();
    }
  }

  @SuppressWarnings("unused")
  public static void main(String[] args) {

    Display display = new Display();
    TableEx2 ex = new TableEx2(display);
    display.dispose();
  }
}

The example shows a table widget with three columns and three rows. The cells are filled with data.

TableItem item1 = new TableItem(table, SWT.NONE);
item1.setText(new String[] { "Jane", "Brown", "Accountant" });

The setText() method fills all three cells of a row with data.

Figure: Table cells with data

Selecting table rows

The following example covers table item selections.

TableEx3.java

package com.zetcode;

import org.eclipse.swt.SWT;
import org.eclipse.swt.layout.GridData;
import org.eclipse.swt.layout.GridLayout;
import org.eclipse.swt.widgets.Display;
import org.eclipse.swt.widgets.Label;
import org.eclipse.swt.widgets.Shell;
import org.eclipse.swt.widgets.Table;
import org.eclipse.swt.widgets.TableColumn;
import org.eclipse.swt.widgets.TableItem;

/**
 * ZetCode Java SWT tutorial
 *
 * In this program, we show the data from 
 * the selected row in the statusbar.
 *
 * Author: Jan Bodnar
 * Website: zetcode.com
 * Last modified: June 2015
 */

public class TableEx3 {

  private Label label;
  private final String data[][] = { { "Ferarri", "33333" },
      { "Skoda", "22000" }, { "Volvo", "18000" }, { "Mazda", "15000" },
      { "Mercedes", "38000" } };

  public TableEx3(Display display) {

    initUI(display);
  }

  private void initUI(Display display) {

    Shell shell = new Shell(display, SWT.SHELL_TRIM | SWT.CENTER);
    shell.setLayout(new GridLayout(1, true));

    Table table = new Table(shell, SWT.BORDER);
    table.setHeaderVisible(true);
     table.setLinesVisible(true);

    String[] titles = { "Car", "Price" };

    for (int i = 0; i & titles.length; i++) {
      TableColumn column = new TableColumn(table, SWT.NULL);
      column.setText(titles[i]);
      column.setWidth(130);
    }

    for (int i = 0; i & data.length; i++) {

      TableItem item = new TableItem(table, SWT.NULL);
      item.setText(0, data[i][0]);
      item.setText(1, data[i][1]);
    }

    label = new Label(shell, SWT.NONE);

    table.addListener(SWT.Selection, event -> onTableItemSelected(table));
    GridData gd = new GridData(SWT.FILL, SWT.FILL, true, true);
    gd.widthHint = 360;
    gd.heightHint = 300;
    table.setLayoutData(gd);

    label.setLayoutData(new GridData(SWT.FILL, SWT.CENTER, true, false));

    shell.setText("Table widget");
    shell.pack();
    shell.open();

    while (!shell.isDisposed()) {
      if (!display.readAndDispatch())
        display.sleep();
    }
  }

  private void onTableItemSelected(Table table) {
    
    TableItem[] sel = table.getSelection();
    String msg = String.format("%s: %s", sel[0].getText(0), 
        sel[0].getText(1));
    
    label.setText(msg);
  }

  @SuppressWarnings("unused")
  public static void main(String[] args) {

    Display display = new Display();
    TableEx3 ex = new TableEx3(display);
    display.dispose();
  }
}

In the example, the data from the selected row is displayed in the statusbar.

table.addListener(SWT.Selection, event -> onTableItemSelected(table));

A selection listener is added to the table. The onTableItemSelected() is called whenever a table item is selected.

private void onTableItemSelected(Table table) {
  
  TableItem[] sel = table.getSelection();
  String msg = String.format("%s: %s", sel[0].getText(0), 
      sel[0].getText(1));
  
  label.setText(msg);
}

The getSelection() method returns an array of selected table items. (Since we work with the default selection mode, which is the single selection mode, only one table item is returned.) We use the getText() method to retrieve the data from the cells of the row. We build the message and display it in the label with its setText() method.

Figure: Selecting table items

Adding new table items

In the following example, new table items are dynamically added to the table.

TableEx4.java

package com.zetcode;

import org.eclipse.swt.SWT;
import org.eclipse.swt.layout.GridData;
import org.eclipse.swt.layout.GridLayout;
import org.eclipse.swt.widgets.Button;
import org.eclipse.swt.widgets.Display;
import org.eclipse.swt.widgets.Event;
import org.eclipse.swt.widgets.Label;
import org.eclipse.swt.widgets.Shell;
import org.eclipse.swt.widgets.Table;
import org.eclipse.swt.widgets.TableColumn;
import org.eclipse.swt.widgets.TableItem;
import org.eclipse.swt.widgets.Text;

/**
 * ZetCode Java SWT tutorial
 *
 * In this program, we add new table items
 * to the table.
 *
 * Author: Jan Bodnar
 * Website: zetcode.com
 * Last modified: June 2015
 */

public class TableEx4 {

  private Text text1;
  private Text text2;
  private Table table;
  
  private final String data[][] = { { "Ferarri", "33333" },
      { "Skoda", "22000" }, { "Volvo", "18000" }, { "Mazda", "15000" },
      { "Mercedes", "38000" } };

  public TableEx4(Display display) {

    initUI(display);
  }

  private void initUI(Display display) {

    Shell shell = new Shell(display, SWT.SHELL_TRIM | SWT.CENTER);
    shell.setLayout(new GridLayout(5, false));

    table = new Table(shell, SWT.BORDER | SWT.MULTI);
    table.setHeaderVisible(true);
    // table.setLinesVisible(true);

    String[] titles = { "Car", "Price" };

    for (int i = 0; i < titles.length; i++) {
      TableColumn column = new TableColumn(table, SWT.NULL);
      column.setText(titles[i]);
      column.setWidth(130);
    }

    for (int i = 0; i < data.length; i++) {

      TableItem item = new TableItem(table, SWT.NULL);
      item.setText(0, data[i][0]);
      item.setText(1, data[i][1]);
    }

    GridData gd = new GridData(SWT.FILL, SWT.FILL, true, true);
    gd.horizontalSpan = 5;
    gd.widthHint = 360;
    gd.heightHint = 300;
    table.setLayoutData(gd);

    Label carName = new Label(shell, SWT.NONE);
    carName.setText("Car:");
    text1 = new Text(shell, SWT.BORDER);
    
    Label priceOfCar = new Label(shell, SWT.NONE);
    priceOfCar.setText("Price:");
    text2 = new Text(shell, SWT.BORDER);    
    
    text1.setLayoutData(new GridData(SWT.FILL, SWT.CENTER, true, false));
    text2.setLayoutData(new GridData(SWT.FILL, SWT.CENTER, true, false));
    
    Button addBtn = new Button(shell, SWT.PUSH);
    addBtn.setText("Insert");
    addBtn.addListener(SWT.Selection, event -> onInsertButtonSelected(event));

    shell.setText("Table widget");
    shell.pack();
    shell.open();

    while (!shell.isDisposed()) {
      if (!display.readAndDispatch())
        display.sleep();
    }
  }
  
  private void onInsertButtonSelected(Event event) {
    
    String val1 = text1.getText();
    String val2 = text2.getText();
    
    if (val1.isEmpty() || val2.isEmpty()) {
      return;
    }
    
    TableItem item = new TableItem(table, SWT.NULL);
    item.setText(0, val1);
    item.setText(1, val2);  
    
    text1.setText("");
    text2.setText("");
  }

  @SuppressWarnings("unused")
  public static void main(String[] args) {

    Display display = new Display();
    TableEx4 ex = new TableEx4(display);
    display.dispose();
  }
}

At the bottom, there are two text widgets and a button. The data inserted into the text widgets is inserted into the cells of a new table item.

private void onInsertButtonSelected(Event event) {
  
  String val1 = text1.getText();
  String val2 = text2.getText();
  
...
}

In the onInsertButtonSelected() method we get the inserted text from the text widgets.

if (val1.isEmpty() || val2.isEmpty()) {
  return;
}

We ensure that the text widgets are not empty.

TableItem item = new TableItem(table, SWT.NULL);
item.setText(0, val1);
item.setText(1, val2);  

New table items are constructed, taking the inserted data.

text1.setText("");
text2.setText("");

In the end, the text widgets are cleared.

Figure: Adding new table items

In this part of the Java SWT tutorial, we covered the Table widget.