チュートリアル : サードパーティの Windows フォームコントロールの WPF アプリケーションでのホスト

[アーティクル]
09/30/2008

更新 : 2007 年 11 月

このチュートリアルでは、Windows Presentation Foundation (WPF) Designer for Visual Studio を使用して、サードパーティの Windows フォームコントロールを WPF アプリケーションでホストする方法について説明します。Windows フォームと WPF 間の相互運用性の詳細については、「移行と相互運用性」を参照してください。

このチュートリアルでは、MonthCalendar コントロールを、サードパーティコントロールとして使用します。Controls コレクション内に MonthCalendar コントロールのインスタンスを持つ UserControl 型を作成します。UserControl 型が Date プロパティを公開し、MonthCalendar コントロールの動作を定義するカスタムロジックを実装します。WPF アプリケーションでは、TextBlock 要素は Date プロパティにバインドされます。

このチュートリアルでは次のタスクを行います。

WPF プロジェクトを作成する。
サードパーティコントロールをカプセル化する Windows フォームユーザーコントロールを作成する。
Windows フォームユーザーコントロールを WPF アプリケーションでホストする。

最終的なアプリケーションを次の図に示します。

ホストされている Windows フォームコントロール

メモ :
使用している設定またはエディションによっては、ヘルプの記載と異なるダイアログボックスやメニューコマンドが表示される場合があります。設定を変更するには、[ツール] メニューの [設定のインポートとエクスポート] をクリックします。詳細については、「Visual Studio の設定」を参照してください。

使用している設定またはエディションによっては、ヘルプの記載と異なるダイアログボックスやメニューコマンドが表示される場合があります。設定を変更するには、[ツール] メニューの [設定のインポートとエクスポート] をクリックします。詳細については、「Visual Studio の設定」を参照してください。

前提条件

このチュートリアルを完了するには、次のコンポーネントが必要です。

Visual Studio 2008。

WPF プロジェクトの作成

最初に、ホストアプリケーションとして WPF プロジェクトを作成します。

プロジェクトを作成するには

Visual Basic または Visual C# で HostingMonthCalendar という名前の WPF アプリケーションプロジェクトを作成します。詳細については、「方法 : 新しい WPF アプリケーションプロジェクトを作成する」を参照してください。

WPF デザイナで Window1.xaml が開きます。
ソリューションエクスプローラで、WindowsFormsIntegration.dll という名前の WindowsFormsIntegration アセンブリへの参照を追加します。

Windows フォームの複合コントロールの作成

ここでは、UserControl クラスから派生する型によって複合コントロールを作成する方法について説明します。

Windows フォームの複合コントロールを作成するには

Visual Basic または Visual C# の VendorControlLibrary という名前の新しい Windows フォームコントロールライブラリプロジェクトをソリューションに追加します。詳細については、「方法 : ソリューション項目を追加および削除する」を参照してください。

Windows フォームデザイナで、UserControl1 が開きます。
ソリューションエクスプローラで、UserControl1 ファイルを右クリックし、[名前の変更] をクリックします。
コントロールの名前を VendorControl に変更します。すべての参照名を変更するかどうかを確認するメッセージが表示されたら、[はい] をクリックします。
Windows フォームデザイナで、VendorControl を開きます。
デザインサーフェイス上で VendorControl を選択します。
[プロパティ] ウィンドウで、Size プロパティの値を 200,200 に設定します。
ツールボックスの MonthCalendar コントロールをダブルクリックします。

MonthCalendar コントロールがデザインサーフェイスに表示されます。
[プロパティ] ウィンドウで、MonthCalendar コントロールに対して次のプロパティを設定します。

プロパティ

値

Margin

0,0,0,0

ShowToday

False:
Windows フォームデザイナで、VendorControl のサイズを MonthCalendar コントロールのサイズと一致するように設定します。
コードエディタで VendorControl ファイルを開きます。

プロパティ	値
Margin	0,0,0,0
ShowToday	False:

既存のコードを次のコードに置き換えます。このコードは、Date プロパティを定義し、さらに、MonthCalendar コントロールの日付範囲プロパティである SelectionStart と SelectionEnd を TodayDate と同じ値にするロジックを定義します。また、このコードにより、WPF データバインディングで使用される INotifyPropertyChanged インターフェイスが実装されます。

Imports System
Imports System.Collections.Generic
Imports System.ComponentModel
Imports System.Drawing
Imports System.Data
Imports System.Linq
Imports System.Text
Imports System.Windows.Forms

Public Class VendorControl
    Inherits UserControl
    Implements INotifyPropertyChanged

    <Browsable(True)> _
    Public Property [Date]() As String
        Get
            Return Me.MonthCalendar1.TodayDate.ToShortDateString()
        End Get

        Set(ByVal value As String)
            If value <> Me.MonthCalendar1.TodayDate.ToShortDateString() Then
                Dim newDate As DateTime = DateTime.Parse(value)
                Me.SetDate(newDate)
                Me.NotifyPropertyChanged("Date")
            End If
        End Set
    End Property


    Private Sub monthCalendar1_DateChanged( _
        ByVal sender As Object, ByVal e As DateRangeEventArgs) _
    Handles MonthCalendar1.DateChanged
        Me.SetDate(e.Start)
        Me.NotifyPropertyChanged("Date")

    End Sub


    Private Sub SetDate(ByVal [date] As DateTime)
        Me.MonthCalendar1.TodayDate = [date]
        Me.MonthCalendar1.SelectionStart = [date]
        Me.MonthCalendar1.SelectionEnd = [date]

    End Sub

#Region "INotifyPropertyChanged Implementation"

    Public Event PropertyChanged As PropertyChangedEventHandler _
        Implements INotifyPropertyChanged.PropertyChanged

    Private Sub NotifyPropertyChanged(ByVal info As String)
        RaiseEvent PropertyChanged(Me, New PropertyChangedEventArgs(info))
    End Sub

#End Region
End Class

using System;
using System.Collections.Generic;
using System.ComponentModel;
using System.Drawing;
using System.Data;
using System.Linq;
using System.Text;
using System.Windows.Forms;

namespace VendorControlLibrary
{
    public partial class VendorControl : UserControl, INotifyPropertyChanged
    {
        public VendorControl()
        {
            InitializeComponent();
        }

        [Browsable(true)]
        public string Date
        {
            get
            {
                return this.monthCalendar1.TodayDate.ToShortDateString();
            }

            set
            {
                if (value != this.monthCalendar1.TodayDate.ToShortDateString())
                {
                    DateTime newDate = DateTime.Parse(value);
                    this.SetDate(newDate);
                    this.OnPropertyChanged("Date");
                }
            }
        }

        private void monthCalendar1_DateChanged(object sender, DateRangeEventArgs e)
        {
            this.SetDate(e.Start);
            this.OnPropertyChanged("Date");
        }

        private void SetDate(DateTime date)
        {
            this.monthCalendar1.TodayDate = date;
            this.monthCalendar1.SelectionStart = date;
            this.monthCalendar1.SelectionEnd = date;
        }

        #region INotifyPropertyChanged Implementation

        public event PropertyChangedEventHandler PropertyChanged;

        private void OnPropertyChanged(string propertyName)
        {
            if (this.PropertyChanged != null)
            {
                this.PropertyChanged(this, new PropertyChangedEventArgs(propertyName));
            }
        }

        #endregion
    }
}

[ビルド] メニューの [ソリューションのビルド] をクリックして、ソリューションをビルドします。

WPF での Windows フォームコントロールのホスト

WindowsFormsHost 要素を使用して、VendorControl を WPF アプリケーションでホストします。

WPF で Windows フォームコントロールをホストするには

ソリューションエクスプローラの HostingMonthCalendar プロジェクトに、VendorControlLibrary プロジェクトへの参照を追加します。詳細については、「方法 : Visual Studio で参照を追加または削除する (Visual Basic)」を参照してください。
WPF デザイナで Window1.xaml を開きます。

XAML ビューで、既存のマークアップを次のマークアップに置き換えます。この XAML により、VendorControlLibrary 名前空間がマップされ、WindowsFormsHost 要素が作成され、TextBlock 要素が VendorControl の Date プロパティにバインドされます。

<Window x:Class="HostingMonthCalendar.Window1"
    xmlns="https://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="https://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:v="clr-namespace:VendorControlLibrary;assembly=VendorControlLibrary"
    Title="Window1" Height="300" Width="300">
    <Grid>
        <Grid.RowDefinitions>
            <RowDefinition Height="Auto" />
            <RowDefinition />
        </Grid.RowDefinitions>

        <WindowsFormsHost Name="Host" Grid.Row="0" HorizontalAlignment="Center" VerticalAlignment="Center">
            <v:VendorControl Date="2/2/03" />
        </WindowsFormsHost>

        <TextBlock Grid.Row="1" 
                   Text="{Binding ElementName=Host, Path=Child.Date, Mode=OneWay, UpdateSourceTrigger=PropertyChanged }" 
                   HorizontalAlignment="Stretch" 
                   VerticalAlignment="Center" 
                   TextAlignment="Center" 
                   TextDecorations="None" 
                   FontSize="24" />
    </Grid>
</Window>

<Window x:Class="HostingMonthCalendar.Window1"
    xmlns="https://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="https://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:v="clr-namespace:VendorControlLibrary;assembly=VendorControlLibrary"
    Title="Window1" Height="300" Width="300">
    <Grid>
        <Grid.RowDefinitions>
            <RowDefinition Height="Auto" />
            <RowDefinition />
        </Grid.RowDefinitions>

        <WindowsFormsHost Name="Host" Grid.Row="0" HorizontalAlignment="Center" VerticalAlignment="Center">
            <v:VendorControl Date="2/2/03" />
        </WindowsFormsHost>

        <TextBlock Grid.Row="1" 
                   Text="{Binding ElementName=Host, Path=Child.Date, Mode=OneWay, UpdateSourceTrigger=PropertyChanged }" 
                   HorizontalAlignment="Stretch" 
                   VerticalAlignment="Center" 
                   TextAlignment="Center" 
                   TextDecorations="None" 
                   FontSize="24" />
    </Grid>
</Window>

デザイナに、ホストされている Windows フォームコントロールを表す領域が表示されます。コントロールが表示されていない場合は、[デザイン] タブをクリックして、デザインビューに切り替えてください。

[デバッグ] メニューの [デバッグ開始] をクリックします。
MonthCalendar コントロールをクリックして、現在の日付を変更します。WPF TextBlock 要素が、選択した日付に更新されます。

次の手順

コントロールを WPF 環境で幅広く使用する場合には、WindowsFormsHost からの独自の派生クラスを作成し、Date プロパティを公開することができます。これにより、Path=Child.Date 構文を使用しなくても、他の WPF コントロールを Date プロパティに直接バインドできるようになります。
また、WPF コントロールを Windows フォーム上でホストすることもできます。詳細については、「Windows Presentation Foundation コントロールの使用」を参照してください。

参照

次の方法で共有

チュートリアル : サードパーティの Windows フォームコントロールの WPF アプリケーションでのホスト

前提条件

WPF プロジェクトの作成

プロジェクトを作成するには

Windows フォームの複合コントロールの作成

Windows フォームの複合コントロールを作成するには

WPF での Windows フォームコントロールのホスト

WPF で Windows フォームコントロールをホストするには

次の手順

参照

処理手順

参照

その他の技術情報

その他のリソース

次の方法で共有

チュートリアル : サードパーティの Windows フォーム コントロールの WPF アプリケーションでのホスト

前提条件

WPF プロジェクトの作成

プロジェクトを作成するには

Windows フォームの複合コントロールの作成

Windows フォームの複合コントロールを作成するには

WPF での Windows フォーム コントロールのホスト

WPF で Windows フォーム コントロールをホストするには

次の手順

参照

処理手順

参照

その他の技術情報

その他のリソース

チュートリアル : サードパーティの Windows フォームコントロールの WPF アプリケーションでのホスト

WPF での Windows フォームコントロールのホスト

WPF で Windows フォームコントロールをホストするには