ホーム > Java > WindowBuilder (GUIビルダ) を使ってみました。(前編)

WindowBuilder (GUIビルダ) を使ってみました。(前編)

Eclipse 3.7 (Indigo) のGUIビルダ、WindowBuilder を使ってみました。
初めて使ったため詳しいことは書けませんが、導入からさわりまでをご紹介します。
 


■ 導入
 
  Eclipse 3.7 (Indigo) を開きます。
  メニューから[ヘルプ]-[新規ソフトウェアのインストール]を開きます。
 
  
 
  インストール 画面が表示されます。
  作業対象のリストから Indigo – http://download.eclipse.org/releases/indigo を選択します。
  フィルター入力欄に Swing と入力します。(入力後 Enter を押します。)
  一覧に表示された [一般用ツール]-[Swing Designer] にチェックをつけ、インストールします。
  インストール後は、Eclipse を再起動します。
 


■ さわり(?)
 
とにもかくにもまずは使ってみます
  Eclipse 3.7 (Indigo) を開きます。
  メニューから[ファイル]-[新規]-[Javaプロジェクト]を開きます。
    プロジェクト名を入力し、[完了]ボタンを押します。
    (ここでは sample_swing としました。)
  メニューから[ファイル]-[新規]-[クラス]を開きます。
    名前、スーパークラスを入力し、[完了]ボタンを押します。
    (ここでは名前を SamplePanel、スーパークラスを javax.swing.JPanel としました。)
 
  
 
  作成されたクラスを右クリックし、コンテキストメニューから
    [アプリケーションから開く]-[WindowBuilder Editor]を開きます。
  レイアウトエディターが表示されますが、最初はソースタブが選択されていますので、Designタブを選択します。
  あとはパレットからレイアウトを選択したり、プロパティーを適宜変更します。
  (最初はよくわからなかったですが、使っているうちに何となくわかりました。)
 

import java.awt.BorderLayout;

public class SamplePanel extends JPanel {
    private final JLabel lblBbb = new JLabel("south");
    public SamplePanel() {
        setMaximumSize(new Dimension(500, 250));
        setMinimumSize(new Dimension(100, 50));
        setLayout(new BorderLayout(0, 0));

        JLabel lblAaa = new JLabel("north");
        lblAaa.setBackground(Color.MAGENTA);
        lblAaa.setHorizontalAlignment(SwingConstants.CENTER);
        lblAaa.setOpaque(true);
        add(lblAaa, BorderLayout.NORTH);
        lblBbb.setBackground(Color.GREEN);
        lblBbb.setHorizontalAlignment(SwingConstants.CENTER);
        lblBbb.setOpaque(true);
        add(lblBbb, BorderLayout.SOUTH);

        JLabel lblWest = new JLabel("west");
        lblWest.setBackground(Color.BLUE);
        lblWest.setOpaque(true);
        add(lblWest, BorderLayout.WEST);

        JLabel lblEast = new JLabel("east");
        lblEast.setBackground(Color.ORANGE);
        lblEast.setOpaque(true);
        add(lblEast, BorderLayout.EAST);

        JLabel lblCenter = new JLabel("center");
        lblCenter.setHorizontalAlignment(SwingConstants.CENTER);
        lblCenter.setBackground(Color.YELLOW);
        lblCenter.setOpaque(true);
        add(lblCenter, BorderLayout.CENTER);
    }

}

  レイアウトエディターで作ったもののソースが↑こちらです。
  コンストラクターにわかりやすく書かれています。
  lblBbb だけ private なのは、何か操作方法が他と違ったのですかね。
 
  まだ試していませんが、複雑なレイアウト(GridBagLayoutやSpringLayoutなど)や
  入れ子になったレイアウトが、簡単に操作できるとすごく助かります。
 


 
ずっと Visual Studio のレイアウトエディターだけ使っていたためか、GUIならVSと思っていましたが、
WindowBuilder もかなり使いやすそうに感じました。
(ちなみに Android のレイアウトエディターも結構気に入っています。)
 
>> WindowBuilder (GUIビルダ) を使ってみました。(後編) に続きます~
 


(2011/10/26 追記)
lblBbb だけ private となったのは以下のボタン操作を行ったためでした。
 

 
“Convert local to field” をクリックすると、コンストラクタで宣言されていたローカル変数が、
フィールド(インスタンス変数)に変更されます。
 

 
フィールドに変更されたコンポーネントを選択すると、ボタンが “Convert field to local” に変わります。
これで、フィールドからローカル変数に戻すことができます。
 

広告
カテゴリー:Java タグ:
  1. 北村富弘
    2011/11/17 11:55

    使ってみましたレポートありがとうございます。
    概要がわかって助かります。

    • 2011/11/17 12:13

      コメントありがとうございます。
      お役に立てて何よりです(^^

  2. nanashi
    2011/12/08 07:19

    使ってみました。
    Java、GUIデザイナ今までずっと探してましたけどめぐり合えなくて困ってました
    ようやくJavaアプリケーション開発するうえで実用的かつ使い勝手の良いのにめぐり合えた感じです。
    とっても助かりました。

    • 2011/12/08 17:37

      ちょっとした時にデザインを簡単に確認できると、便利ですよね~
      私の場合、ウィンドウをリサイズしたりスクロールした時の、レイアウトマネージャーの影響を確認するなど、結構、重宝しています(^^

  1. 2011/09/22 23:03
  2. 2012/06/07 17:38
  3. 2015/03/16 10:55

コメントを残す

以下に詳細を記入するか、アイコンをクリックしてログインしてください。

WordPress.com ロゴ

WordPress.com アカウントを使ってコメントしています。 ログアウト /  変更 )

Google+ フォト

Google+ アカウントを使ってコメントしています。 ログアウト /  変更 )

Twitter 画像

Twitter アカウントを使ってコメントしています。 ログアウト /  変更 )

Facebook の写真

Facebook アカウントを使ってコメントしています。 ログアウト /  変更 )

%s と連携中

%d人のブロガーが「いいね」をつけました。