Chapter 04

ステップ1-2: コントロールの配置

Apterygiformes-zenn
Apterygiformes-zenn
2021.12.10に更新

ツールボックスの表示

ツールボックスを表示します。
左端にツールボックスのタブがあったらクリックします。

ツールボックスが表示されますが、この状態だと一時的に表示されているだけで、他の所を触るとまた隠れてしまうため、ピンの部分を押して横向きから縦向き(ピンで刺した状態)に変えます。

↓↓↓↓↓

もしツールボックスがどこにも見当たらない場合は、メニューの表示 > ツールボックスで表示してください。

ボタンの配置

ツールボックスのコモンWPFコントロールButtonをデザイナーの画面の白いところにドラッグ&ドロップします。

ボタンが配置されました。
同時に下のコード部分も何やら書き換わっています。

画面定義を見る

XAMLの見方・書き方

よく見てみましょう。
これはXAML(ザムル)という画面記述用の言語です。

<タグ名>
</タグ名>

の形式でコントロール(画面の部品)を表現します。

<Window>
  <Grid>
  </Grid>
</Window>

のように入れ子にできます。
中に入れるものがなければ

<タグ名/>

という書き方もできます。

<タグ名 属性名A="" 属性名B="" 属性名C="" />

のように属性(プロパティ)を指定することもできます。

属性(プロパティ)は、

<Button Content="ボタン1" />
  :

であればButtonコントロールのContentプロパティにボタン1を設定するという意味です。

改めてXAMLを見る

改めてXAMLを見てみると、Windowの中にGridがあり、さらにその中にButtonがある構造になっています。
Windowにはタイトルのテキスト、ウィンドウ高さ、ウィンドウ幅が設定されています。
ButtonContentに設定されているのはボタンのテキストです。