区分 - 行、列、分割線

テーブル・レイアウトは区分により構成されています。横の区分は行、縦の区分は列と呼ばれます。

図 2 – 簡素な 3x3 レイアウト

図2は、新規の 3x3 レイアウトが定義された結果を示しています。スペースが効率的に 9 つの同じサイズのセルに分割されています。

列エディターがリボン上に開かれており、カーソルは 2 番目の列の上にあります。これにより、ページ上の 2 つめの列が強調表示されます。

各区分には幅と高さがあり、最小・最大のサイズが設定されています。

幅/高さとユニット

区分の実際の幅や高さは指定のユニットにより決定されます。

ピクセル - 幅/高さに対して指定する数字は、区分のサイズをピクセルで示したものです。これにより、区分の固定サイズが定義されます。レイアウトがサイズ調整されると、ピクセル幅の区分サイズは変更されません。

比率 - 区分のサイズはその他の区分がどのような比率で存在するかにより決定されます。簡単な例を示すと、比率が 1, 1 , 3 の区分がある場合です。「比率」には、合計 5 種類が存在します。このスペースは 20%, 20%, 60% ととして、割り当られます。ピクセルとコンテンツの幅区分が常に最初に評価され、比率の区分は残りのスペースを分割します。

コンテンツ - 個別のコントロールはそのコンテンツのサイズ調整をすることができます。コンテンツのサイズを指定することで、区分は必要に応じ大きくなったり、小さくなったりします。これは、特にコンテンツが追加されるにつれて長くしたり短くしたりする必要のある、ブラウザ・アプリケーションのページ・スタイルが長い場合に便利です。

最小および最大サイズ

最小・最大サイズの機能により、区分に妥当な境界線を作成することができます。

特に最小サイズは、ページがより小さくなった時にコンテンツが「消えて」しまうことを防げるので便利です。例えば、行がリスト内のエントリー数にもとづいてサイズ調整される時、リストが空だった場合、空リストではあっても適当なサイズの行になるのではなく、列見出しと同じくらいほどのサイズになってしまいます。

分割線

分割線を使って、ユーザーは実行時に行や列のサイズを変更することができます。区分のサイズ評価という目的のため、この分割線は、固定幅の別の区分であると認識され、UI の一部として使用されます。行と列の範囲指定の場合も、区分の 1 つとして計上されます。つまり、図 3 に示されるヘッダーは、列の範囲として 3 つが必要となります。

定義できる行列と分割線の組み合わせの数には制限はありません。

図 3 – 部分分割線

デフォルトでは、分割線の方向により上から下、または左から右まで引かれます。ただし、分割線がヘッダーやフッターの領域まで覆ってしまうと、問題となる場合もあります。図 3 は列の部分分割線を示しています。この分割線は、始まりと終わりに行 2 が指定されているので、分割線は切り取られ、ページの中央部分だけになっています。