インタフェース設計の次の段階では、ウィジェットを物理的に配 置します。ダイアログテンプレートによって、メニューバーはウィンドウの上部に、ボタ ンはウィンドウの下部に自動的に配置されます。しかし、フォーム内でウィジェットの配 置はユーザーの好みで変更できます。
図 4-1 に、第 3 章までの学習用インタフェースの外観と、本章での手順に従って修正を 行なった後の外観を示します。
フォーム内でのウィジェットを配列することを配置といいます。 配置を変更するには、Sun WorkShop Visual の対話型配置エディタを使用して以下のステップを実行します。
Motif ウィジェットのクラスには、その子にジオメトリ (物理的な位置関係) の規則を強制できるものがあります。ラジオボックス、ローカラムおよびメニューバーの 子が特別の方法で配置されていることはすでに説明しました。メニューバーの場合には、 カスケードボタンは単一行に配置され、ローカラムの場合には、すべての子はグリッド状 に配置されます。
フォーム、ブリテンボードおよび描画領域のウィジェットでは、 柔軟に子の配置を行うことができます。これら 3 つのウィジェットを配置ウィジェットといいます。
Sun WorkShop Visual には、これらのウィジェットの子を配置するための対話型配置エディタがあります。
アタッチメントは、あるウィジェットを配置ウィジェットまたは 配置ウィジェットの別の子に対して、特定の相対的な位置に強制するコンストレイント (制約) です。3 種類のすべての配置ウィジェットでは、子の左上隅および右下隅を配置ウィジェットに相 対する任意の x 、 y 位置に接続することができます。ウィジェットの左上隅を制約すると、その位置が固定さ れます。また、右下隅を制約すると、そのサイズを固定することになります。これらがブ リテンボードおよび描画領域ウィジェットにより適用されるアタッチメントです。
フォームウィジェットを使用すると、指定した間隔 (ピクセル単位) で子ウィジェットの端をフォームの端に接続することができます。これにより、ブリテン ボードや描画領域で提供するアタッチメントと同様に、特定の x 、 y 位置での配置が行われます。フォームの場合、この型のアタッチメントはフォームアタッ チメントと呼び、フォームで使用できる他の型のアタッチメントと区別しています。
フォームでは、フォームの幅あるいは高さの合計に対してのパー センテージで指定される位置アタッチメントも使用できます。位置アタッチメントを使用 すると、ウィンドウが大きくなるにつれてウィジェットの間隔が広くなるため、余分なス ペースが生じた場合にはインタフェースでそのスペースを活用することができます。
ウィジェットアタッチメントを使用すると、指定した絶対間隔 (ピクセル単位) でフォームの 2 個の子を互いに接続することができます。アタッチメントは、ウィジェットの端と端、あ るいは上部と下部で行うことができます。ウィジェットのグループを揃え、配置するため の機能も備えています。
これらのフォームの追加機能を使用すると、メインウィンドウま たは個々のウィジェットがサイズ変更された場合でも、体裁が悪くならないようにするこ とができます。たとえば、ウィジェットをフォームの両端に接続すると、 メインウィンドウが拡大された場合には一緒に広がるようにすることができます。また、 2 個のウィジェットの端と端を接続すると、片方のウィジェットのサイズが変更された場合 でも相互の間隔が保たれます。
ウィジェットを選択して「ウィジェット」メニューで「配置」を 選択するか、図 4-2 に示すツールバーの「配置」ボタンをクリックすると、階層内にある配置ウィジェットの 配置エディタを表示することができます。
図 4-3 のようなダイアログが表示されます。
編集領域は、配置の略図を表示します。編集領域内のウィジェッ トは、フォームを表わす大きなボックス内に、ボックスとして枠組みが表示されます。図 4-3 におけるボックスは上から下の順に、フレーム、ローカラムそして 3 個のトグルボタンを表わします。
ウィジェット同士が重なり合った場合でも境界線は表示されるた め、ウィジェットの位置を確認することができます。重なり合ったウィジェットのうちの 1 つを選択する場合は、最もサイズの小さな包含ウィジェットが選択されます。これによっ て、小さなウィジェットが大きなウィジェットに隠れて選択できないという問題を回避す ることができます。
注 - 配置エディタは、フォームの子を表示しますが、それよりも下の 階層は表示しません。たとえば、フレームの中にあるラジオボックスおよびそのトグルボ タンや、 ローカラム内のラベルおよびテキストフィールドは表示されません。また、フォームの外 側にあるメニューバーやプッシュボタンも表示されません。配置エディタには、メニュー バー、ツールバー、コマンドボタンがあります。そして、いくつかの配置エディタコマン ドにはキーボードアクセラレータがあります。これらを使用する場合、Sun WorkShop Visual メインウィンドウにおける別機能のアクセラレータと同じキャラクタ使用する時には、配 置エディタ画面に入力フォーカスがあることを確認して下さい。
エディタ画面の左側にあるラジオボタンを使用すると、複数の編 集モードの中から 1 つを選択することができます。編集モードを選択すると、マウスボタン 1 にその機能が割り当てられます。
ラジオボタンの隣に示されているマウスボタンとキー操作の組み 合わせを使用すると、現在の選択とは関係なく任意の編集モードを使用することができま す。たとえば、ウィンドウの移動には常にマウスボタン 2 を、そしてアタッチメントの設定には Shift を押しながらマウスボタン 2 を使用することができます。
ウィジェットを選択するには、編集領域内の該当するウィジェッ ト上をクリックします。さらに別のウィジェットも選択するには、Shift キーを押しながら目的のウィジェットを選択します。一次セレクションは常に太線の境界 線で表示され、二次セレクションは点線の境界線で表示されます。最後に選択されたウィ ジェットが常に一次セレクションです。整列は一次セレクションを基準にして行われるた め、どのウィジェットが一次セレクションなのかを知っておく必要があります。
メニューバーの下には、以下に示すボタンを含むツールバーがあ ります。これらのボタンは、メニューからも使用できます。
「リセット」を参照してください。
「元に戻す」 を参照してください。
「ズームイン、ズームアウト」を参照してください。
「ズームイン、ズームアウト」を参照してください。
配置エディタの「表示」メニューには、以下に示す 4 種類の便利な表示コマンドがあります。
このオプションは、ポインタがウィジェット内にある場合に、ポ インタに最も近い端を強調表示します。ウィジェットに設定したアタッチメントは、強調 表示されている端に適用されます。デフォルトは「端の強調表示」が適用されています。
このオプションは、編集領域にある各ボックス内に識別のための 文字列を表示します。「表示」メニューをプルダウンし、「注釈」を選択すると、「ウィ ジェット名」と「クラス名」という選択肢を持つプルライトメニューが表示されます。「 ウィジェット名」( <Ctrl-W> ) は、各ウィジェットの変数名を表示します。「クラス名」( <Ctrl-N> ) は、各ウィジェットのクラス (例: 「フレーム」または「ローカラム」など) を表示します。 1 つのオプションを選択すると、もう 1 つのオプションは使用できなくなります。オプションが設定されている場合に同じオプシ ョンを再度選択すると、表示からすべての注釈が取り除かれます。
注釈オプションを図 4-4 に示します。
「配置方法」メニューには、パレット上の編集モード (「編集モード」を参照してください) の他にもいくつかのコマンドがあります。このメニューからは、「整列」と「均等配置」 の 2 つの機能を使用することができます。
「整列」を押すと、使用できる整列機能がプルライトメニューに 表示されます。これらの機能は、ウィジェットを 2 つ以上選択した場合に限り使用できます。このメニューにある整列機能の詳細は、「ウィジェットの整列: グループの整列」を参照してください。
「均等配置」を選択すると配置方法を指定するためのプルライト メニューが表示され、そのメニューから、さらに 2 種類のプルライトメニューが表示されます。均等配置機能は、ウィジェットを 3 つ以上選択した場合に限り使用できます。このメニューにある均等配置機能の詳細は、「均等配置」を参照してください。
配置上にグリッドを表示するには、配置エディタウィンドウの左 下にあるグリッドスライダを使用します。グリッドの間隔は、2 から 50 ピクセルの間で選択することができます。ピクセル数は、1 : 1 のスケールとみなされるため、ズームコマンドを使用する場合にはグリッドは配置にあわ せて伸縮します。
「移動」および「サイズ変更」モードでは、グリッドが表示され ている場合は、移動およびサイズ変更がグリッド単位で行われます。ウィジェットを移動 する場合、その左上隅が最も近くにあるグリッドの交差点に配置されます。また、同様に 、ウィジェットのサイズ変更を行う場合には、右下隅がグリッドの交差点に配置されます 。
スライダをゼロに設定すると、グリッドは表示されなくなります 。
配置エディタ内のアタッチメントは、図 4-6 に示される記号を使用して表示されます。
使用している配置には、すでにフォームアタッチメントとウィジ ェットアタッチメントの 2 種類のアタッチメントが存在しています。フォームアタッチメントは、ウィジェットの片 方の上端に、矢印で示されます。デフォルト配置の一番上にあるウィジェットであるフレ ームには、フォームの上部および左側に、このようなアタッチメントが 2 個あります。他の 4 個のウィジェットは、それぞれフォームの左側に接続されます。すべてのウィジェットは 、階層に追加された順序で上から下に重ねられます。
下の 4 個のウィジェットはそれぞれその上のウィジェットに接続されています。ウィジェットア タッチメントは、塗りつぶされた小さな矢先で一方に塗りつぶした円のある矢印で表示さ れます。
「移動」コマンドを使用すると、新しい位置にウィジェットをド ラッグすることができます。このコマンドは、ウィジェットの左上隅を固定する 2 個のフォームアタッチメントを設定します。配置を開始する最適な方法は、このモードを 使用して、最終配置で予定しているおおよその位置にすべてのウィジェットを移動するこ とです。その後で、他のモードを使用して精密にウィジェットの位置やサイズ変更を指定 することができます。
ウィジェットを移動すると、そのウィジェットに関連するアタッ チメントがすべて削除されます。ウィジェットのアタッチメントは保持されます。削除さ れないようにするには、Control キーを押しながらウィジェットを移動します。整列や均等配置などの機能はアタッチメン トにもとづいて実行されるため、デフォルトでは Sun WorkShop Visual がアタッチメントを削除します。新しく作成したアタッチメントと既存のアタッチメント との間で矛盾が発生し、フォームからエラー報告をすることが頻繁にあります。いったん このような状況になると、回復は不可能ではありませんが、非常に困難です。「循環アタッチメント」を参照してください。このような状況を避けるには 、配置機能を実行する前には必ず Sun WorkShop Visual がアタッチメントを削除するように設定することをお勧めします。
「移動」モードでは、マウスボタン 1 を使用してウィジェットを配置内でドラッグすることができます。また、現在のモードと は関係なく、マウスボタン 2 を使用してウィジェットを移動させることもできます。
3. マウスボタン 1 を押したまま、フォームの右端から外に出るまでローカラムを右方向にドラッグします。
この場合、ローカラムの右マージンがフォームの端を超えるまで ドラッグすることになりますが、問題はありません。マウスボタンを離すと、フォームは 自動的にすべての子が収まるようにサイズ変更が行われます。
図 4-7 に現段階での配置の外観および結果のダイナミックディスプレイを示します。ダイアログ テンプレートはフォームの新しい幅に適合するために、自動的にメニューバーのサイズお よびプッシュボタンの間隔を調整します。
ローカラムおよびフレームの上部および左端には、フォームの上 部および左端にアタッチメントで接続されていることを示す矢印があります。「移動」は 、フォームに 2 個のアタッチメントを設定してウィジェットの左上隅を新しい位置に固定します。これら のアタッチメントは、間隔が 0 (ウィジェットはフォームの端に接触する) でも、または 0 以外の間隔 (ウィジェットとフォームとの間に空間ができる) でも作成することができます。この間隔はオフセットと呼ばれます。この場合、ローカラ ムの左端はゼロ以外のオフセットでフォームに接続されています。オフセットについては 、この章で後述します。「移動」モードの場合、オフセットはポインタの位置にもとづい て計算されます。
ウィジェットの片方の端には、1 個のアタッチメントだけを作成することができます。「移動」は端にあるアタッチメント を壊し、移動されるウィジェットの上部および左端に新しい 2 個のアタッチメントを設定します。デフォルト配置の場合、ローカラムの上部はフレーム の下部に設定されていました。しかし「移動」によってローカラムの上部に新しいアタッ チメントが設定されたため、このアタッチメントはもう存在しません。「移動」は、ウィ ジェットから作成されたアタッチメントを削除しますが、他のウィジェットから作成され ているアタッチメントは維持します。
ローカラムウィジェットを上に移動する場合、3 個のトグルボタンが一緒に移動します。これは、ウィジェット間のアタッチメントにより 起こるものです。最初のトグルボタンの上部は ローカラムの下部に接続されているため、ローカラムが上方に移動される場合にはトグル ボタンの上部も一緒に移動することになります。その他の 2 個のトグルボタンも、2 番目のボタンが最初のボタンと 3 番目のボタンに接続されているため、連鎖反応として移動します。
ローカラムを移動しても、トグルボタンからローカラムへのアタ ッチメントは、取り除かれません。これは、このアタッチメントがローカラムにではなく 、トグルボタンに属しているためです。この区別については、本章で後述します。
現段階では、ローカラムおよびフレームの上部が揃っています。 しかし、これらがフォームに接続されている方法には大きな違いがあります。フレームの 上部は、デフォルト配置から残っているデフォルトアタッチメントであり、ローカラムは 、本章の 「移動」で設定されたゼロアタッチメントで接続されています。
デフォルトオフセットは、フォームの「水平間隔」と「垂直間隔 」リソースにより制御されています。明示的オフセットは、配置エディタ内での移動また は整列などのアクションを介して、デフォルトオフセットを上書きします。デフォルトで は両方のリソースが 0 であるため、フレームとフォームの上部との間は 0 ピクセルです。間隔を設定し直した結果を確認するには次のようにします。
1. フォームを選択して、ツールバーの「リソース」をクリックします。
2. フォームリソースパネル上で「表示」ページを選択します。
3.
「横の間隔」ボックスをダブルクリックし、次のように入力します。
20
4.
「縦の間隔」ボックスをダブルクリックし、次のように入力します。
20
図 4-8 に結果を示します。フレームおよび 3 個のトグルボタンを含む、デフォルトオフセットを使用するすべてのアタッチメントは、 この時点で 20 ピクセル間隔を使用しています。ローカラムは、そのアタッチメントが「移動」を使用し て設定されたものであり、間隔リソースを参照しない明示的オフセットを使用しているた め移動しません。結果としては、フレームとローカラムは揃わなくなります。
トグルボタンの間の余分なスペースにより、フォームは全体的に 大きくなるように強制されます。ダイアログテンプレートもまた、フォームを収めるため にサイズ変更を行います。
デフォルトオフセットの利点は、実行の配置の間隔をユーザーが 制御できるということです。しかし、デフォルトオフセットのおもな欠点は、不要であっ ても配置内のすべての間隔が等しくなるということです。また、デフォルトオフセットは 明示的オフセットが同じ値のままでも変化することがあり得るため、デフォルトと明示的 オフセットを混同しないように注意してください。たとえば、間隔を変更したことにより フレームとローカラムが揃わなくなった場合は、一方が明示的オフセットを、もう一方が デフォルトオフセットをフォームの上部から使用していることが原因です。配置エディタ 画面は、明示的およびデフォルトオフセットを区別しません。
ウィジェットの端のすぐ内側からフォームの端のすぐ外側にドラ ッグを行うと、ウィジェットをフォームに接続することができます。これは「アタッチ」 モードでボタン 1 を使用して、あるいはすべてのモードの場合に <Shift-button 2> を使用して実行できます。アタッチメントは、「オフセット」フィールドのオフセット値 を使用して設定されます。「オフセット」フィールドが空の場合には、デフォルトオフセ ットが使用されます。
「アタッチ」モードの場合、あるいは <Shift-button 2> を押している場合、ポインタは十字型になります。
ここで、デフォルトアタッチメントのいくつかを 0 ピクセルの明示的オフセットを使用するアタッチメントと置き換えます。
2.
「オフセット」ボックスをクリックし、次のように入力します。
0
3. 十字型ポインタをフレーム左端のすぐ内側に配置し、左端を強調表示します。
4. マウスボタン 1 を押したまま、フォーム左端のすぐ外側にドラッグします。
新しいアタッチメントは、古いアタッチメントと同様に、塗りつ ぶされた三角形としてフレームの端に表示されます。明示的な 0 オフセットはフレームをフォームの端に移動するため、効果を確認することができます。 この移動が発生しない場合には、アタッチメントの設定を再度行なってみてください。
6. 十字型ポインタを一番上のトグルボタンの左端のすぐ内側に配置し、その端を強調表示し ます。
7. マウスボタン 1 を使用してフォーム左端のすぐ外側にドラッグします。
フレームの上部は、現在の位置でも体裁よく見えます。フォーム の上部から 20 ピクセルというオフセットを使用すると、ローカラムに対してフレームが中央に寄せられ ます。しかし、デフォルトではなく明示的オフセットにすると、フォーム間隔リソースを 変更した場合でも変化せずにそのまま維持されます。明示的オフセットに変更するために は、アタッチメントを置き換える必要があります。
9.
「オフセット」フィールドをダブルクリックして、次のように入力します。
20
10. 十字型ポインタをフレーム上部のすぐ内側に置き、その端を強調表示します。
11. マウスボタン 1 を使用して、フォーム上部のすぐ外側の位置にドラッグします。
図 4-9 に結果を示します。ダイナミックディスプレイで同じ表示が行われない場合には、次のよ うにします。
フォーム内の 2 個のウィジェット間のアタッチメントの設定は、ウィジェットをフォームの端に接続する 場合と似ています。1 組のウィジェットを接続するためには、単純に、片方のウィジェットのすぐ内側から別の ウィジェットのすぐ内側に十字型ポインタをドラッグします。
2 個のウィジェットを接触させて、あるいはオフセットを使用して端と端で接続するために は、一方の右端をもう一方の左端に接続するか、あるいは一方の上部をもう一方の下部に 接続します。
前のセクションから引き続き、「アタッチ」モードを使用します 。ローカラムの左側をフレームの右側に接続します。
1.
「オフセット」ボックスをダブルクリックして、次のように入力します。
50
2. ポインタをローカラムの左端のすぐ内側に配置して、左端を強調表示します。
3. マウスボタン 1 を押したまま、フレームの右端が強調表示されるまでフレームのすぐ内側の位置までドラ ッグします。
新しいアタッチメントは、フレームの右端を指している矢先でロ ーカラムの左端の中央に塗りつぶした円のある矢印で表示されます。ローカラムは、フレ ームの右端から 50 ピクセルの間隔を置いて、 ローカラム自身の位置を変更します。
これにより現段階で配置が大幅に変更されることはありませんが 、フレーム内の文字列が変更される可能性がある場合は、この種類のアタッチメントが大 変役に立ちます。ローカラムは、この時点でフォームの端にではなく、フレームの右端に 相対して配置されています。したがって、フレームが拡大された場合でも、ローカラムは 50 ピクセルの間隔を保持します。
5. 構成領域にあるラジオボタン内の最初のラジオボタンをダブルクリックします。
6.
リソースパネルの「表示」ページに移動して、ボタンのラベルを次のように変更します。
Double Scooper
結果を図 4-10 に示します。
アタッチメントは対称ではありません。ウィジェット A からウィジェット B へポインタをドラッグしてアタッチメントを作成する場合、そのアタッチメントはウィジ ェット A に起因している、と言います。これを示すために、Sun WorkShop Visual はウィジェット A 内にウィジェット B への矢印を描画します。先程作成したアタッチメントは、ローカラムに起因しています。
アタッチメントは、それが起因するウィジェットにのみ適用しま す。たとえば、先程作成したアタッチメントはローカラムを、フレームに相対する特定の 位置に制約します。フレームが移動またはサイズ変更された場合には、ローカラムもそれ に従って移動します。ローカラムが移動またはサイズ変更された場合には、フレームへの 影響はありません。
一番上のトグルボタンには、ローカラム下部へのアタッチメント があります。このアタッチメントは、デフォルト配置から残されたものであり、デフォル トのオフセットを使用しています。したがって、これはフォームの間隔リソース (20 ピクセルに設定されている) によって制御されます。
ローカラムは、一番上のトグルボタンから離して移動させること ができました。これは以下の 2 つの規則によるものです。
一番上のトグルボタンは、ローカラムの下部から 20 ピクセル (現在の垂直間隔) 離れた場所にあります。トグルボタンの左または右側とローカラムとの間にはアタッチメ ントがないため、ローカラムの水平方向の位置はトグルボタンに影響を及ぼしません。
フォームウィジェットに対しての Motif の規則では、ウィジェット A をウィジェット B に接続し、さらにウィジェット B をウィジェット A に接続することを禁止しています。これは循環アタッチメントと呼ばれます。 ウィジェット A から B、B から C、そして C から A という大きなアタッチメントのループもまた循環アタッチメントと見なされ、エラーの原 因となります。配置にこのようなループが含まれている場合、図 4-11 に示されるような警告メッセージが表示されます。この場合は、ループを切断するために 複数のアタッチメントを壊さなければなりません。
循環は、ウィジェットのアタッチメントの場合にのみ問題となり ます。フォームへのアタッチメントおよび位置アタッチメント (「均等配置: 位置モード」を参照) は、親フォームからではなく子ウィジェットにのみ起因するため、循環アタッチメントは 生じません。
循環を避ける良い方法は、ウィジェット間のすべてのアタッチメ ントを 2 方向 (通常は上および左) のみにすることです。インタフェースを配置する場合、左上隅から開始して下方に進み、 そして右に進みます。2 個のウィジェットを接続する場合には、常に下、または右にあるウィジェットからアタッ チメントを作成するようにします。このようにすると、すべてのアタッチメント矢印は同 じ方向を指すため、循環アタッチメントが誤って作成されることはありません。
配置エディタにおいてアタッチメントを削除するには、以下の方 法のどれかを使用します。
1. ウィジェットの端に任意の型の新しいアタッチメントを設定します。これにより古いアタ ッチメントが削除されて置き換えられます。
2. 「移動」を使用してウィジェットの位置を変更します。これによりそのウィジェットに起 因するすべてのアタッチメントが削除されます。
3. 「アタッチ」モード (<Shift-Button 2>) を使用し、アタッチメントの起因するウィジェットの、端のすぐ内側をクリックします。 これにより、新しいアタッチメントを設定することなく設定の削除が行われます。「端を 強調表示」モードを使用すると、十字型ポインタを簡単に正しい位置に配置することがで きます。
4. 「元に戻す」をクリックし、最後に追加されたアタッチメントを削除します。
Motif では、各ウィジェットは少なくとも 2 つの端が接続されている必要があります。すべてのアタッチメントを削除した場合には、 リセットを行うと、フォームとウィジェットの間に最後の配置にもとづいた単純な移動型 アタッチメントが作成されます。
循環していない場合でも、互いに矛盾するアタッチメントを指定 してしまう可能性もあります。たとえば、正のオフセットを使用して、ウィジェットの左 端をフォームの右端に接続してしまう場合があります。矛盾したアタッチメントを持つフ ォームをリセットする場合、Motif はそれらのすべてを満たす配置を計算しようとします。計算のループを何度繰り返しても 満足できる配置が見つからない場合には、そのループは中断され、図 4-12 のような警告メッセージが表示されます。このような状況では、問題を生じさせているア タッチメントを取り除くまでは、一部のウィジェットが非常に小さく表示されたり、ある いはフォーム自体が非常に広くまたは長くサイズ変更されている場合があります。
ウィジェットは 4 個の端それぞれに起因するアタッチメントを 1 個ずつ持つことができます。アタッチメントはフォームアタッチメント、ウィジェットア タッチメントまたは位置アタッチメント (「均等配置: 位置モード」を参照) から任意の型にすることができます。ウィジェットの端に起因する新しいアタッチメント を指定すると、その場所にすでに存在しているアタッチメントは新しいアタッチメントと 置き換えられます。
2 個のウィジェットの整列は、オフセットゼロで両方の上部と上部を接続することにより実 行することができます。配置エディタの「整列」モードを選択すると、簡単に整列を行う ことができます。「整列」モードは、明示的なゼロオフセットを使用するだけの簡単なア タッチメントです。2 個のウィジェットを下部と下部、左端と左端、または右端と右端で揃えることもできます 。この機能を使用する場合には、循環を作り出さないように注意してください。
最初の 2 個のトグルボタンの上部を揃えるには次のようにします。
「整列」の結果と、その後で「均等配置」を実行した結果を確認 することができるよう、図 4-13 に示すように、ウィジェットの上部とそれらの端の間隔をわざと少しだけずらしておきま す。
3. 中央のトグルボタンの上部のすぐ内側に十字型ポインタを配置します。
整列がどのように作用するかを理解するには、まず、アタッチメ ントが一方向のウィジェットの位置にのみ影響することを覚えておきます。たとえば、ウ ィジェット 1 の上部をウィジェット 2 の下部に接続する場合は、以下のようになります。
ここで top_1 はウィジェット 1 の上部の y 座標を表わし、 bottom_2 はウィジェット 2 の下部の y 座標を表わします。これは、2 個のウィジェットが水平方向で重なるかどうかには関係なく該当します。
同様に、2 個のウィジェットの上部と上部を接続する場合は、以下のようになります。
オフセットが 0 である場合には、2 個のウィジェットの上部の y 座標は同じになります。つまり、これらのウィジェットの位置が揃っていることになりま す。
図 4-16 の例 A では、「整列」モードで使用するアタッチメントの型を示しています。例 B では、0 以外のオフセットを使用する類似したアタッチメントを示しています。その効果は整列に 似ていますが、段差が生じます。
「整列」モードを使用する、あるいはオフセット 0 で「アタッチ」モードを使用して 2 個のウィジェットの左、右、上または下の端を接続すると、それらのウィジェットを対で 整列させることができます。「配置方法」メニューの整列機能を使用すると、ウィジェッ トのグループの位置を素早く揃えて並べることができます。この機能で設定されるアタッ チメントは、「アタッチ」または「整列」モードでウィジェットの整列に使用するものと 同じ種類です。
これらのボタンは、複数のウィジェットが選択されている場合に のみ使用することができます。ウィジェットの複数選択および一次セレクションの詳細は 、「セレクション: 単独、一次、二次」を参照してください。.
1. 「移動」モードまたはマウスボタン 2 を使用して、2 番目のトグルボタンの位置をずらします。
2. 「移動」モードまたはマウスボタン 2 を使用して、右側のトグルボタンの右端がフレームの右端に揃うように、トグルボタンを 移動します。
3. 「移動」モードにしてから、右のトグルボタンをクリックします。
「移動」 モードでウィジェットをクリックすると、そのウィジェットの枠が強調表示され、選択さ れていることを示します。最初のウィジェットをクリックした後、<Shift-Button 1> を使用してウィジェットをグループに追加する必要があります。図 4-17 のように、一次セレクションのウィジェットの枠が強調表示され、その他のウィジェット の枠は点線で表示されます。
ここで「整列」を選択すると、一次セレクションを基準に整列が 実行されます。
4. 中央のトグルボタンを <Shift-Button 1> でクリックします。
5. 左のトグルボタンを <Shift-Button 1> でクリックします。
6. 「配置方法」メニューの「整列」プルライトメニューから「上端」を選択します。
図 4-18 に示すアタッチメントが設定されます。
ウィジェットのグループの位置を揃える場合、選択された最後の ウィジェットは影響を受けずに、そのウィジェットに合わせて他のウィジェットの位置が 揃えられます。最後に選択するウィジェットを除いて、ウィジェットの選択順序は意味を 持ちません。Sun WorkShop Visual は、ウィジェットの位置の順序でアタッチメントを設定します。最後に選択されるウィジ ェット以外の、グループ内の各ウィジェットは、その隣のウィジェットに接続され、すべ てのアタッチメントは最後に選択されたウィジェットの方向を向いています。例で使用す る配置においては、右のウィジェットは中央のウィジェットに、中央のウィジェットは左 のウィジェットに接続されています。
図 4-19 は、この一般的な規則を示したものです。ウィジェットのグループが最初の図で示されて いる順序で選択された場合は、結果のアタッチメントは 2 番目の図に示されている順序でウィジェットを接続します。
「配置方法」メニューの「均等配置」プルライトメニューにある 均等配置機能を使用すると、指定されたスペースにウィジェットのグループを等間隔で分 散させることができます。この機能は、複数のウィジェットが選択されている場合にのみ 使用することができます。ウィジェットの複数選択の詳細は、「セレクション: 単独、一次、二次」を参照してください。
「配置方法」メニューの「均等配置」を選択すると、プルライト メニューが表示され、そのメニューからさらにプルライトメニューが 2 つ表示されます。
「水平」を選択すると、以下に示す項目を持つプルライトメニュ ーが表示されます。
均等配置するウィジェット同士のサイズが大きく違っていると、 「中央」均等配置と「端」均等配置の違いが最も良く識別できます。
「垂直」を選択すると、以下に示す項目を持つプルライトメニュ ーが表示されます。
水平均等配置の場合と同じように、均等配置するウィジェット同 士のサイズが大きく違っていると、「中央」均等配置と「端」均等配置の違いが最も良く 識別できます。
この機能を使用して、フォームの一番下の部分に 3 個のトグルボタンを均等に配置することができます。
ウィジェットが前セクションで選択されたままの状態である場合 、新しいウィジェットをクリックして新たにセレクショングループを作成すると、選択が 解除されます。
2. 中央のトグルボタンを <Shift-Button 1> でクリックします。
3. 左側のトグルボタンを <Shift-Button 1> でクリックします。
これで、3 個のボタンがすべて強調表示されました。最後に選択されたトグルボタンが一次セレクシ ョン (ウィジェットの枠が強調表示されているもの) になります。「セレクション: 単独、一次、二次」を参照してください。ただし、「均等配置」機能の場合は選択さ れた順序は関係がありません。
4. 「配置方法」メニューのプルライトメニューから「均等配置」を選択します。
5. 次に表示されるプルライトメニューから「水平方向」を選択します。
この例ではウィジェットのサイズが同じなので、「中心」を選択 しても同様の結果になります。
図 4-20 に結果を示します。
「均等配置」では、グループ整列 (「配置方法」メニューから「整列」を選択する) とは異なる順序でアタッチメントが設定されます。「均等配置」の場合、アタッチメント は図 4-21 に示されるように、常に下から上、または右から左という特別な順序で作成されます。そ れぞれのウィジェットは、隣のウィジェットに接続されます。「均等配置」の場合は「整 列」とは異なり、ウィジェットを選択した順序が何らかの影響を及ぼすことはありません 。
配置エディタの画面では、トグルボタンの端から端を接続してい る矢印はすべて右から左の方向を向いています。「表示」メニューをプルダウンして一時 的にクラス名注釈を画面から取り除くと、矢印がもっとはっきりと見えます。
「均等配置」は前述の通りにアタッチメントを設定するだけなの で、あらかじめ計画をたてておかないと容易に循環アタッチメントが生じてしまいます。 たとえば、すでに実行してきたように、右から左へウィジェットを選択し、それらを「整 列」し、さらに「均等配置」することができます。しかし、それらを左から右に選択し、 「整列」を行い、そして同じウィジェットのグループに「均等配置」を行うことはできま せん。これを実行すると、循環アタッチメントが生じます。
循環を避けるためには、その他のすべてのアタッチメントを右か ら左または下から上に作成してください。
また、「整列」および「均等配置」によって設定されたアタッチ メントと既存のアタッチメントの間に、矛盾が発生することがあります。詳細は、「移動中のアタッチメントの削除」を参照してください。
位置アタッチメントを使用すると、ウィジェットの端をフォーム の合計幅または高さのパーセンテージで表わされる位置に接続することができます。この 機能により、ウィンドウがサイズ変更された場合に、インタフェース内のウィジェットが 余分なスペースを利用することができます。位置は常にフォームの左上隅から測ります。 ウィジェットの上または下端に n % の位置アタッチメントがある場合には、その端はフォームの上部から n % 下方の位置に配置されます。ウィジェットの左または右端に n % の位置アタッチメントがある場合には、その端はフォームの左端から n % 右に配置されます。
位置は「位置」フィールドにパーセント値として指定されます。 ユーザーが値を入力しない場合には、値はゼロと見なされます。位置アタッチメントは、 ウィジェットのアタッチメントされた端に、塗りつぶされていない円で表示されます。
1. 現在の幅よりも広くなるようにウィンドウのサイズを変更します。
図 4-22 に示されるように、ローカラムはフレームとの間に同じ間隔を保ちます。
固定オフセットを使用したアタッチメントを設定すると、このよ うに動作します。生じた余分なウィンドウ幅には、ウィジェットは配置されません。この サイズ変更動作は、多くのインタフェースに共通しています。ただし、位置アタッチメン トを使用して、利用可能なウィンドウスペースを活用するようにローカラムを移動させる ことができます。
これを行うには、 次のようにして、ローカラムの左端の 45 % の位置アタッチメントを指定します。
3.
「位置」テキストボックスをダブルクリックして、次のように入力します。
45
4. ローカラムの左端のすぐ内側にポインタを配置してその端を強調表示し、クリックします 。
位置アタッチメントがローカラムの端に白ぬきの円として表示さ れます。このアタッチメントは既存のアタッチメントとそれを表わす矢印を上書きします 。この型のアタッチメントは、ウィンドウサイズとは関係なく、ローカラムの左端をフォ ームから 45 % 離れた場所に配置します。この効果を確認するには次のようにします。
5. ウィンドウの幅を狭くするようにサイズ変更を行い、次に幅を広げます。
図 4-23 に示すように、ローカラムは余分なスペースを埋めるために移動しています。このサイズ 変更動作が、位置コンストレイントの大きな利点です。
この型のアタッチメントの短所は、位置アタッチメントはフォー ムのサイズによってのみ計算されるものであり、その他のウィジェットのサイズに合わせ た調整は行わないということです。これは、図 4-24 に示すように、他のウィジェットがサイズ変更した場合には問題です。フレーム内のラベ ルの 1 つが長くなった場合、フレームはローカラムに近づいてしまう、あるいは重なってしまう 可能性があります。
この動作と、50 ピクセルのオフセットを持つウィジェットアタッチメントのある配置が示されている図 4-10 を比較してください。アタッチメントの型は、配置内のウィジェットの型と実行時に行わ れる可能性のある変更にもとづいてユーザーが選択します。配置の方法については、第 20 章「複雑な配置」に詳しく説明されています。
「自己」モードは、位置アタッチメントを設定するためのもう 1 つの方法です。パーセント値を入力する代わりに、ウィジェットの端の 1 つをクリックすると、ウィジェットの現在位置とフォームの現在のサイズにもとづいてパ ーセンテージが計算されます。そのため、「自己」を使用する場合には、「位置」フィー ルドにパーセンテージを指定する必要がありません。また、フィールドに指定されている 値は無視されます。しかし、「移動」あるいは他のコマンドを使用して、ウィジェットを 希望する場所に移動する必要があります。
「自己」は、「均等配置」と組み合わせて使用する場合に特に効 果的です。固定した間隔を使用してボタンをフォームの下部にすでに設定してあります。 各ボタンの両端に「自己」アタッチメントを設定すると、使用できる可能性のある余分な ウィンドウスペースにボタンを配置させる一方で、均等なスペースを維持することができ ます。
デフォルトでは、「自己」アタッチメントはグリッドの間隔で設 定されます。したがって、「均等配置」によって設定される詳細な間隔を活用するために は、グリッドを無効にする必要があります。
「自己」モードの場合、位置はフォームの全体サイズに相対して 計算されます。ウィンドウのサイズを変更したため、以下の操作を行います。
フォームをリセットすると、その子に現在設定されているアタッ チメントにもとづいて、最適なサイズが計算されます。
「自己」アタッチメントがトグルボタンの端に塗りつぶされた円 として表示されます。
6. 中央のトグルボタンの右端をクリックし、その後左端をクリックします。
「自己」アタッチメントが塗りつぶされた円として表示されます 。Motif では、「自己」アタッチメントは位置アタッチメントと同じであるため、Sun WorkShop Visual ではユーザーがフォームをリセットした後にその両者の区別を付けることができません。 フォームのリセットを行なった場合には、「自己」アタッチメントは塗りつぶされていな い円で表示され、位置アタッチメントとまったく同様に動作します。フォームリセット後 のトグルボタンの配置は図 4-25 のようになります。
「サイズ変更」は、「移動」と同様に機能しますが、ウィジェッ トの下部および右側にアタッチメントを設定します。「サイズ変更」を使用するためには 、以下の操作を行います。
「サイズ変更」は、ウィジェットのサイズを固定する場合に、ブ リテンボードおよび描画領域で使用すると役に立ちます。フォームの場合には、「サイズ 変更」はウィジェットの右下隅を、配置ウィジェットの左上隅に相対する特定の x 、 y 位置に接続します。ウィジェットの左上隅のアタッチメントと組み合わされる場合には、 ウィジェットのサイズが固定されます。ブリテンボードまたは描画領域の場合は、「サイ ズ変更」は単純にウィジェットの幅および高さのリソースを設定します。
ウィジェットに独自の最適なサイズを計算させる場合には、ほと んどのウィジェットがそれぞれ最適な動作を行うため、このオプションは、通常はフォー ム配置には使用されません。
図 4-26 に、ウィジェットが独自にサイズ変更を行う代表的な例を示します。
図 4-26 のフレームは、「移動」コマンドのみによって制約されます。ユーザーがトグルボタンの 1 つに対してラベルテキストを変更する場合、フレームの下部および右側は制約されていな いため、自由にフレーム自体でサイズ変更することができます。
しかし、フレームが「サイズ変更」によって設定されているアタ ッチメントを持つ場合には、
図 4-27 に示すように、サイズ変更を行うことはできません。
図 4-27 に示されている「移動」および「サイズ変更」の組み合わせはフレームの 4 個の端すべてを固定するため、大きくなったラベルを収めるために拡大することはできま せん。Motif では、ラベル文字列の一部だけを表示することにより、この状況に対処しています。
「サイズ変更」は、ブリテンボードおよび描画領域ウィジェット が位置アタッチメントまたはウィジェットアタッチメントを提供しないため、主にこれら のウィジェットで使用します。「サイズ変更」は、ウィジェットに特定のサイズを維持す るように強制して、ウィジェット同士が重なりあわないようにします。「サイズ変更」の 短所は、自動サイズ変更の利点が使用できなくなってしまうことです。サイズを変更する 可能性のあるウィジェットに最適な動作をさせるためには、フォームを使用して、ウィジ ェットを互いに接続します。すると、ウィジェットの 1 つがサイズ変更した場合に、他のウィジェットがその変更に対応して移動します。
前章で説明したコンストレイントパネルを使用して、フォームの 子にあるアタッチメントの表示および調整を行うことができます。コンストレイントパネ ルは、アタッチメントの表示および微調整に対してのみ、その使用をお勧めします。コン ストレイントパネルは、ウィジェットから起因するアタッチメントのみを表示することに 注意してください。大幅な変更を行う場合には、配置エディタを使用します。
1. 配置エディタ画面の「ファイル」メニューから「閉じる」を選択します。
3. ウィジェットメニューをプルダウンし、「コンストレイント」を選択します。
このコマンドにより、図 4-28 に示されるように、ローカラムに設定されているアタッチメントが表示されます。
ローカラムの上部には、オフセット 0 のフォームへのアタッチメントがあります。フォームの左端には、45 % の位置アタッチメントがあります。ローカラムの下部および右側にはアタッチメントはあ りません。
コンストレイントパネルは、以下の作業に使用することができま す。
ブリテンボードウィジェット、描画領域ウィジェット、ローカラ ムウィジェットも、配置エディタ上で使用することができます。
配置エディタは、フォームの場合と同様にブリテンボードおよび 描画領域にも使用することができます。配置エディタを他の配置ウィジェットで使用する 場合には、いくつかの相違点があります。以下の記述は、ブリテンボードおよび描画領域 にのみ該当します。
すでに説明したように、ウィジェット、自己および位置アタッチ メントは使用することができません。配置エディタはアタッチメントを示す矢印または三 角形の表示を行わず、配置されたウィジェットの位置およびサイズのみを表示します。
配置エディタを最初に表示する場合、いくつかのウィジェットが 最初から直接重ねられて配置されていることがあります。この場合には、「移動」を繰り 返して使用し、それらのウィジェットを重ならない位置にドラッグします。
メインウィンドウで使用できる編集モードは、「移動」および「 サイズ変更」のみです。また、「グループ整列方法」と「均等配置」は使用することがで きますが、「整列」モードは使用することができません。「グループ整列」および「均等 配置」は、ウィジェットを相互に接続せず、単に配置をしなおします。
ウィジェットは相互に接続することができないため、循環アタッ チメントが生じる恐れはありません。
内部的には、配置エディタはフォームの場合のように、ブリテン ボードおよび描画領域のリソースの設定は行いません。その代わり、子ウィジェットのコ アサイズと位置リソースを設定することにより配置を決定します。コンストレイントパネ ルは、これらの配置ウィジェットには使用できません。サイズおよび位置リソースを表示 するためには、子ウィジェットに対してのコアリソースパネルを表示します。
次の条件に該当するウィジェットは、配置エディタ上で移動、ま たはコンストレイントの設定を行うことはできません。
|
サン・マイクロシステムズ株式会社 Copyright information. All rights reserved. |