レイアウト

<< Click to Display Table of Contents >>

マニュアル > コントロールリファレンス > 基本 > サイドメニューコントロール >

レイアウト

サイドメニューコントロールのレイアウトを設計するには、各プロパティ及びメニューアイテムプロパティの設定値がどの部分に影響を与えるのかを理解しておく必要があります。

 

サイドメニューコントロールのレイアウトを領域毎に分けて解説します。
 

コントロール領域

サイドメニューコントロールの配置(張り付けた)サイズがコントロールエリアになります。メニュー全体のサイズとなります。
cr_0146
 

メニュー領域

メニューのアイテム郡を表示するエリアとなります。
cr_0147
 
コントロール領域とメニュー領域の隙間のサイズをコントロールプロパティの「PaddingTop/PaddingBottom/PaddingLeft/PaddingRight」のプロパティで指定することができます。
 
cr_0149
また、メニュー領域には、複数のアイテム領域が含まれますが、何列で表示するかをコントロールプロパティの「Cols」プロパティにて指定できます。
cr_0150
「Cols」が複数列の場合、アイテム領域同士の間隔をコントロールプロパティの「ItemMarginX/ItemMarginY」プロパティにて指定します。アイテム領域の幅はこれらのプロパティから自動的に決まります。
cr_0151
 
 

アイテム領域

メニューのアイテムを表示するエリアとなります。
cr_0148
アイテム領域の中は、「Left Division(左区分)/Middle Division(中央区分)/Right Division(右区分)」の3区分に分割されます。
cr_0152

 

コンテンツ領域
 
それぞれの区分の属性やサイズなどを決めるのが、「メニューアイテムプロパティ」です。各区分には、実際のメニューアイテム(アイコンやテキスト)が表示されるコンテンツ領域があり、コンテンツ領域のサイズはメニューアイテムプロパティの「(L/M/R)DivSizeX/(L/M/R)DivSizeY」と「(L/M/R)DivPaddingX/(L/M/R)DivPaddingY」の設定により、コンテンツ領域のサイズが決まります。下図では、Middle Division区分の場合を表します。
cr_0153
 

コンテンツ位置

 

コンテンツ領域内に表示するコンテンツの位置(Alignment)を決めるのが、メニューアイテムプロパティの「(L/M/R)DivAlignX」「(L/M/R)DivAlignY」プロパティです。下図の例では、Middle Divisionのコンテンツ領域に表示するコンテンツを「MDivAlignX/MDivAlignY」プロパティにて位置決めできます。
cr_0155
 
また、「(L/M/R)DivAlignX」に"CENTERITEM"を指定すると、アイテム領域の中心がコンテンツ表示位置となります。
cr_0156

 
コンテンツタイプ

 
コンテンツ領域に表示する内容を決めるのが、メニューアイテムプロパティの「(L/M/R)DivType」プロパティです。この「(L/M/R)DivType」プロパティには、「TEXT(文字列)」「BAR(メニュー選択状態表示バー)」「IMAGE(画像)」「CHECK(チェック)」「COUNTER(数)」「HYPERLINK(ハイパーリンク)」のコンテンツタイプを指定することができます。コンテンツタイプ毎にコンテンツ領域のメニューアイテムプロパティの種類が異なります。
 
例えば、「MDivType」に「IMAGE」を設定していた場合、メニューアイテムプロパティの「MImageSizeX/MImageSizeY」を設定すると画像のサイズを指定できます。但し、「MDivType」が「TEXT」の場合、本プロパティの設定は利用されません。
cr_0154