Xaml-custom-controls
XAML-カスタムコントロール
XAMLには、カスタムコントロールを作成するために提供される最も強力な機能の1つがあり、機能豊富でカスタマイズ可能なコントロールを非常に簡単に作成できます。 カスタムコントロールは、Microsoftが提供するすべてのビルトインコントロールが基準を満たしていない場合、またはサードパーティのコントロールの支払いを希望しない場合に使用されます。
この章では、カスタムコントロールを作成する方法を学習します。 カスタムコントロールを確認する前に、まずユーザーコントロールを簡単に確認します。
ユーザー管理
ユーザーコントロールは、さまざまな組み込みコントロールを収集して組み合わせ、再利用可能なXAMLにパッケージ化する手法を提供します。 ユーザーコントロールは、次のシナリオで使用されます-
- コントロールが既存のコントロールで構成されている場合、つまり、複数の既存のコントロールの単一のコントロールを作成できます。
- コントロールがテーマのサポートを必要としない場合。 ユーザーコントロールは、複雑なカスタマイズ、コントロールテンプレートをサポートせず、スタイル設定も困難です。
- 開発者が、イベントハンドラーの背後にビューと直接コードが記述される分離コードモデルを使用してコントロールを記述することを好む場合。
- アプリケーション間でコントロールを共有することはありません。
ユーザーコントロールの例を見て、以下の手順に従ってください-
- *ステップ1 *-新しいWPFプロジェクトを作成し、ソリューションを右クリックして、[追加]> [新しいアイテム…]を選択します。
- ステップ2 *-次のダイアログが開き、*ユーザーコントロール（WPF）*を選択して、 *MyUserControl という名前を付けます。
- *ステップ3 *-[追加]ボタンをクリックすると、2つの新しいファイル（MyUserControl.xamlおよびMyUserControl.cs）がソリューションに追加されます。
以下に示すのは、MyUserControl.xamlファイルのいくつかのプロパティでボタンとテキストボックスが作成されるXAMLコードです。
<UserControl x:Class = "XAMLUserControl.MyUserControl"
xmlns = "http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x = "http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:mc = "http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:d = "http://schemas.microsoft.com/expression/blend/2008"
mc:Ignorable = "d" d:DesignHeight = "300" d:DesignWidth = "300">
<Grid>
<TextBox Height = "23" HorizontalAlignment = "Left"
Margin = "80,49,0,0" Name = "txtBox" VerticalAlignment = "Top" Width = "200"/>
<Button Content = "Click Me" Height = "23"
HorizontalAlignment = "Left" Margin = "96,88,0,0" Name = "button"
VerticalAlignment = "Top" Width = "75" Click = "button_Click"/>
</Grid>
</UserControl>以下は、テキストボックスを更新するMyUserControl.csファイルのボタンクリックイベントのC＃コードです。
using System;
using System.Windows;
using System.Windows.Controls;
namespace XAMLUserControl {
///<summary>
///Interaction logic for MyUserControl.xaml
///</summary>
public partial class MyUserControl : UserControl {
public MyUserControl() {
InitializeComponent();
}
private void button_Click(object sender, RoutedEventArgs e) {
txtBox.Text = "You have just clicked the button";
}
}
}次に、ユーザーコントロールを追加するMainWindow.xamlの実装を示します。
<Window x:Class = "XAMLUserControl.MainWindow"
xmlns = "http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x = "http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:control = "clr-namespace:XAMLUserControl"
Title = "MainWindow" Height = "350" Width = "525">
<Grid>
<control:MyUserControl/>
</Grid>
</Window>上記のコードをコンパイルして実行すると、次の出力が生成されます-
[Click Me]ボタンをクリックすると、テキストボックスのテキストが更新されていることがわかります。
カスタムコントロール
カスタムコントロールは、 generic.xaml で通常定義される独自のスタイルとテンプレートを提供するクラスです。 カスタムコントロールは、次のシナリオで使用されます。
- コントロールが存在せず、ゼロから作成する必要がある場合。
- 特定のシナリオに合わせてプロパティまたは機能を追加して、既存のコントロールに機能を拡張または追加する場合。
- コントロールがテーマとスタイリングをサポートする必要がある場合。
- アプリケーション間で制御を共有したい場合。
カスタムコントロールの例を見て、以下の手順に従ってください。
- *ステップ1 *-新しいWPFプロジェクトを作成し、ソリューションを右クリックして、[追加]> [新しいアイテム…]を選択します。
- ステップ2 *-次のダイアログボックスが開きます。 ここで、 Custom Control（WPF）を選択し、 *MyCustomControl という名前を付けます。
- *ステップ3 *-[追加]ボタンをクリックすると、2つの新しいファイル（Themes/Generic.xamlおよびMyCustomControl.cs）がソリューションに追加されます。
Generic.xamlファイルのカスタムコントロールにスタイルが設定されているXAMLコードを以下に示します。
<ResourceDictionary
xmlns = "http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x = "http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local = "clr-namespace:XAMLCustomControls">
<Style TargetType = "{x:Type local:MyCustomControl}"
BasedOn = "{StaticResource {x:Type Button}}">
<Setter Property = "Background" Value = "LightSalmon"/>
<Setter Property = "Foreground" Value = "Blue"/>
</Style>
</ResourceDictionary>以下に示すのは、ボタンクラスから継承されるMyCustomControlクラスのC＃コードであり、コンストラクターでメタデータをオーバーライドします。
using System;
using System.Windows;
using System.Windows.Controls;
namespace XAMLCustomControls {
public class MyCustomControl : Button {
static MyCustomControl() {
DefaultStyleKeyProperty.OverrideMetadata(typeof(MyCustomControl),
new FrameworkPropertyMetadata(typeof(MyCustomControl)));
}
}
}以下は、テキストブロックのテキストを更新するC＃のカスタムコントロールクリックイベントの実装です。
using System;
using System.Windows;
using System.Windows.Controls;
namespace XAMLCustomControls {
///<summary>
///Interaction logic for MainWindow.xaml
///</summary>
public partial class MainWindow : Window {
public MainWindow() {
InitializeComponent();
}
private void customControl_Click(object sender, RoutedEventArgs e) {
txtBlock.Text = "You have just click your custom control";
}
}
}次に、カスタムコントロールとTextBlockを追加するMainWindow.xamlの実装を示します。
<Window x:Class = "XAMLCustomControls.MainWindow"
xmlns = "http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x = "http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:control = "clr-namespace:XAMLCustomControls" Title = "MainWindow"
Height = "350" Width = "604">
<StackPanel>
<control:MyCustomControl x:Name = "customControl"
Content = "Click Me" Width = "70" Margin = "10" Click = "customControl_Click"/>
<TextBlock Name = "txtBlock" Width = "250" Height = "30"/>
</StackPanel>
</Window>上記のコードをコンパイルして実行すると、次の出力が生成されます。 出力に、カスタマイズされたボタンであるカスタムコントロールが含まれていることを確認します。
次に、カスタマイズされたボタンをクリックします。 テキストブロックテキストが更新されていることがわかります。
