Xamarin.Forms レイアウト

サンプルのダウンロード サンプルをダウンロードする

レイアウトは、ユーザー インターフェイス コントロールをビジュアル構造に構成するために使用されます。

の クラスと クラスは、ビューや他のレイアウトのコンテナーとして機能するビューの特殊 LayoutLayout<T>Xamarin.Forms なサブタイプです。 クラス Layout 自体は、 から派生します View 。 派生 Layout 物には、通常、アプリケーション内の子要素の位置とサイズを設定するロジックが Xamarin.Forms 含まれています。

Xamarin.Forms Layout Types" data-linktype="relative-path"><span class=Xamarin.Forms <span class= Layout Types" title=" Xamarin.Forms Layout Types" data-linktype="relative-path"/>

から派生するクラスは、 Layout 次の 2 つのカテゴリに分けることができます。

1 つのコンテンツを含むレイアウト

これらのクラスは、 Xamarin_Forms LayoutLayout _Layout_Padding" data-linktype="absolute-path">および Padding Xamarin_Forms _Layout_IsClippedToBounds" data-linktype="absolute-path">IsClippedToBounds プロパティを定義する から派生します。

種類 説明 外観
ContentView ContentViewには、Xamarin_Forms ContentView _ContentView_Content" data-linktype="absolute-path">プロパティで設定された 1 つの子が含 Content まれている。 プロパティ Content は、他の派生物を View 含む任意の派生物に Layout 設定できます。 ContentView は主に構造要素として使用され、 の基本クラスとして使用されます Frame

API のドキュメントガイドサンプル
ContentView の例
このページの C# コードXAML ページ
Frame クラス Frame は から派生し ContentView 、その子の周囲に境界線 (フレーム) を表示します。 クラスには、既定の Frame Xamarin_Forms Frame _Layout_Padding" data-linktype="absolute-path">値 20 が含まれており、Xamarin_Forms Padding _Frame_BorderColor" data-linktype="absolute-path">、Xamarin_Forms _Frame_CornerRadius" データ リンク BorderColorPadding タイプ="absolute-path">、Xamarin_Forms CornerRadius _Frame_HasShadow" data-linktype="absolute-path">HasShadow プロパティも定義します。

API のドキュメントガイドサンプル
フレームの
このページの C# コードXAML ページ
ScrollView ScrollView は、その内容をスクロールできます。 Xamarin_Forms _ScrollView_Content" data-linktype="absolute-path">プロパティを、画面に収まらない大きすぎるビューまたはレイアウト Content に設定します。 (の内容は ScrollView 、多くの場合、 StackLayout です)。 Xamarin_Forms _ScrollView_Orientation" data-linktype="absolute-path">プロパティを設定して、スクロールを垂直、水平、または両方にする必要があるかどうかを Orientation 示します。

API のドキュメントガイドサンプル
ScrollView の例
このページの C# コードXAML ページ
TemplatedView TemplatedView はコントロール テンプレートを使用してコンテンツを表示し、 は の基本クラスです ContentView

API のドキュメントガイド
TemplatedView
ContentPresenter ContentPresenter は、表示されるコンテンツが表示される場所をマークするために 内で使用される、テンプレート ビューのレイアウト ControlTemplate マネージャーです。

API のドキュメントガイド
ContentPresenter の例

複数の子を持つレイアウト

これらのクラスは、 から派生します Layout<View>

種類 説明 外観
StackLayout StackLayoutは、Xamarin_Forms StackLayout _StackLayout_Orientation" data-linktype="absolute-path">プロパティに基づいて、スタック内の子要素を水平方向または垂直方向に配置 Orientation します。 Xamarin_Forms_StackLayout_Spacing" data-linktype="absolute-path">プロパティは、子間の間隔を制御し、既定値は Spacing 6 です。

API のドキュメントガイドサンプル
StackLayout の例
このページの C# コードXAML ページ
Grid Grid は、行と列のグリッドに子要素を配置します。 子の位置は、添付プロパティ 、および を使用 ColumnRowSpan して示されます ColumnSpan

API のドキュメントガイドサンプル
グリッドの例
このページの C# コードXAML ページ
AbsoluteLayout AbsoluteLayout は、子要素をその親に対して相対的な特定の場所に配置します。 子の位置は、添付プロパティ とを使用して示 されます LayoutFlags 。 は AbsoluteLayout 、ビューの位置をアニメーション化する場合に便利です。

API のドキュメントガイドサンプル
AbsoluteLayout の例
このページの C# コードコードの背後にある XAMLページ
RelativeLayout RelativeLayout は、子要素をそれ自体または兄弟に RelativeLayout 対して相対的に配置します。 子の位置は、 型および 型のオブジェクトに 設定 された添付プロパティを使用して示 されます BoundsConstraint

API のドキュメントガイドサンプル
RelativeLayout の例
このページの C# コードXAML ページ
FlexLayout FlexLayoutは CSS フレキシブル ボックス レイアウトFlexLayoutづいており、一般にflex layoutまたはflex-box と呼ばれる。 FlexLayout では、6 つのバインド可能なプロパティと 5 つのアタッチされたバインド可能なプロパティが定義されています。このプロパティを使用すると、子を多数の配置オプションと向きオプションで積み重ねまたはラップできます。

API のドキュメントガイドサンプル
FlexLayout の例
このページの C# コードXAML ページ