古いWinFormsデスクトップアプリケーションをWPFに移植しています。アプリのGUIは、WinFormのPictureBox
を使用して画像を表示しました。古いWinFormsアプリには、すべてのPictureBoxのOnClick
イベントハンドラーもありました。画像をクリックすると、実際に重要なことが行われました。 WPFでUIを再実行しているので、WinFormのPictureBox
コントロールに相当するものはWPFのImage
であることが this によってわかりました。しかし、WPF Image
のプロパティパネルを開いたときに、処理するclick
イベントがなかったため、WinFormsのようにクリックイベントハンドラーを作成できませんでした。
では、WinFormのPictureBox
に相当するものを実現するために何ができるか、およびWPFのクリックイベントについて教えていただけますか?画像を表示し、ユーザーが画像をクリックするたびにケースを処理したい。
WPFでは、各コントロールに既定のテンプレート(外観)がありますが、これらのテンプレートを簡単に変更して、コントロールを希望どおりにすることができます。これにより、その機能によってコントロールを簡単に選択して、希望どおりに表示することができます。あなたの場合はClick
が必要なので、Button
を選択してTemplate
を変更します
<Window ...>
<Window.Resources>
<Style TargetType="{x:Type Button}" x:Key="ImageButtonStyle">
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type Button}">
<ContentPresenter/>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
</Window.Resources>
<Button Style="{StaticResource ImageButtonStyle}" Click="ImageButton_Click">
<Image Source="..."/>
</Button>
</Window>
上記のXAMLを使用すると、Image
がButton
になります
[〜#〜]編集[〜#〜]
以下は、Image.Source
をバインド/変更する方法の簡単なバージョンです。MainWindowですべてが行われますが、基本的にWPFではコントロールを操作せず、Binding
を使用してプロパティをバインドし、これらのプロパティを操作します。通常は、専用クラス(ViewModel)を作成します。クラスは INofityPropertyChanged
インターフェースを実装する必要があり、DataContext
はそれに応じて設定する必要があり、バインドされたプロパティは値が変更されるたびにINofityPropertyChanged.PropertyChanged
イベントを発生させる必要があります(これは、UIに値を更新するよう通知する方法です)
public partial class MainWindow : Window, INotifyPropertyChanged
{
public MainWindow()
{
InitializeComponent();
DataContext = this;
}
private ImageSource _myImageSource;
public ImageSource MyImageSource
{
get { return _myImageSource; }
set
{
_myImageSource = value;
OnPropertyChanged("MyImageSource");
}
}
private void ImageButton_Click(object sender, RoutedEventArgs e)
{
this.MyImageSource = new BitmapImage(...); //you change source of the Image
}
public event PropertyChangedEventHandler PropertyChanged;
private void OnPropertyChanged(string propertyName)
{
var handler = PropertyChanged;
if (handler != null) handler(this, new PropertyChangedEventArgs(propertyName));
}
}
xAMLでは:
<Button Style="{StaticResource ImageButtonStyle}" Click="ImageButton_Click" Width="..." Height="...">
<Image Source="{Binding MyImageSource}"/>
</Button>
画像にMouseDownイベントを追加するだけです
<Image x:Name=aPicture Source="mypic.jpg" MouseDown="aPicture_MouseDown"/>
これはあなたのコードにこれを追加するはずです
private void aPicture_MouseDown(object sender, MouseEventArgs e)
{
//do something here
}
多分MouseLeftButtonDownの方が適切でしょう。
完全にクリック可能なエクスペリエンスを実現するには、CurseプロパティをHandに設定してCJKメソッドを使用することをお勧めします。
<Image x:Name="btnSearch" Source="/Images/search/search.png" MouseDown="btnSearch_MouseDown" Cursor="Hand"/>