■初めに

.NET Core 3.1とVisual Studioで基本的なコントロールを使ってみます。

■環境

Windows 10
Visual Studio 2019
.NET Core 3.1

■画面作成

まず、こちらを参考に「準備」と「プロジェクトの作成」をしてください。

そして以下のようにコントロールを配置し、コードを書きます。

◇コントロール

Button（ボタン）

普通のボタンです。

サンプルでは押すとメッセージボックスを表示します。

RepeatButton（リピートボタン）

長押しボタンです。押している間、クリックイベントが連続して発生します。
ツールボックスには表示されていないのでタグ手打ちで追加します。

サンプルでは押している間、タイトルバーに★を追加し続けます。

ToggleButton（トグルボタン）

ON/OFFを表せるボタンです。通常の状態と押されたままの状態をとることができます。
機能的にチェックボックスでも代用できます。
ツールボックスには表示されていないのでタグ手打ちで追加します。

CkeckBox（チェックボックス）

トグルボタンと同様、チェックが付いた状態とチェックなしの状態をとることができます。

ComboBox（コンボボックス）

複数の選択肢の中から項目を選択できます。
ドロップダウンリストは通常閉じているので省スペースです。

ListBox（リストボックス）

スペースに余裕がある場合はコンボボックスよりこちらの方がリストを開く手間が省けます。

Label（ラベル）

表示用のテキストコントロールです。
項目の名前表示などに使います。

TextBox（テキストボックス）

テキスト入力用のコントロールです。

RadioButton（ラジオボタン）

複数の選択肢の中から1つを選ぶときに使います。

◇レイアウト用コントロール

Grid（グリッド）

格子状に領域を区切って配置できます。

サンプルでは列の分割は使っておらず、RowDefinitionで3行に分割しています。

StackPanel（スタックパネル）

コントロールを縦並びまたは横並びに配置できます。

DockPanel（ドックパネル）

コントロールを上、下、左、右、その他に配置できます。

サンプルではテキストボックスを画面サイズに合わせて表示するために使用しています。

WrapPanel（ラップパネル）

コントロールを左から右に配置していき、右に入らなかったら折り返して次の行に配置します。

上の黄色背景が横配置のStackPanel、下の青背景がWrapPanelです。

幅が狭くなった時、StackPanelは見切れてしまいますが、WrapPanelは折り返して表示されます。

◇ウィンドウ

Window（フォーム、画面）です。

サンプルではウィンドウのサイズ変更がしやすいようにグリップを表示するよう、
ResizeModeプロパティにCanResizeWithGripを設定しています。

細いウィンドウ縁を掴まなくても、右下の三角でサイズ変更できるようになります。

◇スタイル

複数の同種のコントロールに同じプロパティ設定をする場合、スタイルとして定義して適用すると楽です。
利用するときは、定義したスタイルの名前（x:Key）をコントロールのStyleプロパティに指定してやります。

◇コード

MainWindow.xaml

<Windowx:Class="WpfAppControls.MainWindow"xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"xmlns:d="http://schemas.microsoft.com/expression/blend/2008"xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"xmlns:local="clr-namespace:WpfAppControls"mc:Ignorable="d"Title="MainWindow"Height="450"Width="800"ResizeMode="CanResizeWithGrip"><Window.Resources><!-- 入力エリアコンテナのスタイル --><Stylex:Key="InputContainer"TargetType="DockPanel"><SetterProperty="LastChildFill"Value="True"/></Style><!-- 入力エリア見出しのスタイル --><Stylex:Key="InputTitleStyle"TargetType="Label"><SetterProperty="Margin"Value="5,5,5,0"/><SetterProperty="Width"Value="60"/><SetterProperty="DockPanel.Dock"Value="Left"/></Style><!-- 入力エリア入力部のスタイル --><Stylex:Key="InputTextStyle"TargetType="TextBox"><SetterProperty="Margin"Value="0,5,5,0"/><SetterProperty="DockPanel.Dock"Value="Right"/></Style><!-- ラジオボタンの既定スタイル --><StyleTargetType="RadioButton"><SetterProperty="Margin"Value="10"/><SetterProperty="Foreground"Value="Blue"/></Style></Window.Resources><Grid><Grid.RowDefinitions><RowDefinition/><RowDefinitionHeight="Auto"/><RowDefinitionHeight="Auto"/></Grid.RowDefinitions><StackPanelBackground="Honeydew"><ButtonContent="Button"Width="100"Click="Button_Click"/><RepeatButtonContent="リピートボタン"Width="100"Click="RepeatButton_Click"/><ToggleButtonContent="トグルボタン1"Width="100"/><ToggleButtonContent="トグルボタン2"Width="100"/><ToggleButtonContent="トグルボタン3"Width="100"/><CheckBoxContent="チェックボックス"IsChecked="True"Margin="5"/><ComboBoxSelectedIndex="0"Width="150"HorizontalAlignment="Left"Margin="5"><ComboBoxItemContent="イチゴ"/><ComboBoxItemContent="キウイ"/><ComboBoxItemContent="メロン"/></ComboBox><ListBoxSelectedIndex="0"Width="200"Height="55"HorizontalAlignment="Left"Margin="5"><ListBoxItemContent="あいうえお"/><ListBoxItemContent="かきくけこ"/><ListBoxItemContent="さしすせそ"/><ListBoxItemContent="たちつてと"/></ListBox><DockPanelStyle="{StaticResource InputContainer}"><LabelContent="名前："Style="{StaticResource InputTitleStyle}"/><TextBoxText=""Style="{StaticResource InputTextStyle}"/></DockPanel><DockPanelStyle="{StaticResource InputContainer}"><LabelContent="住所："Style="{StaticResource InputTitleStyle}"/><TextBoxText=""Style="{StaticResource InputTextStyle}"/></DockPanel><DockPanelStyle="{StaticResource InputContainer}"><LabelContent="メモ欄："Style="{StaticResource InputTitleStyle}"/><TextBoxText=""Style="{StaticResource InputTextStyle}"/></DockPanel></StackPanel><StackPanelOrientation="Horizontal"Grid.Row="1"Background="LightYellow"><RadioButtonGroupName="g1"Content="ラジオボタンA"IsChecked="True"/><RadioButtonGroupName="g1"Content="ラジオボタンB"/><RadioButtonGroupName="g1"Content="ラジオボタンC"/><RadioButtonGroupName="g1"Content="ラジオボタンD"/><RadioButtonGroupName="g1"Content="ラジオボタンE"/></StackPanel><WrapPanelGrid.Row="2"Background="AliceBlue"><RadioButtonGroupName="g2"Content="ラジオボタン１"/><RadioButtonGroupName="g2"Content="ラジオボタン２"IsChecked="True"/><RadioButtonGroupName="g2"Content="ラジオボタン３"/><RadioButtonGroupName="g2"Content="ラジオボタン４"/><RadioButtonGroupName="g2"Content="ラジオボタン５"/></WrapPanel></Grid></Window>

MainWindow.xaml.cs

usingSystem.Windows;#nullableenablenamespaceWpfAppControls{/// <summary>/// Interaction logic for MainWindow.xaml/// </summary>publicpartialclassMainWindow:Window{publicMainWindow(){InitializeComponent();}/// <summary>/// ボタンクリック時の処理/// </summary>/// <param name="sender"></param>/// <param name="e"></param>privatevoidButton_Click(objectsender,RoutedEventArgse){MessageBox.Show("ボタンが押されました");}/// <summary>/// リピートボタンクリック時の処理/// </summary>/// <param name="sender"></param>/// <param name="e"></param>privatevoidRepeatButton_Click(objectsender,RoutedEventArgse){// タイトルバーに★を追加Title+="★";}}}