formウィジットでのデザイン2
[1] 主筆嬢 06/03/11 11:40
目次はこっち
前のページ「formウィジットでのデザイン1」はこっち
[2] 主筆嬢 06/03/11 11:42
改めて、前のページの>>23と>>24の問題について考えてみる。
[3] 主筆嬢 06/03/11 11:45
あの惨状は、結局、テキストの長さや大きさ、ウインドウのサイズに合わせて、ウィジットの大きさや位置が変わらない事が原因。
つまり、位置やサイズが自動的に再計算されるようにしてあげればいい、ということになる。
[4] 主筆嬢 06/03/11 11:46
もちろん、自前で位置やサイズを変更するようプログラムを作る事もできる。VBやVCで、サイズ可変なウインドウを作ろうと思ったら、そうするしかない。
でも、誰もわざわざそんなことをやりたいとは思わない。できればコーディングなしで済ませたい。そう言うことでMotifではアタッチや位置という機能を提供している。
アタッチなどを指定して、ウィジットの位置や大きさの再計算のルールを指示しておいてあげれば、自動的にいい感じにしてくれる。
[5] 主筆嬢 06/03/11 11:49
アタッチを指定するにはどうするのか、というと、例の配置ダイアログを使う。
画面左端のラジオボックスから「アタッチ」を選択して、画面右の青いボックスで、ドラッグ・アンド・ドロップでアタッチを指定する。
青いボックスの、アタッチの元となる辺の近くでクリックして、今度はアタッチの先となる辺の近くでボタンを放す。

上の図だと、label6の上辺をウインドウの上辺にアタッチさせている。そうすることで、label6の上の辺は常にウインドウの上部にくっつくように再計算が行われるようになる。
[6] 主筆嬢 06/03/11 11:51
この要領で、4つのウィジット全てにアタッチを指定してみた。

そうしてできたのがこの画面。

なんか、さっきと違いがないようにも見える。
ところが……
[7] 主筆嬢 06/03/11 11:53
ウインドウを大きくした場合。

ラベルの文字とフォントを変更した場合

と、明らかに違いがある。
[8] 主筆嬢 06/03/11 11:55
ところで、>>6の画面は妙にくっつきすぎているようにも思うから、少し間隔を開けてみようともう。
間隔を開けるには、配置ダイアログの左側にある「オフセット」を指定してあげればいい。そうすれば、指定した分だけ間隔を開けて計算してくれるようになる。

オフセットとして15を指定して、改めてアタッチを設定してみた。

ウィジットの間に隙間が空いた。
[9] 広告 06/03/11 11:58
[10] 主筆嬢 06/03/11 13:00
一息入れたところで、今度はこう考えてみる。
各ウィジット内のフォントや文字列がいろいろと変化しても、常にいい感じになるようにするにはどうしたらいいのだろうか?
それも、上下と左右のウィジットがちゃんとそろうようにしたいんだけど、どうしたらいいだろうか?
イメージとしては、
 |
左上が大きくなった場合 |
 |
右下が大きくなった場合 |
といった感じで、>>7の下段のように、片方だけが伸びる様にはしたくない。こういう場合はどうしたらいいのだろうか?
[11] 主筆嬢 06/03/11 13:03
正直に言うと、formを使うだけでは>>10の要求には完全に答えることはできない。
でも、ある程度は目標に近づける事はできる。
[12] 主筆嬢 06/03/11 13:05
一つは、整列という奴を使う方法がある。
これを使えば、あるウィジットの一辺の位置を他のウィジットに合わせることができる。

この絵だと、button23の上下をlabel6の上下に合わせあって、同じようにbutton24の上下をlabel7の上下に合わせてある。それと同時にlabel7の右端をlabel6に合わせてある。
こうすることで、label6とlabel7が縦に伸びた場合も、その左右のボタンも同じ高さに引き延ばされることになる。それと、label6が横に伸びた場合はlabel7もそれに合わせて伸びることになる。
できた画面がこれ。

[13] 主筆嬢 06/03/11 13:07
ところが残念なことに、この整列という奴は、必ず常に一方通行でしか整列できない。
つまり、もしlabel7がlabel6よりも長くなったとした場合、label7は逆にlabel6の幅に合わせて縮められちゃうということ。

[14] 主筆嬢 06/03/11 13:10
そうするとこの辺で、formウィジット単独で解決できないのなら、複数個重ねればいいのではないだろうか、という考えが出てくると思う。
つまり、こういう事。

ところが、これでは目的を達することはできない。
これなら確かに左右の各ウィジットの幅をきっちりと揃えることができるかも知れない。でも、上下の各ウィジット間の位置関係を制御することができなくなる。
[15] 主筆嬢 06/03/11 13:13
例えば、まずこれが最初の状態。

いい感じに見える。ところが、

button5が縦に伸びた場合、label5とlabel6は右側にあるボタンのことなどこれっぽっちも考慮しないで、勝手に二人で領域を等分割しちゃう。
[16] 主筆嬢 06/03/11 13:17
だから、formだけで>>10の目的を達することはできない(と思う)。どうしてもそうしたければjavaのデザインを使うのが一番手っ取り早い。
[17] 広告 06/03/11 13:20
[18] 主筆嬢 06/03/11 13:23
あとformの機能で説明してない物の中に、"位置"と"自己"というのがある。
ウィジットの辺に"自己"を設定すると、ウィジットのその辺はformのサイズ変更に合わせて一定の割合で位置を移動するようになる。

配置ダイアログで、全てのウィジットの全ての辺に"自己"を設定した画面。
[19] 主筆嬢 06/03/11 13:24
作成した画面。

これを大きく引き延ばすと、

各ウィジットの位置関係はそのままで、サイズだけ大きくなる。
[19] 主筆嬢 06/03/11 13:24
"位置"は"自己"とほぼ同じ。
ただ"位置"では、formの端からの距離として、画面左下の「位置」と書かれたテキストボックスの値(%)が使用されるのに対して、"自己"では設定したときのウィジットの辺の位置が使用される、という違いがある。
[20] 主筆嬢 06/03/11 13:30
最後に、右寄せや下寄せの方法を説明しておく。
普通、アタッチは右から左・下から上の方向で設定する。

でもそうするとformが伸びた場合は、必ず常に一番下ないし一番右にあるウィジットが引き延ばされることになる。

でもそうではなく、時には上や左のウィジットを長くしたい、ということもあり得る。
[21] 主筆嬢 06/03/11 13:33
結論から言えば、アタッチの方向を変えればいいだけなんだけど、ただ、そのやり方にはちょっと注意がいる。
下記の絵のように、単純に上から下にアタッチを設定したのではいけない。

これだと結局下から上に設定したのと同じになる。
[22] 主筆嬢 06/03/11 13:36
どうしたらいいのかというと、まず一旦、下から上にアタッチを設定してから、改めて逆方向にアタッチを設定してあげればいい。
そうすると、下記の絵のようになる。

label12の上辺に接してる矢印の形が>>21と>>22とで違うことに注意して欲しい。
[23] 主筆嬢 06/03/11 13:37
>>22の様な状態を作ることができれば、下寄せないし左寄せを実現することができる。

[24] 主筆嬢 06/03/11 13:40
はい、今日は終わり。
[25] nabiki_t 06/03/11 13:42
人の体調が悪いのをいいことに、グダグダにやっていきなり終了かい。
あ゛〜気持ち悪りぃ……
[26] 主筆嬢 06/03/11 13:51
病人は寝てろ。つーか、一生起きてこなくていいから。
[27] 名無しさん 06/03/11 13:55
formウィジットでのデザイン1はこちら
目次はこちら
|