panel : パネル

Adobe Javascript GUI パネル GUI
スポンサーリンク

パネルを使うと、実行画面に配置するオブジェクトを罫線で囲んでまとめることができます。

パネル内に、ラジオボタンチェックボックスを作成することで、画面の見た目もまとまりができて分かりやすくなります。

パネル内にまとめられたラジオボタンは、ひとつのグループになるので、複数のラジオボタンのグループを作りたいときは、特に便利です。

コードサンプル

// ダイアログ作成
var  objDlg = new Window ("dialog", "パネルを表示する", [0,0,400,200]);
// パネルを追加(画面左がわ)
var objPnl01 = objDlg.add("panel", [20,30,150,150], "人物");
var objrdbtn_ap = objPnl01.add("radiobutton", [10,30,100,50], "アプりん");
var objrdbtn_rp = objPnl01.add("radiobutton", [10,60,100,80], "リプちん");
objrdbtn_ap.value = true;
// パネルを追加(画面右がわ)
var objPnl02 = objDlg.add("panel", [180,30,300,150], "アプリケーション");
var objrdbtn_in = objPnl02.add("radiobutton", [10,30,100,50], "InDesign");
var objrdbtn_ph = objPnl02.add("radiobutton", [10,60,100,80], "Photoshop");
objrdbtn_ph.value = true;

// ダイアログを画面センターに表示
objDlg.center();
objDlg.show();

実行結果

パネル サンプル実行結果1

サンプルの解説

パネルの作成

var objPnl01 = objDlg.add("panel", [20,30,150,150], "人物");
var objPnl02 = objDlg.add("panel", [180,30,300,150], "アプリケーション");

4行目で画面左側のパネル「人物」を、9行目で画面右側のパネル「アプリケーション」を作っています。

どちらも、親になるオブジェクト(objDlg)に追加するオブジェクトとして、最初の引数でpanel を指定します。

2つ目の引数 [20,30,150,150] と[180,30,300,150]は、表示する位置とサイズです。

パネルの囲み罫線の左上に、「人物」と「アプリケーション」と表題をつけました。省略すると罫線のみが表示されます。

パネル内にラジオボタンを作成

var objrdbtn_ap = objPnl01.add("radiobutton", [10,30,100,50], "アプりん");
var objrdbtn_rp = objPnl01.add("radiobutton", [10,60,100,80], "リプちん");
var objrdbtn_in = objPnl02.add("radiobutton", [10,30,100,50], "InDesign");
var objrdbtn_ph = objPnl02.add("radiobutton", [10,60,100,80], "Photoshop");

5行目・6行目では左側のパネルの中に、10・11行目で右側のパネルの中に、ラジオボタンをそれぞれ2つずつ作りました。

第2引数では位置とサイズを指定しますが、位置の起点はダイアログではなくパネルの左上が起点になります。

パネルの中にラジオボタンを入れると、そのパネル内でグループ化されるので、「人物」内で1つ、「アプリケーション」内で1つ、のチェックができるようになっています。

コメント

タイトルとURLをコピーしました