Eclipse Plug-in - Set GridData to create Table Layout

在Eclipse Plug-in內，我們有機會建置一個視窗來擺放相關的UI操作介面，假設我們要設定三

欄來擺放，且第二欄內有幾個按鈕那要怎麼設定呢? 如下：


首先，我們可以先設定這個視窗composite的layout，然後assign進composite內的元件(ex. 

Button、List、Label、Text)就必須設定要跨幾個欄的部分了! 相關程式碼如下：

PS. 本範例是extends TitleAreaDialog的dialog example

您可以在其他頁面new自己建立的dialog class，然後利用object.open()即可以彈出這個視窗!

  1. @Override
  2. protected Control createDialogArea(Composite parent) {
  3.     Composite composite = new Composite(parent, SWT.NONE | SWT.BORDER);
  4.         
  5.     GridLayout layout = new GridLayout(3, false);
  6.     composite.setLayout(layout);
  8.     Label label = new Label(composite, SWT.NONE);
  9.     label.setText("Workspace set name");
  10.     label.setLayoutData(new GridData(SWT.LEFT, SWT.TOP, false, false, 3, 1));
  11.   
  12.     Text inputSetName = new Text(composite, SWT.BORDER);
  13.     inputSetName.setLayoutData(new GridData(SWT.FILL, SWT.TOP, false, false, 3, 1));
  14.   
  15.     label = new Label(composite, SWT.NONE);
  16.     label.setText("Workspace Set content");
  17.     label.setLayoutData(new GridData(SWT.LEFT, SWT.TOP, false, false, 3, 1));
  19.     GridData grid = new GridData(SWT.LEFT, SWT.TOP, false, false, 1, 4);
  20.     grid.widthHint = 200;
  21.     grid.heightHint = 200;
  22.     notgroupSets.setLayoutData(grid);
  23.       
  24.     setButtonInitialize(new Button(composite, SWT.NONE), "Add ->");
  25.       
  26.     List groupSets = new List(composite, SWT.SINGLE | SWT.BORDER | SWT.V_SCROLL);
  27.     grid = new GridData(SWT.RIGHT, SWT.TOP, false, false, 1, 4);
  28.     grid.widthHint = 200;
  29.     grid.heightHint = 200;
  30.     groupSets.setLayoutData(grid);
  32.     setButtonInitialize(new Button(composite, SWT.NONE), "Add All ->");
  33.       
  34.     setButtonInitialize(new Button(composite, SWT.NONE), "<- Remove");
  35.       
  36.     setButtonInitialize(new Button(composite, SWT.NONE), "<- Remove All");
  37.       
  38.     return composite;
  39.  }
  40.  
  41.  public void setButtonInitialize(Button btn, String name){
  42.       GridData grid = new GridData(SWT.FILL, SWT.TOP, false, false, 1, 1);
  43.       grid.widthHint = 100;
  44.       grid.heightHint = 25;
  45.       btn.setText(name);
  46.       btn.setLayoutData(grid);
  47.       btn.setEnabled(false);
  48.  }

在這邊請注意new GridData部分，在第5、6的參數可以設定當下這個元件跨越的row, column

public GridData(int horizontalAlignment,
        int verticalAlignment,
        boolean grabExcessHorizontalSpace,
        boolean grabExcessVerticalSpace,
        int horizontalSpan,
        int verticalSpan)

以label而言，它只需設horizontal (column)為3, vertical (row) 為1

而左邊及右邊List選項須根據第二欄項目個數來設定vertical = 4, horizonal = 1

但是要注意建置順序，左邊List先建立、再來是中間第一個button、過來是右邊List

接著才是下面三個button。

好比網頁table的建置模式如下：



留言

張貼留言