Main Content

align

UIControl コンポーネントと Axes オブジェクトの配置

    説明

    メモ

    関数 align は、App Designer 内または関数 uifigure を使用して作成されたアプリ内ではサポートされません。アプリ内でのコンポーネントの配置には、代わりにグリッド レイアウト マネージャーを使用してください。詳細については、代替機能を参照してください。

    列内のオブジェクトを揃える

    align(components,hloc,spacing) は列内の指定されたコンポーネントを揃えます。この関数は、hloc の値に従ってオブジェクトの左側、中央、右側を揃え、spacing の値に従ってオブジェクトの垂直方向の間隔を調整します。たとえば、align(components,"left","none") は左端を揃えますが、間隔は調整しません。各オブジェクトのサイズは変わりません。

    align(components,hloc,"fixed",distance) は、垂直方向の間隔をポイント単位の一定の距離に調整します。

    行内のオブジェクトを揃える

    align(components,spacing,vloc) は行内の指定されたコンポーネントを揃えます。この関数は、vloc の値に従ってオブジェクトの上側、中央、下側を揃え、spacing の値に従ってオブジェクトの水平方向の間隔を調整します。たとえば、align(components,"none","top") は上端を揃えますが、間隔は調整しません。各オブジェクトのサイズは変わりません。

    align(components,"fixed",distance,vloc) は、水平方向の間隔をポイント単位の一定の距離に調整します。

    オーバーラップするオブジェクトを揃える

    align(components,hloc,vloc) は指定された互いにオーバーラップするオブジェクトを揃えます。これは、hloc に従って列内のオブジェクトを揃え、vloc に従って行内のオブジェクトを揃えることと等価です。たとえば、align(components,"left","top")components にあるオブジェクトの左上隅を揃えます。

    計算した位置を返す

    positions = align(___) は、指定されたオブジェクトを揃えたときの位置を計算して行列として返しますが、オブジェクトは移動させません。行列出力の各行は位置ベクトルです。このオプションは、前述の構文のすべての入力引数の組み合わせで使用できます。

    positions = align(cpositions,___) は、cpositions に含まれるオブジェクトを揃えたときの位置を計算して返します。Figure のオブジェクトの位置は変わりません。このオプションは、前述の構文における任意の入力の組み合わせで、componentscpositions に置き換えて使用します。

    すべて折りたたむ

    完全には揃っていない 3 つのボタンを含む Figure を作成します。

    f = figure("Position",[100 100 350 200]);
    u1 = uicontrol(f,"Position",[10 80 60 30],"String","One");
    u2 = uicontrol(f,"Position",[50 50 60 30],"String","Two");
    u3 = uicontrol(f,"Position",[30 10 60 30],"String","Three");
    

    Figure window with three unaligned buttons

    列内のボタンの中央を揃え、ボタンの垂直方向の間隔を等しくします。列内のオブジェクトを揃えるときは、オブジェクト間隔の前に、配置の引数を指定します。

    align([u1 u2 u3],"center","distribute");

    Figure window with three buttons in a column with equal vertical distance between each button

    完全には揃っていない 3 つのボタンを含む Figure を作成します。

    f = figure("Position",[100 100 350 200]);
    u1 = uicontrol(f,"Position",[43 50 75 30],"String","Yes");
    u2 = uicontrol(f,"Position",[143 75 75 30],"String","No");
    u3 = uicontrol(f,"Position",[233 40 75 30],"String","Cancel");

    Figure window with three unaligned buttons

    行内のボタンの下端を揃え、ボタンの水平方向の間隔を 10 ポイントに設定します。行内のオブジェクトを揃えるときは、配置の引数の前に、オブジェクト間隔を指定します。

    align([u1 u2 u3],"fixed",10,"bottom");

    Figure window with three buttons in a row, with a distance of 10 pixels between each button

    ボタンと axes オブジェクトを含む Figure を作成します。

    f = figure("Position",[100 100 350 200]);
    ax = axes(f);
    btn = uicontrol(f,"String","Click");

    Figure window with an axes object and a button in the lower-left corner

    ボタンの中央を axes の中央に揃えます。2 番目の引数 "center" は列で揃えるコンポーネントの部分を指定し、3 番目の引数 "middle" は行で揃えるコンポーネントの部分を指定します。

    align([ax btn],"center","middle");

    Figure window with an axes object and button in the center of the axes

    オブジェクトを揃えたときの位置を計算しますが、実際には揃えません。

    揃っていない 3 つのボタンを含む Figure を作成します。

    f = figure("Position",[100 100 350 200]);
    u1 = uicontrol(f,"Position",[130 25 75 30],"String","Yes");
    u2 = uicontrol(f,"Position",[35 60 75 30],"String","No");
    u3 = uicontrol(f,"Position",[200 160 75 30],"String","Cancel");

    Figure window with three unaligned buttons

    出力引数を付けて align を呼び出し、ボタンを揃えた結果を予測します。出力は行列として表され、その行はボタンの予測した位置ベクトルになります。

    pos1 = align([u1 u2 u3],"right","fixed",3)
    pos1 =
    
       200    25    75    30
       200    59    75    30
       200    93    75    30

    あるいは、align にボタンの位置ベクトルを渡します。

    pos2 = align([u1.Position;u2.Position;u3.Position],"right","fixed",3)
    pos2 =
    
       200    25    75    30
       200    58    75    30
       200    91    75    30

    いずれの場合も、結果の位置は同じです。どちらの関数呼び出しも Figure 上にあるボタンの位置を変更しません。

    figure(f)

    Figure window with three unaligned buttons

    入力引数

    すべて折りたたむ

    揃えるオブジェクト。UIControl オブジェクトまたは Axes オブジェクトのベクトルとして指定します。UIControl または Axes 以外の型のオブジェクトがベクトルに含まれていた場合、関数 align は無視します。オブジェクトの位置を揃えても、オブジェクトのサイズは変わりません。

    列内で揃える components のオブジェクトの水平位置。"left""center"、または "right" として指定します。次の表で各オプションについて説明します。

    hloc

    結果

    "left"

    オブジェクトの左端を揃えます。

    Two rectangles with left edges aligned in a column

    "center"

    オブジェクトの水平方向の中央を揃えます。

    Two rectangles with horizontal centers aligned in a column

    "right"

    オブジェクトの右端を揃えます。

    Two rectangles with right edges aligned in a column

    すべての配置オプションは、オブジェクトを囲む境界ボックス内でオブジェクトの位置を調整します。"left" オプションは、オブジェクトの左端を、オブジェクトを囲む境界ボックスの左端に揃えます。"right" も同様です。"center" オプションは、オブジェクトの中央を境界ボックスの中央に揃えます。

    オブジェクトの間隔の調整。"none" または "distribute" として指定します。

    • "none" — オブジェクトの間隔を変更しません。列内のオブジェクトを揃える場合は、垂直方向には動かしません。行内のオブジェクトを揃える場合は、水平方向には動かしません。

    • "distribute" — オブジェクトを均等に分散します。列内のオブジェクトを揃える場合は、オブジェクトを囲む境界ボックスの上端と下端の間で、オブジェクトを垂直方向に均等に分散します。行内のオブジェクトを揃える場合は、オブジェクトを囲む境界ボックスの右端と左端の間で、オブジェクトを水平方向に均等に分散します。

    行内で揃える components のオブジェクトの垂直位置。"top""middle"、または "bottom" として指定します。

    halign

    結果

    "top"

    オブジェクトの上端を揃えます。

    Two rectangles with top edges aligned in a row

    "middle"

    オブジェクトの垂直方向の中央を揃えます。

    Two rectangles with horizontal middles aligned in a row

    "bottom"

    オブジェクトの下端を揃えます。

    Two rectangles with bottom edges aligned in a row

    すべての配置オプションは、オブジェクトを囲む境界ボックス内でオブジェクトの位置を揃えます。"top" オプションは、オブジェクトの上端を、オブジェクトを囲む境界ボックスの上端に揃えます。"bottom" も同様です。"middle" オプションは、オブジェクトの中央を境界ボックスの中央に揃えます。

    オブジェクト間の固定距離。ポイント単位のスカラーとして指定します。ここで 72 ポイントは 1 インチと等価です。

    オブジェクトの現在位置。行が位置ベクトルである行列として指定します。各位置ベクトルは、オブジェクトの位置とサイズを [left bottom width height] 形式で指定する 4 要素ベクトルです。位置ベクトルの測定値はすべてピクセル単位です。

    代替機能

    App Designer 内および関数 uifigure を使用して作成されたアプリ内では、グリッド レイアウト マネージャーを使用してコンポーネントを配置します。グリッド レイアウト マネージャーを使用して、グリッド内で UI コンポーネントをレイアウトできます。グリッド レイアウト マネージャーを作成するには、関数 uigridlayout を呼び出すか、App Designer で [グリッド レイアウト] コンポーネントをキャンバスにドラッグします。

    たとえば、列内の 3 つのボタンを Figure の左上隅に揃えて配置するには、4 つの行と 2 つの列を含むグリッド レイアウト マネージャーを作成します。最初の列と最初の 3 行を格納対象のコンポーネントに合わせてスケーリングするように指定します。次に、3 つのボタンを作成し、それらを最初の列の最初の 3 行に追加します。

    fig = uifigure;
    fig.Position = [100 100 200 200];
    gl = uigridlayout(fig);
    gl.RowHeight = {'fit','fit','fit','1x'};
    gl.ColumnWidth = {'fit','1x'};
    
    btn1 = uibutton(gl);
    btn1.Layout.Row = 1;
    btn1.Layout.Column = 1;
    btn2 = uibutton(gl);
    btn2.Layout.Row = 2;
    btn2.Layout.Column = 1;
    btn3 = uibutton(gl);
    btn3.Layout.Row = 3;
    btn3.Layout.Column = 1;
    

    Figure window with three buttons stacked vertically in the upper-left corner

    あるいは、App Designer で、[キャンバス] タブの [スペース] オプションを使用して [設計ビュー] でコンポーネントを配置します。詳細については、App Designer の設計ビューでのアプリのレイアウトを参照してください。

    バージョン履歴

    R2012b で導入