Tab

タブです。この中に他のパーツを入れることが出来ます。タブパネルはタブをまとめるためのオブジェクト。タブはタブパネルの子にしかなれない。

作成時のプロパティ

タブパネルにしか追加出来ないので注意。ウィンドウやグループなどに直接追加はできない。

add方式と文字列方式の違いで引っかかりやすい。詳しくはページ下部NOTE 2を。

//add()方式

[TabbedPanelObj].add("tab" [, bounds, text, {creation_properties}]); //※[ ]内はオプション


//文字列方式

Panel{type : "tab", ... }

bounds [Array of Number]

使わない。サイズは親のタブパネルで決まる。

text [String]

表示する文字。

creation_properties[Object]

properties自体はいろんなプロパティを格納した単なる入れ物に過ぎない。properties自体に何かを設定するのではなく、その子プロパティに設定していく。ここに属するものは、ウィンドウ作成時に1度だけ設定できる。後で変更ができない。

      • name [String]:このパーツに好きな名前をつける。ウィンドウの findElement () や親の children プロパティで name を利用すると、このオブジェクトを取得できる。

NOTE 1 : Tabが多い時 - 地獄のCS6 -

タブを追加しすぎて、タブパネルの幅に収まらない時の表示がAEのバージョンによって違う。

      • ESTK

理想。左右向きの矢印ボタンがついている状態。クリックすると、タブの見出し部分がスクロールされて、隠れた部分が見える。使いやすい。

      • AfterEffects CC2019

ESTKとは若干違うが「>>」のボタンをクリックすると、見えているものも含めて全てのタブがドロップダウンリストのように一覧表示される。これもこれで使いやすい。

また、右図のように、タブをクリックするなどしてアクティブ状態(青いバーが表示されている状態がアクティブ。白い時は非アクティブ)になっていると矢印キーでも次のタブへ移動できる。タブの見出しはスクロールされてアクティブなものが見えるようになる。

      • AfterEffects CS6

問題児。まず見切れてるし。矢印ボタンぽいものも見当たらない。アクティブにして矢印キーを押してみると、フォーカスは移動しているようだが、スクロールはしてくれないので、見えないものは一生見えないまま。フォーカスを移動してからスペースキーを押すと見えないところのタブも選択はできるが、見えないんだから、選びたいタブを開けるか保証がない。矢印キーとスペースキーを交互に押して、順番にタブを開いて見ていくしかない。ま、もう使う人も少ないか!

一応ソースコード置いとくのでやってみたい人はどうぞ。

var w = new Window('dialog{ text : "ウィンドウ" ,\

pnl : Panel{ type : "tabbedpanel" , alignment : ["fill","fill"] ,\

t : Panel{ type : "tab" ,text : "Tab1" }\

t : Panel{ type : "tab", text : "Tab2" }\

t : Panel{ type : "tab", text : "Tab3" }\

t : Panel{ type : "tab", text : "Tab4" }\

t : Panel{ type : "tab", text : "Tab5" }\

t : Panel{ type : "tab", text : "Tab6" }\

t : Panel{ type : "tab", text : "Tab7" }\

t : Panel{ type : "tab", text : "Tab8" }\

t : Panel{ type : "tab", text : "Tab9" }\

}\

}');


w.onShow = function(){

w.size = [200,50];

w.layout.resize();

}


w.layout.layout();

w.show();

ESTK
AfterEffects CS6
AfterEffects CC2019

NOTE 2 : Panel と TabbedPanel、Tabの関係