XAML の概要

XAML (拡張アプリケーション マークアップ言語) は、WinUI アプリで UI を定義するために使用される宣言型マークアップ言語です。 UI の構造とプロパティを .xaml ファイルで記述し、ペアの分離コード ファイルでロジックとイベントを処理します。

XAML とは

XAML は、オブジェクトを作成し、そのプロパティを設定するための XML ベースの言語です。 マークアップで UI 要素 (ボタン、テキスト ボックス、レイアウト) を宣言し、分離コード ファイルを使用してイベントに応答し、実行時にそれらの要素を操作します。

XAML はテキスト ベースのインターチェンジ形式であるため、デザイナーと開発者は個別に作業できます。デザイナーは XAML でビジュアル構造を作成し、開発者は分離コードでロジックを結び付け、両方を互いにブロックすることなく反復処理できます。

基本的な XAML 構文

すべての有効な XAML も有効な XML ですが、XAML では独自の概念が上に追加されます。 たとえば、 プロパティ要素の構文 を使用すると、属性文字列ではなく入れ子になった XML 要素としてプロパティを設定できます。有効な XML ですが、XAML では特別な意味を持ちます。

構文の詳細については、 XAML 構文ガイドを参照してください。

XAML と Visual Studio

Visual Studioの XAML エディターは、IntelliSense、オートコンプリート、ビジュアル デザイン サーフェイスを提供します。 コンパイルを行う前に、エラーは波線としてインラインで表示されます。 すべての構文規則を暗記する必要はありません。IDE がガイドします。

XAML 名前空間

各 XAML ファイルは、ルート要素で名前空間を宣言します。 一般的な WinUI ページは、次の 2 つから始まります。

<Page
    x:Class="Application1.BlankPage"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
>

• 既定の名前空間 (xmlns=): すべての組み込みの WinUI コントロール、テキスト、グラフィックス、データ バインディング、およびスタイルの種類が含まれます。 ほとんどの XAML では、プレフィックスなしでこの名前空間が使用されます。
• XAML 言語名前空間 (xmlns:x=): x: プレフィックスにマップされ、コア言語機能を提供します。

x:名前空間

カスタム型のマッピング

XAML で独自の型またはサードパーティのライブラリ型を使用するには、コード名前空間にマップする名前空間プレフィックスを宣言します。

xmlns:myTypes="using:myCompany.myTypes"

次に、プレフィックスを使用してこれらの型を参照します。

<myTypes:CustomButton/>

C++/CX に関する考慮事項など、詳細については、 XAML 名前空間と名前空間マッピングに関するページを参照してください。

デザイナーおよび互換性名前空間

ツールで生成された XAML では、多くの場合、 d: (デザイナー) プレフィックスと mc: (マークアップ互換性) プレフィックスが表示されます。 これらはデザイン時ツールをサポートしており、実行時に無視しても問題ありません。 詳細については、「 その他の XAML 名前空間」を参照してください。

マークアップ拡張

マークアップ拡張を使用すると、共有リソースやデータ バインディングへの参照など、プレーンな文字列として表現できないプロパティにプロパティを設定できます。 これらは中括弧の構文を使用しています:

<Button Style="{StaticResource SearchButtonStyle}"/>

{StaticResource}がないと、Styleを割り当てるために詳細なプロパティ要素構文が必要になります。 マークアップ拡張機能は、XAML を簡潔に保ちます。

XAML Windows ランタイムでは、次のマークアップ拡張機能がサポートされています。

マークアップ拡張は入れ子にすることができます。最も内側が最初に評価されます。

イベント

イベントを属性として指定し、ハンドラー メソッド名を値として指定して、XAML でイベント ハンドラーをアタッチします。

<Button Click="showUpdatesButton_Click">Show updates</Button>

コンパイラは、コードビハインドで正しいデリゲートシグネチャを持つ一致するメソッドを想定しています。

private void showUpdatesButton_Click(object sender, RoutedEventArgs e)
{
    // your code
}

void showUpdatesButton_Click(Windows::Foundation::IInspectable const&, Microsoft::UI::Xaml::RoutedEventArgs const&);

詳細については、「 イベントとルーティング イベントの概要」を参照してください。

リソース ディクショナリ

ResourceDictionaryには、x:Keyで識別される再利用可能なオブジェクト (ブラシ、スタイル、テンプレート) が格納されます。 リソースは、ページのリソース セクションまたは別の .xaml ファイル内に配置できます。 完全な説明については、 ResourceDictionary および XAML リソース参照に関する記事を参照してください。

XAML と XML

XAML は XML のスーパーセットであり、知っておくべきことがいくつかあります。

• 大文字と小文字を区別する: 要素名と属性名は完全に一致している必要があります。
• xml:lang: XAML では有効ですが、解析動作ではなくフレームワーク レベルのランタイム動作にマップされます。
• エンコード: UTF-8 と UTF-16 のみがサポートされています。

XAML 名前スコープ

x:Nameで割り当てられた名前は、名前スコープ内で一意である必要があります。 名前スコープは、コントロール テンプレート内で特に関連し、名前のスコープはページではなくテンプレートに設定されます。 詳細については、 XAML 名前スコープに関するページを参照してください。

パフォーマンスに関するヒント

• 色リテラルを繰り返す代わりに、頻繁に使用されるブラシを SolidColorBrush リソースとして定義します。
• Application.Resources内のページ間で共有されるリソースを配置し、ページ固有のリソースをそのページに対してローカルに保ちます。
• 発送する前に、未使用のリソース ( {StaticResource} 参照のないキー) を削除します。
• コントロール テンプレートのオーバーライドは避けてください。既定値は既に読み込みパフォーマンスが最適化されています。
• 同じピクセルを複数回描画 (オーバードロー) するのではなく、 Border コンテナーとレイアウト コンテナーを使用します。
• ListViewとGridViewには既定の項目テンプレートを使用します。Presenter ロジックは大きなリスト用に調整されます。

詳細については、「 XAML マークアップの最適化」を参照してください。

XAML のデバッグ

.xaml ファイルにブレークポイントを設定することはできませんが、Visual Studio では他のサポートが提供されています:

• デザイン時間: 入力中に、波線やエラー マークがインラインで表示されます。
• ランタイム: 構文解析に失敗すると、XAML ファイルの行番号情報を含む XamlParseException (または C++/CX では同様の構造化例外) がスローされます。

ランタイム エラー処理については、「 C# での WinUI アプリの例外処理」を参照してください。 デバッグ セッションを開始するには、「 デバッグ セッションを開始する」を参照してください。