Xamarin.Forms レイアウト

  • [アーティクル]

サンプルのダウンロードサンプルのダウンロード

Xamarin.Forms レイアウトは、ユーザー インターフェイス コントロールを視覚的な構造に構成するために使用されます。

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

Xamarin.Forms レイアウトの種類

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

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

これらのクラスは、 および IsClippedToBounds プロパティをPadding定義する からLayout派生します。

種類 説明 外観
ContentView ContentView には、 プロパティで設定 Content された 1 つの子が含まれています。 プロパティはContent、他Layoutの派生物を含む任意Viewの派生物に設定できます。 ContentView は主に構造要素として使用され、 の Frame基底クラスとして機能します。

API ドキュメント / ガイド / サンプル		 ContentView のサンプル
このページ / の C# コードXAML ページ
Frame クラスは Frame から ContentView 派生し、子の周囲に境界線 (フレーム) を表示します。 クラスの既定値は Frame 20 で、および HasShadow の各プロパティも定義されますBorderColorCornerRadius。Padding

API ドキュメント / ガイド / サンプル		 フレームの例
このページ / の C# コードXAML ページ
ScrollView ScrollView は、その内容をスクロールできます。 プロパティを Content ビューまたはレイアウトに設定すると、画面に収まりません。 (の内容 ScrollView は、非常に頻繁に です StackLayout。プロパティを Orientation 設定して、スクロールを垂直、水平、またはその両方にするかどうかを示します。

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

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

API ドキュメント / ガイド		 ContentPresenter Example

複数の子を含むレイアウト

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

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

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

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

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

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

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