Panel1のAlignはalLeftにします。
DockSiteは"False"(※注意)にします。
Panel2のAlignはalBottomにします。
Panel2のDockSiteは"True"(※注意)にします。
次にDockTabSetのプロパティですが、DestinationDockSiteプロパティを"Panel2"(※注意)にします。
Form2を追加します、適当なフォームを作ります。FormのIconプロパティーをセットして適当なアイコンを追加しておきます。
Form3も同様に適当に作成します。
残りはボタンの部分にコードを書いていきます。一番上のBotton0には次のようなコードを書きます。DockTabSetをPanel1にドッキングさせるコードです。
続いてBotton1には、次のようなコードを書きます。2枚のフォームを表示させるコードです。
続いてBotton2には、以下のようなコードを書きます。2枚のフォームをDockTabSetにドッキングさせるコードです。
続いてBotton3には、以下のようなコードを書きます。片方のフォームを表示させるコードです。
続いてBotton4には、以下のようなコードを書きます。アクティブなフォームを非表示にするコードです。
できましたら実行してみましょう。下の図のような感じで起動するでしょう。
まず、「0」のボタンを押します。DockTabSetがPanel1にドッキングします。
次に、「1」のボタンを押します。フォームが2枚表示されます。
次に、「2」のボタンを押します。フォームがDockTabSet内に格納されます。
そして、「3」のボタンを押します。Form2の内容がTabのPanelに展開された形で、表示されます。(下図参照)
隣のForm3と書かれたタブをクリックするとForm3の内容がTabのPanelに展開された形で表示されます。
ここで、右上のピンをクリックしてください。Panel2にForm3の内容が移されます。そしてピンのアイコンが立った状態になります。
もう一度ピンを押すと、DockTabSetの内部に格納されます。
Form2のタブをクリックし、Form2の内容を表示させピンをクリックしPanel2側へ移します。そして、DockTabSetのForm3のタブをクリックし、Form3を表示させます。ここで、Form2側のヘッダ部分をクリックしてForm2側をアクティブにします。(下の図ではForm3側が濃いグラデーションになっているのでForm3側がアクティブになっています。)
Form2側をアクティブにすると、一呼吸置いてからForm3のタブが自動的に折りたたまれることが確認できます。
実際にはこれだけのコードでは、ドックアウトなどの処理は対応できていませんので、本格的に動かすにはもう少しコードを追加する必要があります。しかし、非常に高度な動きをする、ドッキングタブを簡単に作ることができるコンポーネントです。…が、相当使い方が特殊です。ちなみに、ここまで行くのに相当、試行錯誤しました。