5 Replies Latest reply: Mar 15, 2012 8:43 PM by bouye RSS

    TableRow

    palban
      Hello forum,
      who can help me ti create a TableView with multicolor TableRow?

      Using css i can customize onli even and odd row...

      Thanks in advanced,

      palban
        • 1. Re: TableRow
          bouye
          I did that, it's just a matter of providing a TableCell with the appropriate CSS style in it.

          For example, in my code I use the following which code the background of the line in the style attribute o the cell depending on the region attribute of the current object (I need to rework the tooltip though as they still do not show up yet).
          The color I use is transparent so I can still see row selection, alternate row colors, and such.
          /**
           * Table cell used to render {@code ProjectionInfo} instances in the editor.
           * @author Fabrice Bouyé (fabriceb@spc.int)
           */
          class ProjectionInfoTableCell<T> extends TableCell<ProjectionInfo, T> {
              /**
               * Creates a new instance.
               */
              public ProjectionInfoTableCell() {
                  super();
              }
          
              /**
               * {@inheritDoc}
               */
              @Override
              protected void updateItem(T value, boolean empty) {
                  super.updateItem(value, empty);
                  setText(null);
                  setGraphic(null);
                  if (!empty && getTableRow() != null) {
                      int row = this.getTableRow().getIndex();
                      ProjectionInfo projectionInfo = getTableView().getItems().get(row);
                      Color regionColor = RegionUtils.colorForRegion(projectionInfo.fishery.getRegion().getID());
                      String style = MessageFormat.format("-fx-background-color: rgba({0}%, {1}%, {2}%, 0.3);", regionColor.getRed() * 100, regionColor.getGreen() * 100, regionColor.getBlue() * 100); // NOI18N.
                      setStyle(style);
                      [...]
                  }
              }
          }
          An alternate idea would be to generate a new styleclass (instead of a style), ie: "region{0}-cell" and define all of those in an external CSS file. This may help rework tablerow selection colors too.

          Edited by: bouye on Mar 15, 2012 2:04 PM
          • 2. Re: TableRow
            palban
            Can I use your example if I create the tabla in this way?
            public class TableFactory {
                
                public static TableView createTable(String... colums) {
            
                    int columnIDX = 0;
                    
                    TableView table = new TableView();
                    table.setTableMenuButtonVisible(true);
                    
                    for (String strColumn : colums) {
            
                        final int idx = columnIDX;
                        
                        TableColumn col = new TableColumn(strColumn);
            
                        col.setCellValueFactory(new Callback<CellDataFeatures<ObservableList,Object>,ObservableValue<Object>>(){
                                public ObservableValue<Object> call(CellDataFeatures<ObservableList, Object> param) {
                                    return new SimpleObjectProperty(param.getValue().get(idx));
                                }
                            });
                        
                        columnIDX++;
                        
                        table.getColumns().add(col);
            
                    }
            
                    return table;
            
                }
            }
            Thanks in advanced,

            palban
            • 3. Re: TableRow
              palban
              Solved using this code:
              col.setCellFactory(new Callback<TableColumn, TableCell>() {
              
                              public TableCell call(TableColumn param) {
                                  return new TableCell<Object, String>() {
              
                                      @Override
                                      public void updateItem(String item, boolean empty) {
                                          super.updateItem(item, empty);
                                          if (!isEmpty()) {
                                              
                                              this.setStyle("-fx-background-color: linear-gradient(to bottom right, #a1c517, #009045, #0082b6, #151f77, #db004f);");
                                              
                                              setText(item);
                                          }
                                      }
                                  };
                              }
                          });
              • 4. Re: TableRow
                palban
                Can u post me a full example?

                From table creation to cell color...
                • 5. Re: TableRow
                  bouye
                  Here you are:
                      /*
                   * To change this template, choose Tools | Templates
                   * and open the template in the editor.
                   */
                  package test;
                  
                  import java.text.MessageFormat;
                  import java.util.ArrayList;
                  import java.util.List;
                  import javafx.application.Application;
                  import javafx.beans.property.ReadOnlyObjectWrapper;
                  import javafx.beans.value.ObservableValue;
                  import javafx.collections.FXCollections;
                  import javafx.scene.Scene;
                  import javafx.scene.control.TableCell;
                  import javafx.scene.control.TableColumn;
                  import javafx.scene.control.TableColumn.CellDataFeatures;
                  import javafx.scene.control.TableView;
                  import javafx.scene.control.TableViewBuilder;
                  import javafx.scene.layout.BorderPane;
                  import javafx.scene.layout.BorderPaneBuilder;
                  import javafx.scene.paint.Color;
                  import javafx.stage.Stage;
                  import javafx.util.Callback;
                  
                  /**
                   *
                   * @author fabriceb
                   */
                  public class Main extends Application {
                  
                      Color[] colors = new Color[]{Color.RED, Color.BLUE, Color.YELLOW, Color.GREEN, Color.CYAN};
                  
                      enum Foo {
                  
                          VALUE1,
                          VALUE2,
                          VALUE3,
                          VALUE4,
                          VALUE5,
                          VALUE6,
                          VALUE7;
                      }
                  
                      class Data {
                  
                          Foo foo;
                          int value;
                      }
                  
                      class DataTableCell<T> extends TableCell<Data, T> {
                  
                          @Override
                          protected void updateItem(T t, boolean empty) {
                              super.updateItem(t, empty);
                              if (!empty && getTableRow() != null) {
                                  int row = this.getTableRow().getIndex();
                                  Data data = getTableView().getItems().get(row);
                                  int colorIndex = data.foo.ordinal() % colors.length;
                                  Color color = colors[colorIndex];
                                  //                String style = "-fx-background-color: red";
                                  String style = MessageFormat.format("-fx-background-color: rgba({0}%, {1}%, {2}%, 1);", color.getRed() * 100, color.getGreen() * 100, color.getBlue()* 100); // NOI18N.
                                  System.out.println(style);
                                  setStyle(style);
                                  setText(t.toString());
                              }
                          }
                      };
                  
                      /**
                       * @param args the command line arguments
                       */
                      public static void main(String[] args) {
                          launch(args);
                      }
                  
                      @Override
                      public void start(Stage primaryStage) {
                          int dataCount = 30;
                          List<Data> dataList = new ArrayList<>(dataCount);
                          for (int dataIndex = 0; dataIndex < dataCount; dataIndex++) {
                              Data data = new Data();
                              data.foo = Foo.values()[(int) (Math.random() * Foo.values().length - 1)];
                              data.value = (int) (Math.random() * 100);
                              dataList.add(data);
                          }
                          TableColumn<Data, Foo> fooColumn = new TableColumn<>("Foo");
                          fooColumn.setCellValueFactory(new Callback<CellDataFeatures<Data, Foo>, ObservableValue<Foo>>() {
                  
                              @Override
                              public ObservableValue<Foo> call(CellDataFeatures<Data, Foo> cellDataFeature) {
                                  Data data = cellDataFeature.getValue();
                                  return new ReadOnlyObjectWrapper<>(data.foo);
                              }
                          });
                          fooColumn.setCellFactory(new Callback<TableColumn<Data, Foo>, TableCell<Data, Foo>>() {
                  
                              @Override
                              public TableCell<Data, Foo> call(TableColumn<Data, Foo> arg0) {
                                  return new DataTableCell<>();
                              }
                          });
                          TableColumn<Data, Integer> valueColumn = new TableColumn<>("Value");
                          valueColumn.setCellValueFactory(new Callback<CellDataFeatures<Data, Integer>, ObservableValue<Integer>>() {
                  
                              @Override
                              public ObservableValue<Integer> call(CellDataFeatures<Data, Integer> cellDataFeature) {
                                  Data data = cellDataFeature.getValue();
                                  return new ReadOnlyObjectWrapper<>(data.value);
                              }
                          });
                          valueColumn.setCellFactory(new Callback<TableColumn<Data, Integer>, TableCell<Data, Integer>>() {
                  
                              @Override
                              public TableCell<Data, Integer> call(TableColumn<Data, Integer> arg0) {
                                  return new DataTableCell<>();
                              }
                          });
                          TableView<Data> tableView = TableViewBuilder.<Data>create().columns(fooColumn, valueColumn).items(FXCollections.observableArrayList(dataList)).columnResizePolicy(TableView.CONSTRAINED_RESIZE_POLICY).build();
                          BorderPane root = BorderPaneBuilder.create().center(tableView).build();
                          primaryStage.setTitle("TableView test");
                          primaryStage.setScene(new Scene(root, 300, 250));
                          primaryStage.show();
                      }
                  }
                  Edited by: bouye on Mar 16, 2012 11:42 AM - Fixed error where the code was using AWT colors instead of FX colors.