ここでは、Windowsフォームアプリケーション用サンプルコードをWPFアプリケーション用コードに変換します。フォームアプリケーションからWPFアプリケーションへの変化が最近の主流のようです。
参照元情報「ピクチャ ビューアーの作成」にジャンプする
「WPF - Windows フォーム用のコントロールを使う」にジャンプする
作成方法の詳細は上記を参照願います。
フォームアプリケーションからWPFアプリケーションへの変更若干の変更でフォームアプリケーションからWPFアプリケーションへの変更ができます。
完成ファイルは以下からダウンロードできます。
ダウンロード後は解凍してから使用してください。
[WPFピクチャ ビューアーの作成]をダウンロードする。解凍すると「31WpfAPictureViewer」フォルダーがあります。
注（１）「31WpfAPictureViewer」フォルダーの「WpfAPictureViewer.sln」ファイルをダブルクリックすると「Express 2012 for Windows Desktop」が起動します。
注（２）メニューの「ウインド」＿「ウインドレイアウトのリセット」で標準に戻ります。
注（３）「ソリューションエクスプローラ」ウインドウ内の「MainWindow.xaml」をダブルクリックすると「デザイン」と「XAML」が表示されます。
注（４）メニューの「表示」＿「コード」を選択するとコードが表示されます。
注（５）「WpfAPictureViewer.sln」の動作確認は「デバッグ」＿「デバッグ開始」で実行します。デバッグ機能を用いて動作確認を行います。
WpfAPictureViewer.slnの実行（１）「Express 2012 for Windows Desktop」のデバッグ機能を使用します。
（２）「デバッグ」＿「デバッグ開始」を選択します。
（３）MainWindow画面が表示されます。
（２）「Show a picture」ボタンを押します。
（３）OpenFileDialogが表示されますので、画像ファイルを選択し開きます。
（４）選択した画像が表示されます。
（５）最大化ボタンを押すとウインドウは画面いっぱいに広がります。
（６）Strech（CheckBox)のチェックをはずすと縦横比が変化します。
（７）チェックをいれた状態でSet thebackground colorボタンを押すとColorＤｉａａｌｏｇが表示されます。
（８）色を選択しＯＫボタンを押すと背景色が変わります。
（９）Clear the pictureボタンを押すと背景色のみになります。
（１０）Closeボタンをおすとプログラムは終了します。
プロジェクトの構成（１）UserControl1.vbの構成
・OpenFileDialog1とColorDialog1とPicturBox1を配置します。
（２）XAMLコードの構成
・UserControl1とCheckBoxとButtonを配置します。
注：OpenFileDialog1とColorDialog1とPicturBox1がフォームアプリケーション用のツールとなります。
MainWindow.xamlの全コード
<Window x:Class="MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:wf="clr-namespace:System.Windows.Forms;assembly=System.Windows.Forms"
xmlns:self="clr-namespace:WpfAPictureViewer"
Title="MainWindow" Height="350" Width="525">
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="*" />
<RowDefinition Height="30" />
</Grid.RowDefinitions>
<WindowsFormsHost x:Name="wfHost" Grid.Row="0">
<self:UserControl1 x:Name="myControl" />
</WindowsFormsHost>
<StackPanel Grid.Row="1" Name="StackPanel1" Orientation="Horizontal">
<CheckBox Content="Stretch" Height="16" Width="100" Name="CheckBox1" IsChecked="True" />
<Button Content="Show a picture" Height="23" Name="Button1" />
<Button Content="Clear the picture" Height="23" Name="Button2" />
<Button Content="Set the background color" Height="23" Name="Button3" />
<Button Content="Close" Height="23" Name="Button4" />
</StackPanel>
</Grid>
</Window>
MainWindow.xamlコードの解説（１）<Window>階層1：クラス：以下の記載が特別です。
xmlns:wf="clr-namespace:System.Windows.Forms;assembly=System.Windows.Forms"
上記の記載はMaskedTextBoxクラスを使用するための記載です。MaskedTextBoxクラスは名前空間が System.Windows.Formsであり具体的にはsystem.windows.forms.dll 内にあると思われます。
xmlns:self="clr-namespace:WpfAPictureViewer"
上記の記載はWpfAPictureViewerソリューションを使用するための記載です。
（２） <WindowsFormsHost x:Name="wfHost" Grid.Row="0">
<self:UserControl1 x:Name="myControl" />
</WindowsFormsHost>
上記の記載でUserControl1の使用条件を設定します。名前は"myControl" となります。
（３）<StackPanel Grid.Row="1" Name="StackPanel1" Orientation="Horizontal">
<CheckBox Content="Stretch" Height="16" Width="100" Name="CheckBox1" IsChecked="True" />
<Button Content="Show a picture" Height="23" Name="Button1" />
<Button Content="Clear the picture" Height="23" Name="Button2" />
<Button Content="Set the background color" Height="23" Name="Button3" />
<Button Content="Close" Height="23" Name="Button4" />
</StackPanel>
上記の記載でCheckBoxとButtonを配置します。
MainWindow.xaml.csの全コード
using System.Windows;
namespace WpfAPictureViewer
{
public partial class MainWindow : Window
{
public MainWindow()
{InitializeComponent(); }
private void Button1_Click(object sender, RoutedEventArgs e)
{
if (myControl.OpenFileDialog1.ShowDialog() == System.Windows.Forms.DialogResult.OK)
{myControl.PictureBox1.Load(myControl.OpenFileDialog1.FileName);}
}
private void Button2_Click(object sender, RoutedEventArgs e)
{myControl.PictureBox1.Image = null;}
private void Button3_Click(object sender, RoutedEventArgs e)
{
if (myControl.ColorDialog1.ShowDialog() == System.Windows.Forms.DialogResult.OK)
{ myControl.PictureBox1.BackColor = myControl.ColorDialog1.Color;}
}
private void Button4_Click(object sender, RoutedEventArgs e)
{ Close();}
private void CheckBox1_Checked(object sender, RoutedEventArgs e)
{ myControl.PictureBox1.SizeMode = System.Windows.Forms.PictureBoxSizeMode.Zoom;}
private void CheckBox1_Unchecked(object sender, RoutedEventArgs e)
{ myControl.PictureBox1.SizeMode = System.Windows.Forms.PictureBoxSizeMode.StretchImage;}
}
}
MainWindow.xaml.csコードの解説（１）private void Button1_Click(object sender, RoutedEventArgs e)
{
if (myControl.OpenFileDialog1.ShowDialog() == System.Windows.Forms.DialogResult.OK)
{myControl.PictureBox1.Load(myControl.OpenFileDialog1.FileName);}
}
上記の記載でOpenFileDialog1で選択した画像ファイルをPictureBox1に表示します。
（２） private void Button2_Click(object sender, RoutedEventArgs e)
{myControl.PictureBox1.Image = null;}
上記の記載でPictureBox1の画像を消去します。
（３）private void Button3_Click(object sender, RoutedEventArgs e)
{
if (myControl.ColorDialog1.ShowDialog() == System.Windows.Forms.DialogResult.OK)
{ myControl.PictureBox1.BackColor = myControl.ColorDialog1.Color;}
}
上記の記載でColorDialog1で選択した色を背景色に設定します。
（４）private void Button4_Click(object sender, RoutedEventArgs e)
{ Close();}
上記の記載でプログラムを終了します。
（５）private void CheckBox1_Checked(object sender, RoutedEventArgs e)
{ myControl.PictureBox1.SizeMode = System.Windows.Forms.PictureBoxSizeMode.Zoom;}
上記の記載でPictureBox1をZoomモードに設定します。
（６）private void CheckBox1_Unchecked(object sender, RoutedEventArgs e)
{ myControl.PictureBox1.SizeMode = System.Windows.Forms.PictureBoxSizeMode.StretchImage;}
上記の記載でPictureBox1をStretchImageモードに設定します。
Public Class UserControl1クラスのコードPublic Class UserControl1クラスのコードの記載はありません。
感想：
（１）UserControlを使用することにより、簡単にWPFアプリケーションに変換できます。
３２章：WPF迷路の作成に行く。