UWP-004 XAML

タグの構文を見ればXAMLとUIとの相関関係はおおよそわかると思います。ですので、ここではパッと見ただけではわかりにくいところについて解説をします。

まずは、C#とXAMLの性質についてです。前の動画ではXAMLはHTMLと同様に見た目を定義するといいましたが、間違ってはいません。そもそも、XAMLは拡張XMLです。XAMLは2つのシステム間でのデータ転送の手段で使われ、スキーマを定義することで、同じルールを使うシステム間で通信ができます。

XAMLはXMLの特殊パターンです。HTMLのようですが大きな違いは、XAMLではクラスのインスタンスを作成してそのプロパティの値はを設定します。

前のレッスンで作ったTextBlock と同じような形で、画面に赤いボタンを追加しました。このボタンをダブルクリックするとClickイベントのハンドラが表示されるので、TextBlock のTextプロパティを設定します。実行してボタンを押すとテキスト変わります。

次に追加したボタンを <!-- -->で挟んでコメントアウトします。Visual Studio のデフォルトでは緑のコメントになります。

では次にGrid コントロールをプログラムから操作するために、Grid に LayoutGrid の名前を設定します。

次は、Page クラスに Loaded イベントを loaded = “Page_Loaded” と記載して追加します。

ここでF12を押すとイベントハンドラが開きます。ここで、C#で Button インスタンスを作り、プロパティを設定するコードを記載します。

実行するとXMLと同じ機能を実行します。個々でのポイントは、約12行のC#コードを、XAMLのたった1行のみでえ定義することができるところです。