デスクトップ アプリ でUWP XAMLコントロールをホストする(XAML Islands)Host UWP XAML controls in desktop apps (XAML Islands)

Windows 10 バージョン1903以降では、XAML Islands と呼ばれる機能を使用して、UWP 以外のデスクトップアプリケーションでUWPコントロールをホストできます。Starting in Windows 10, version 1903, you can host UWP controls in non-UWP desktop applications using a feature called XAML Islands. この機能を使用すると、既存の WPF、Windows フォーム、およびC++ Win32 アプリケーションの外観、操作性、および機能を、UWP コントロールでのみ使用できる最新の WINDOWS 10 UI 機能を使用して強化することができます。This feature enables you to enhance the look, feel, and functionality of your existing WPF, Windows Forms, and C++ Win32 applications with the latest Windows 10 UI features that are only available via UWP controls. つまり、既存の WPF、Windowsフォーム、およびC ++ Win32 アプリケーションで Windows Inkなどの UWP 機能と Fluent Design System をサポートするコントロールを使用できます。This means that you can use UWP features such as Windows Ink and controls that support the Fluent Design System in your existing WPF, Windows Forms, and C++ Win32 applications.

次のような、 Windows の UIから派生した UWP コントロールをホストできます。You can host any UWP control that derives from Windows.UI.Xaml.UIElement, including:

  • Windows SDK または WinUI ライブラリによって提供される、すべてのファーストパーティ UWP コントロール。Any first-party UWP control provided by the Windows SDK or WinUI library.
  • 任意のカスタム UWP コントロール (連携して動作する複数の UWP コントロールで構成されるユーザーコントロールなど)。Any custom UWP control (for example, a user control that consists of several UWP controls that work together). アプリケーションでコンパイルできるように、カスタムコントロールのソースコードが必要です。You must have the source code for the custom control so you can compile it with your application.

基本的に、XAML アイランドはUWP xaml ホスティング APIを使用して作成されます。Fundamentally, XAML Islands are created by using the UWP XAML hosting API. この API は、Windows 10 バージョン 1903 SDK で導入されたいくつかの Windows ランタイムクラスと COM インターフェイスで構成されています。This API consists of several Windows Runtime classes and COM interfaces that were introduced in the Windows 10, version 1903 SDK. また、 Windows Community Toolkitには、UWP XAML ホスティング API を内部的に使用する一連の xaml アイランド .net コントロールが用意されており、WPF と Windows フォームアプリの開発環境がより簡単になります。We also provide a set of XAML Island .NET controls in the Windows Community Toolkit that use the UWP XAML hosting API internally and provide a more convenient development experience for WPF and Windows Forms apps.

XAML アイランドの使用方法は、アプリケーションの種類とホストする UWP コントロールの種類によって異なります。The way you use XAML Islands depends on your application type and the types of UWP controls you want to host.

注意

XAML Islands に関するフィードバックがある場合は、 Microsoft.Toolkit.Win32 リポジトリ に新しい問題を作成し、そこにコメントを残してください。If you have feedback about XAML Islands, create a new issue in the Microsoft.Toolkit.Win32 repo and leave your comments there. 個人的にフィードバックを送信したい場合は、XamlIslandsFeedback@microsoft.com に送信できます。If you prefer to submit your feedback privately, you can send it to XamlIslandsFeedback@microsoft.com. あなたの洞察とシナリオは弊社にとって非常に重要です。Your insights and scenarios are critically important to us.

WPF と Windows フォームアプリケーションWPF and Windows Forms applications

WPF および Windows フォームアプリケーションでは、Windows Community Toolkit で利用できる XAML アイランド .NET コントロールを使用することをお勧めします。We recommend that WPF and Windows Forms applications use the XAML Island .NET controls that are available in the Windows Community Toolkit. これらのコントロールは、対応する UWP コントロールのプロパティ、メソッド、およびイベントを模倣 (またはそのアクセスを提供) するオブジェクトモデルを提供します。These controls provide an object model that mimics (or provides access to) the properties, methods, and events of the corresponding UWP controls. また、キーボードナビゲーションやレイアウトの変更などの動作も処理します。They also handle behavior such as keyboard navigation and layout changes.

WPF および Windows フォームアプリケーション用の XAML アイランドコントロールには、ラップされたコントロールホストコントロールの2つのセットがあります。There are two sets of XAML Island controls for WPF and Windows Forms applications: wrapped controls and host controls. Windows 10 バージョン1903では、これらのコントロールは開発者プレビューとして入手できます。As of Windows 10, version 1903, these controls are available as a developer preview.

ラップされたコントロールWrapped controls

WPF および Windows フォームアプリケーションは、特定の UWP コントロールのインターフェイスと機能をラップする選択した XAML アイランドコントロールを使用できます。WPF and Windows Forms applications can use a selection of XAML Island controls that wrap the interface and functionality of a specific UWP control. これらのコントロールを WPF または Windows フォームプロジェクトのデザインサーフェイスに直接追加し、デザイナーの他の WPF や Windows フォームコントロールと同様に使用できます。You can add these controls directly to the design surface of your WPF or Windows Forms project and then use them like any other WPF or Windows Forms control in the designer.

次のラップされた UWP コントロールは、現在 Windows Community Toolkit で使用できます。The following wrapped UWP controls are currently available in the Windows Community Toolkit.

コントロールControl サポートされる最小 OSMinimum supported OS 説明Description
InkCanvasInkCanvas
InkToolbarInkToolbar
Windows 10 バージョン 1903Windows 10, version 1903 Windows フォームまたは WPF デスクトップアプリケーションで Windows Ink ベースのユーザーとの対話に使用する、画面と関連するツールバーを提供します。Provide a surface and related toolbars for Windows Ink-based user interaction in your Windows Forms or WPF desktop application.
MediaPlayerElementMediaPlayerElement Windows 10 バージョン 1903Windows 10, version 1903 Windows フォームまたは WPF デスクトップアプリケーションでビデオなどのメディアコンテンツをストリーミングおよびレンダリングするビューを埋め込みます。Embeds a view that streams and renders media content such as video in your Windows Forms or WPF desktop application.
MapControlMapControl Windows 10 バージョン 1903Windows 10, version 1903 Windows フォームまたは WPF デスクトップアプリケーションで、シンボリックまたはフォトマップを表示できるようにします。Enables you to display a symbolic or photorealistic map in your Windows Forms or WPF desktop application.

ラップされた UWP コントロールの使用方法を示すチュートリアルについては、「 WPF アプリでの標準 UWP コントロールのホスト」を参照してください。For a walkthrough that demonstrates how to use the wrapped UWP controls, see Host a standard UWP control in a WPF app.

ホストコントロールHost controls

ラップされた使用可能なコントロールに含まれているもの以外のシナリオでは、WPF および Windows フォームアプリケーションで、Windows Community Toolkit で利用可能なWindowsxamlhostコントロールを使用することもできます。For scenarios beyond those covered by the available wrapped controls, WPF and Windows Forms applications can also use the WindowsXamlHost control that is available in the Windows Community Toolkit.

コントロールControl サポートされる最小 OSMinimum supported OS 説明Description
WindowsXamlHostWindowsXamlHost Windows 10 バージョン 1903Windows 10, version 1903 は、Windows SDK によって提供されるファーストパーティ UWP コントロールやカスタムコントロールなど、 Windows の UIから派生したすべての uwp コントロールをホストできます。Can host any UWP control that derives from Windows.UI.Xaml.UIElement, including any first-party UWP control provided by the Windows SDK as well as custom controls.

Windowsxamlhostコントロールの使用方法を示すチュートリアルについては、「 wpf アプリでの標準 Uwp コントロールのホスト」および「 XAML アイランドを使用した WPF アプリでのカスタム uwp コントロールのホスト」を参照してください。For walkthroughs that demonstrate how to use the WindowsXamlHost control, see Host a standard UWP control in a WPF app and Host a custom UWP control in a WPF app using XAML Islands.

注意

Windowsxamlhostコントロールを使用したカスタム UWP コントロールのホストは、WPF と、.net Core 3 を対象とする Windows フォームアプリでのみサポートされています。Using the WindowsXamlHost control to host custom UWP controls is supported only in WPF and Windows Forms apps that target .NET Core 3. Windows SDK によって提供されるファーストパーティ UWP コントロールのホストは、.NET Framework または .NET Core 3 を対象とするアプリでサポートされています。Hosting first-party UWP controls provided by the Windows SDK is supported in apps that target either the .NET Framework or .NET Core 3.

XAML アイランド .NET コントロールを使用するようにプロジェクトを構成するConfigure your project to use the XAML Island .NET controls

XAML アイランド .NET コントロールには、Windows 10 バージョン1903以降のバージョンが必要です。The XAML Island .NET controls require Windows 10, version 1903, or a later version. これらのコントロールを使用するには、次に示すいずれかの NuGet パッケージをインストールします。To use these controls, install one of the NuGet packages listed below. これらのパッケージは、XAML アイランドのラップされたコントロールとホストコントロールを使用するために必要なすべてのものを提供します。また、必要な他の関連する NuGet パッケージが含まれています。These packages provide everything you need to use the XAML Island wrapped controls and host controls, and they include other related NuGet packages that are also required.

コントロールの種類Type of control NuGet パッケージNuGet package 関連記事Related articles
ラップされたコントロールWrapped controls バージョン 6.0.0-preview7 以降のパッケージ:Version 6.0.0-preview7 or later of these packages: WPF アプリで標準の UWP コントロールをホストするHost a standard UWP control in a WPF app
ホストコントロールHost control バージョン 6.0.0-preview7 以降のパッケージ:Version 6.0.0-preview7 or later of these packages: WPF アプリで標準の UWP コントロールをホストするHost a standard UWP control in a WPF app
WPF アプリでカスタム UWP コントロールをホストするHost a custom UWP control in a WPF app

次の詳細に注意してください。Be aware of the following details:

  • ホストコントロールパッケージは、ラップされたコントロールパッケージにも含まれています。The host control packages are also included in the wrapped control packages. 両方のコントロールセットを使用する場合は、ラップされたコントロールパッケージをインストールできます。You can install the wrapped control packages if you want to use both sets of controls.

  • カスタム UWP コントロールをホストしている場合は、WPF または Windows フォームプロジェクトで .NET Core 3 をターゲットにする必要があります。If you're hosting a custom UWP control, your WPF or Windows Forms project must target .NET Core 3. カスタム UWP コントロールのホストは、.NET Framework を対象とするアプリではサポートされていません。Hosting custom UWP controls is not supported in apps that target the .NET Framework. また、カスタムコントロールを参照するために、いくつかの追加手順を実行する必要があります。You'll also need to perform some additional steps to reference the custom control. 詳細については、「 XAML アイランドを使用した WPF アプリでのカスタム UWP コントロールのホスト」を参照してください。For more info, see Host a custom UWP control in a WPF app using XAML Islands.

  • 以前のバージョンの手順では、WPF または Windows フォームプロジェクトのアプリケーションマニフェストに maxversiontested 要素を追加しました。Earlier versions of these instructions had you add the maxversiontested element to an application manifest in your WPF or Windows Forms project. 上記の NuGet パッケージの最新のプレビューバージョンを使用している限り、この要素をマニフェストに追加する必要はありません。As long as you're using the latest preview versions of the NuGet packages listed above, you no longer need to add this element to your manifest.

XAML アイランド .NET コントロールのアーキテクチャArchitecture of XAML Island .NET controls

ここでは、さまざまな種類の XAML アイランドコントロールが UWP XAML ホスティング API の上に構造的にどのように構成されているかを簡単に説明します。Here's a quick look at how the different types of XAML Island controls are organized architecturally on top of the UWP XAML hosting API.

ホスト コントロール アーキテクチャ

この図の下部に表示されている API は、Windows SDK に付属しています。The APIs that appear at the bottom of this diagram ship with the Windows SDK. ラップされたコントロールとホストコントロールは、Windows Community Toolkit の NuGet パッケージを通じて入手できます。The wrapped controls and host controls are available via NuGet packages in the Windows Community Toolkit.

Web ビューコントロールWeb view controls

Windows Community Toolkit には、WPF および Windows フォームアプリケーションで web コンテンツをホストするための次の .NET コントロールも用意されています。The Windows Community Toolkit also provides the following .NET controls for hosting web content in WPF and Windows Forms applications. これらのコントロールは、多くの場合、XAML アイランドコントロールと同様のデスクトップアプリの近代化シナリオで使用され、XAML アイランドコントロールと同じMicrosoft Toolkit (Win32 リポジトリ) リポジトリに保持されます。These controls are often used in similar desktop app modernization scenarios as the XAML Island controls, and they are maintained in the same Microsoft.Toolkit.Win32 repo repo as the XAML Island controls.

コントロールControl サポートされる最小 OSMinimum supported OS 説明Description
WebViewWebView Windows 10 バージョン 1803Windows 10, version 1803 Microsoft Edge レンダリングエンジンを使用して、web コンテンツを表示します。Uses the Microsoft Edge rendering engine to show web content.
WebViewCompatibleWebViewCompatible Windows 7Windows 7 には、より多くの OS バージョンと互換性があるWebViewのバージョンが用意されています。Provides a version of WebView that is compatible with more OS versions. このコントロールは、Microsoft Edge レンダリングエンジンを使用して Windows 10 バージョン1803以降の web コンテンツを表示し、Internet Explorer レンダリングエンジンを使用して、以前のバージョンの Windows 10、Windows 8.x、Windows 7 に web コンテンツを表示します。This control uses the Microsoft Edge rendering engine to show web content on Windows 10 version 1803 and later, and the Internet Explorer rendering engine to show web content on earlier versions of Windows 10, Windows 8.x, and Windows 7.

これらのコントロールを使用するには、次のいずれかの NuGet パッケージをインストールします。To use these controls, install one of these NuGet packages:

C++Win32 アプリケーションC++ Win32 applications

XAML アイランド .NET コントロールは、Win32 アプリケーションでC++はサポートされていません。The XAML Island .NET controls are not supported in C++ Win32 applications. 代わりに、これらのアプリケーションでは、Windows 10 SDK (バージョン1903以降) によって提供されるUWP XAML ホスティング APIを使用する必要があります。These applications must instead use the UWP XAML hosting API provided by the Windows 10 SDK (version 1903 and later).

UWP XAML ホスティング API は、いくつかの Windows ランタイムクラスと COM インターフェイスでC++構成されています。このインターフェイスは、Win32 アプリケーションで、 Windows の UI. .xaml. UIElementから派生した UWP コントロールをホストするために使用できます。The UWP XAML hosting API consists of several Windows Runtime classes and COM interfaces that your C++ Win32 application can use to host any UWP control that derives from Windows.UI.Xaml.UIElement. UWP コントロールは、ウィンドウハンドル (HWND) が関連付けられているアプリケーション内の任意の UI 要素でホストできます。You can host UWP controls in any UI element in your application that has an associated window handle (HWND). この API の前提条件などの詳細については、「 C++ Win32 アプリでの UWP XAML ホスティング API の使用」を参照してください。For more information about this API, including prerequisites, see Using the UWP XAML hosting API in a C++ Win32 app.

注意

Windows コミュニティツールキットのラップされたコントロールとホストコントロールは、UWP XAML ホスティング API を内部的に使用し、UWP XAML ホスティング API を直接使用した場合 (キーボードナビゲーションを含む)、独自に処理する必要のあるすべての動作を実装します。およびレイアウトが変更されます。The wrapped controls and host controls in the Windows Community Toolkit use the UWP XAML hosting API internally and implement all of the behavior you would otherwise need to handle yourself if you used the UWP XAML hosting API directly, including keyboard navigation and layout changes. WPF と Windows フォーム アプリケーションでは、UWP XAML ホスティング API の代わりにこれらのコントロールを直接使用することを強くお勧めします。これらのコントロールは、API の使用に関する実装の詳細の多くを抽象化しているためです。For WPF and Windows Forms applications, we strongly recommend that you use these controls instead of the UWP XAML hosting API directly because they abstract away many of the implementation details of using the API.

機能のロードマップFeature roadmap

Windows 10 バージョン1903のリリース時点では、Windows Community Toolkit の XAML アイランド .NET コントロールは、バージョン1.0 のコントロールが使用可能になるまで、developer preview のままです。As of the release of Windows 10, version 1903, the XAML Island .NET controls in the Windows Community Toolkit are still in developer preview until the version 1.0 release of the controls is available.

  • .NET Framework 4.6.2 以降のコントロールのバージョン1.0 は、ツールキットの6.0 リリースでリリースされる予定です。Version 1.0 of the controls for the .NET Framework 4.6.2 and later are planned to be released in the 6.0 release of the toolkit.
  • .NET Core 3 のコントロールのバージョン1.0 は、ツールキットの今後のリリースで予定されています。Version 1.0 of the controls for .NET Core 3 are planned for a later release of the toolkit.
  • .NET Framework と .NET Core 3 について、これらのコントロールのバージョン1.0 リリースの最新のプレビューを試す場合は、 UWP Community Toolkitギャラリーにあるバージョン 6.0.0-preview7 (またはそれ以降) の NuGet パッケージを参照してください。If you want to try the latest previews of the version 1.0 releases of these controls for the .NET Framework and .NET Core 3, see the version 6.0.0-preview7 (or later) NuGet packages in the UWP Community Toolkit gallery.

詳細については、このブログの投稿を参照してください。For more details, see this blog post.

その他の資料Additional resources

詳細な背景情報と XAML Islandsを使用したチュートリアルについては、次の記事やリソースを参照してください。For more background information and tutorials about using XAML Islands, see the following articles and resources:

  • WPF アプリの最新化のチュートリアル:このチュートリアルでは、Windows Community Toolkit のラップされたコントロールとホストコントロールを使用して、既存の WPF 基幹業務アプリケーションに UWP コントロールを追加する手順について説明します。Modernize a WPF app tutorial: This tutorial provides step-by-step instructions for using the wrapped controls and host controls in the Windows Community Toolkit to add UWP controls to an existing WPF line-of-business application. このチュートリアルでは、WPF アプリケーションの完全なコードと、プロセスの各手順の詳細な手順について説明します。This tutorial includes the complete code for the WPF application as well as detailed instructions for each step in the process.
  • XAML Islands v1 - 更新プログラムとロードマップ:このブログの投稿では、XAML Islandsに関する多くの一般的な質問を説明し、開発の詳細なロードマップを提供します。XAML Islands v1 - Updates and Roadmap: This blog post discusses many common questions about XAML Islands and provides a detailed development roadmap.