ゲストさん、こんにちは

高級アプリ製作の極意　～WPF編～ のお部屋へようこそ。
このお部屋では  第４章   の「  アプリ製作の流れ  」についてお話したいと思います。

まずは前回作成したソリューションを開いてみましょう
もう開いてるって　・・・ではでは始めましょう

アプリの製作において大事なことはユーザーインターフェースを設置することです
操作できなきゃウィンドウなんていらないし見せる必要もないからねっ

それじゃ、シンプルな ラベル(Label) を配置してみましょう。
 ツールボックスを選ぶ
　※ツールボックスが表示されていない時は「表示(V)」から「ツールボックス(X)」を選んでください。又はCtri+Alt+Xを押すと表示されるよ
 Labelを探します
 MainWindow.xamlを開いてアクティブにしている状態にして、表示されているウィンドウにマウスでドラッグアンドドロップで貼り付けます
 デザイン画面にLabelの文字のユーザーインターフェースが表示されてXAMLのウィンドウにLabelのタグが記述されます

どんな種類のユーザーインターフェースがあって、どんなことが出来るかについてですが・・・
数が多いので複数回に分けてご紹介します
最初は第６章「基本ユーザーインタフェース」で紹介しますのでお楽しみに

次は配置したLabelの設定を変更してみます

Labelは主に説明に利用します。
上の画像はひとつ前の画像から２つの変更を行いました
１つは、表示文字を"Label"から"Contentに表示したい文字列を設定します"に変えました
もう１つは、位置を画面の左上から10x10離した位置に配置を移動しました

デザイン上とXAML上の相対関係を説明しますね。
先に、XAMLは XML構文と同じ なので <タグ></タグ> という書き方と <タグ /> という書き方ができます。
なお、タグと書いたところは エレメント と言います。
また、<タグ 名前="値" />と書く場合の名前は アトリビュート で"値"は バリュー です。
バリューは必ず ダブルクオーテーション(") で挟んで指定します。

紫 ：Contentというアトリビュートに任意の文字を設定することで表示文字を変更できます
黄緑 ：Labelを左基準で配置することを指定しています
赤 ：Labelを上基準で配置することを指定しています
水色 と 青 ：Marginのアトリビュートは配置位置指定が行えてカンマ(,)区切りで４つのバリューを指定します。
左から、"左,上,右,下"の位置のバリューを指定します。
今回のLabelは黄緑の左基準と赤の上基準の設定に基づき、Marginも左と上のみ指定しています。
結果、ウィンドウの左から10ピクセルと上から１０ピクセルの位置にLabelが表示されました。


アプリと言えば テキスト入力 でしょ

と言うことでテキスト入力機能を実装するためにTextboxをツールボックスから貼り付けました。
配置まではLabelの時と同じなので省略しています

 Textboxを配置して表示されているデザインとXAMLです
デフォルトでTextのアトリビュートには"Textbox"という文字が入っていますが最初からTextboxなんて文字が入力された怪しいツールはそこらに存在しませんのであえて削除しました

TextboxはLabelと違って最初から位置だけでなく、横幅と縦幅が指定されています
横幅と縦幅の指定はWidthとHeightのアトリビュートです
上記の画像では横幅だけ224pixelまで引き延ばしました、大きさに意味はないけどね

こんな形で ユーザーインターフェースをどんどん配置していって提供したい機能を実装 します
今回はユーザーインターフェースの見た目の作成のみ説明しました。
なので次回は実際に ソースコードを書いていきます よ