作業全体の大まかな流れ
部品を配置する
コントロールパネルの詳細説明
ウインドウ(フォーム)をリサイズした時に部品の位置や大きさの変化を指定する
パネル、タブページ、スクロールの中に部品を配置する
パネル全体を選択したら、パネルの中に配置した部品を選択出来なくなってしまった。
スプリッタを使ったレイアウトを作る
![]() |
1.フォーム名をコントロールパネル上部のボックスで指定。これが配置した部品名のベースになる。ただし部品名はユーザーが自由に変更出来る。
|
![]() |
2.ボタンやラベルとかかれたボタンを押すとその部品がフォーム左上に現れる。 |
![]() |
|
![]() |
4.部品の名前や、属性、ウインドウをリサイズした場合の挙動を、変更し目的の動作をするフォームに近づける。 |
![]() |
5.コントロールパネル下の「フォームデザインをプログラムに書き出す」 ボタンを押し、デザインが、フォーム用か母艦用かを選び、クリップボードにプログラムを書き出す。
|
![]() |
6.プログラムにペーストで貼り付ける。 |
![]() |
F5を押して実行してみる。 デザインしたとおりのウインドウが現れる。 (図では出力時にフォームを選択したので、母艦の他にもう一つ作られたウインドウが出来る) |
![]() |
1.なにもない状態 |
![]() |
2.配置したい部品のボタンを選び、押すと、フォーム左上に指定した部品が選択状態で表れる。 |
![]() |
3.属性を編集(図ではテキスト属性を編集)わかりにくいが実際にボタンに書かれているテキストも「こんにちは」と変化している。 部品名も編集出来る。 ボタンやラベルでは初期状態ではフォーム名+数字が表示されているが、これは当然部品名を表示しているわけではなく、その部品の暫定的に与えられたテキスト属性にすぎない。部品名を変えてもボタンのテキストは変わらない。左の図のようにテキスト属性を編集する。 なでしこ用では部品名に 「の」「と」「に」「は」が使ってはならない。フォームデザイナー側では使えてしまうので注意。 |
![]() |
4.ハンドルをドラッグし、リサイズや移動が出来る。3,4は逆でも良いし、部品名変更は必須ではない。自分がプログラムに貼り込んだ時にわかればそれでいい。 |
●ウインドウ(フォーム)をリサイズした時に部品の位置や大きさの変化を指定する。
フォームリサイズ時の動作指定する方法
![]() |
1.部品を選択する。(下のハンドルがついて淡色表示になっているボタン) |
![]() |
2.ウインドウリサイズ時の動作オプションをラジオボタンで選択。 この場合は「幅・高さがリサイズ時に追従」 つまり、フォームがリサイズされると、位置は変わらず、大きさが連動するオプションです。 (オプションの詳細については下記参照) |
![]() |
3.これだけで,すでにウインドウリサイズと連動する部品に変化しています。フォームをリサイズすると部品の大きさが変わります。(ただし、スプリッタなどを使った複雑なデザインではデザイン中にあまりフォームの大きさを変えない方がいいかも知れません) |
リサイズオプションの詳細
コントロールパネルに、以下の項目を選択するラジオボタンがあります。固定( リサイズ無視 )
位置がリサイズに追従
X位置がリサイズに追従
Y位置がリサイズに追従
幅・高さがリサイズに追従
幅がリサイズに追従
高さがリサイズに追従
X位置と高さが追従
Y位置と幅が追従
部品を選択し、この項目を変更するとフォームをリサイズした時の部品の挙動が変化します。
固定( リサイズ無視 )なにも変わりません。デフォルト。
位置がリサイズに追従
リサイズすると、部品の位置が、ウインドウの右辺と下辺との距離を保つように移動します。ウインドウの 右下にくっつけたい部品などに設定します。
![]()
X位置がリサイズに追従
リサイズすると、部品のX座標が、ウインドウの右辺との距離を保つように移動します。ウインドウの右側にくっつけたい部品などに設定します。
![]()
Y位置がリサイズに追従リサイズすると、部品のY座標が、ウインドウの下辺との距離を保つように移動します。ウインドウの下側にくっつけたい部品などに設定します。
![]()
幅・高さがリサイズに追従
リサイズすると、部品の位置は変化せずに、部品の大きさが変化してウインドウの右辺と下辺との距離を保ちます。メモ帳やTエディタなど、大きさが必要な部品などに設定します。
![]()
幅がリサイズに追従
リサイズすると、部品の位置は変化せずに、部品の横の長さが変化して(横方向だけ伸びる)ウインドウの右辺との 距離を保ちます。スライドバーや、urlを編集する1行エディタなど、横の長さが欲しい部品に設定します。
![]()
高さがリサイズに追従
リサイズすると、部品の位置は変化せずに、部品の高さが変化して(縦方向だけ伸びる)ウインドウの下辺との距離を保ちます。リストなど、縦の長さが欲しい部品に設定します。
![]()
X位置と高さが追従リサイズすると、部品のY座標は変化せずに、X座標と高さが変化して(縦方向だけ伸びる)ウインドウの上辺と下辺と右辺との距離を保ちます。ウインドウの右側にくっつけて縦の長さの欲しい部品などに設定します。
![]()
Y位置と幅が追従リサイズすると、部品のX座標は変化せずに、Y座標と幅が変化して(横方向だけ伸びる)ウインドウの左辺と下辺と右辺との距離を保ちます。ウインドウの下側にくっつけて横の長さの欲しい部品などに設定します。
![]()
![]() |
1.中に部品を配置したいパネル、スクロールなどを選択します。 |
![]() |
2.右クリックメニューで「新しい部品はこの部品に乗せる」を選択します。このメニュー項目は部品を中に配置出来る部品を選択した場合にしかアクティブになりません。 |
![]() |
3.「ボタン」配置ボタンを押すと、上記のパネルの中に新しいボタンが配置されます。 また通常の状態に戻す時には「新しい部品は母艦に配置」を選択します。 また、パネル全体を選択してしまうと中に配置した部品を選択出来なくなってしまいますが、外部の部品を選択することで回避出来ます。下記の説明を参照下さい。 |
既にある部品を、パネルなどに移動したい場合 (ひまわり版 v1.5から可能になった)
@移動したい選択してから、右クリックします。
Aメニューが出るので、「この部品を乗せ替え移動する」を選ぶ。
Bパネルなどの部品を乗せられる部品のリストがでるので、移動先を選択。
C選んだ移動先に、部品が移動する。
D以降、移動先に選んだ部品に、新しい部品が作られる。
(元の座標を保ったまま移動するので、移動先のパネルなどが小さいと移動した部品が見えないことがあるので注意)注意:
●パネル、タブページなどを選択していると、ある意味当然だがその中の部品がクリックできなくなる。 その場合は、いったん、外の部品を選べば、パネル内部の部品が選択できるようになる。 (詳細はすぐ下の解説を参照)
もしそのパネルしかない時は「新しい部品を母艦に配置」を選んで適当な部品を作成すること。●タブページのページを選択する時も同様に一度、他の部品を選択してから、選択したいタブをクリックすること。
●タブのページを追加する時は、コントロールパネルの「部品テキスト」の中に行を追加して文字列を入力すればそれが新しいページになる。
●タブページのページを削除する時に、部品が中に配置されているページを削除しないこと。部品が消失したことを
認識できないで、その後エラーになる。必ず、そのページの部品を全て削除してからページ削除すること。
部品テキストで行を削除しただけでページが削除されてしまうので注意!
タブページ部品をまるごと削除する場合には、ちゃんと中の部品削除まで自動でやるようになっているので問題無い。
●パネル全体を選択したら、パネルの中に配置した部品を選択出来なくなってしまった
1.パネル全体を選択したら、中に配置したボタン(図ではTESTボタン)をクリックしてもパネルが選択状態になっているので選べない。 2.この場合、外部の適当な部品(図では適当ボタン)をクリックします。 3.パネルの選択状態が解除されると、また自由に、パネル内部の部品が選択出来るようになります。適当な部品がない場合は、いったん外部に一時的な部品を配置して削除してあとでください。 ※タブページのページを変更する時も同様に、一度他の部品を選択してから、選択したいタブをクリックすること。
スプリッタとはパネルやフォームを分割し、分割した境界線を移動出来るようにしたものだ。
左右に二分割の例パネルを作成します。
右クリックして、自動レイアウト設定 > レイアウト左 を選択します。
もう一枚パネルを作成。
右クリックして、自動レイアウト設定 > レイアウト全体 を選択します。これで左右に二分割、中央をスプリッタで動かせるようになった。
二分割以上にするには、「新しい部品はこの部品の上に乗せる」でパネルの上にまたパネルを作り、
さらにレイアウト指定で区切っていく。注意:
自動レイアウトの仕様を知っている人なら判っていると思うが、 必ず一つの領域に「左」と「全体」、「上」と「全体」という、「ある方向と全体」というルールを守り、 その組み合わせ以外は指定してはならない。それ以外を指定すると、レイアウトが壊れるので注意。
また、スプリッタ、自動レイアウトは、かなりデリケートで、配置命令やレイアウト命令の 順序や、中に部品を配置しただけでスプリッタが固まったり、見えない場所に行ってしまったり、という事があるので(この部分はかなり調整したが絶対にちゃんと動く、という法則性が見つからなかったので) デザインが進んでから、自動レイアウトを指定する場合は、その前にセーブするなどの用心をすること。また、スプリッタの動作は、パネル内に部品がある場合は、その部品の領域に被らないようにひまわり自身がクリッピングしてるせいか、「フォームリサイズ時の動作」指定と、自動レイアウトを併用した複雑なレイアウトで衝突しやすい。自動レイアウトしたパネルなどの内部 (上) に、パネルの辺に触れるくらいのギリギリのサイズに、部品を配置しないこと。複雑なレイアウトでは特に余裕を持っておくこと。でないとウインドウをリサイズした途端に配置が壊れて編集が不可能になる。
一見まともにレイアウトできてるようでも、フォームをリサイズするとレイアウトが壊れたり 部品が消えたりすることがあるので、極力、自動レイアウトを指定する場所は どうしてもスプリッタで動かせるようにしたい場所に限ること。またできるだけデザインの最終段階で指定するほうが無難だ。