次の方法で共有


Visual Studio と Blend for Visual Studio で XAML を設計する

Visual Studio と Blend for Visual Studio の両方に、さまざまなアプリの種類に対応する XAML を使用して魅力的なユーザー インターフェイスとリッチ メディア エクスペリエンスを構築するためのビジュアル ツールが用意されています。 両方の統合開発環境 (IDE) は、ビジュアル XAML エディター (デザイナー) を含む共通の機能セットを共有します。 WPF および UWP プラットフォームをサポートする Blend for Visual Studio には、視覚的な状態を設計し、アニメーションを作成するための追加のツールが用意されています。

Visual Studio と Blend for Visual Studio を切り替えることができます。また、両方の IDE で同じプロジェクトを同時に開くことさえできます。 1 つの IDE で XAML ファイルに保存された変更は、他の IDE に切り替えると、自動再読み込みによって適用できます。 いずれかの IDE で Tools>Options>Environment>Documents に移動して、再読み込み動作を制御できます。

取り付け

  • WPF アプリを作成するには、Visual Studio で .NET デスクトップ開発 ワークロードをインストールします。 Blend for Visual Studio もインストールされます。

    Visual Studio インストーラー からの .NET デスクトップ開発ワークロードのスクリーンショット

  • UWP アプリを作成するには、Visual Studio でユニバーサル Windows プラットフォーム開発 ワークロード インストールします。 Blend for Visual Studio もインストールされます。

    Visual Studio インストーラー からのユニバーサル Windows プラットフォーム開発ワークロードのスクリーンショット

共有機能

ほとんどの基本的な開発タスクでは、Visual Studio と Blend for Visual Studio は、いくつかの微妙な違いを持つ同じウィンドウと機能のセットを共有します。 いくつかのハイライトは次のとおりです。

  • IntelliSense: 両方の IDE は、ステートメントの補完などの IntelliSense 機能をサポートしています。

  • デバッグ: Visual Studio Blend for Visual Studio でデバッグできます。たとえば、実行中のアプリをデバッグするためのコードにブレークポイントを設定したり、ホット リロード を使用してアプリの実行中に XAML コードを変更したりできます。 Visual Studio で一貫したデバッグ エクスペリエンスを維持するために、Blend for Visual Studio には、Visual Studio のほとんどのデバッグ ウィンドウとツール バーが含まれています。

  • ファイルの再読み込み: Visual Studio または Blend for Visual Studio で XAML ファイルを編集できます。 IDE を切り替えると、保存された編集済みのファイルが自動的に再読み込みされます。 いずれかの IDE で Tools>Options>Environment>Documents に移動して、再読み込み動作を制御できます。

  • 同期されたレイアウトと設定: 同じパーソナル化アカウントでサインインすると、Visual Studio または Blend for Visual Studio のデザイン カスタマイズ ツールウィンドウのレイアウトと設定設定がデバイスとバージョン間で同期されます。 「複数のコンピューター間で設定を同期する」を参照してください。

Blend for Visual Studio の高度な機能

生産性を向上させるために、次のタスクに Blend for Visual Studio を使用することを検討してください。 これらは、Blend for Visual Studio が Visual Studio デザイナーまたはコード単独よりも多くの機能を提供する領域です。

タスク Visual Studio Blend for Visual Studio 詳細情報
ビジュアルの状態をデザインする 表示状態を設計するのに役立つツールはありません。プログラムで作成する必要があります。 デザイン ツールを使用して、コントロールの状態に基づいてコントロールの外観を変更します。 ビジュアルの状態
アニメーション を作成する アニメーション用のデザイン ツールはありません。プログラムで作成する必要があります。 これには、WPF のアニメーションとタイミング システムと広範なコーディングの専門知識を理解する必要があります。 アニメーションは視覚的に作成し、Blend for Visual Studio でプレビューできます。 これは、コードでアニメーションを作成するよりも高速で正確です。 ユーザーの操作を処理するトリガーを追加したり、コードに切り替えてイベント ハンドラーやその他の機能を追加したりできます。 オブジェクト をアニメーション化する
図形とテキストをパスに変換して、操作を容易にする サポートされていません。 図形をパスに変換することで、図形 (四角形や楕円など) に微妙または劇的な変更を加えることができます。これにより、編集コントロールが向上します。 パスを整形または結合したり、複数の図形から複合パスを作成したりできます。

テキスト ブロックをパスに変換して、ベクター イメージとして操作することもできます。
図形とパスの描画
コントロール、テンプレート、スタイルの編集 WPF のスタイルとテンプレートのコーディングと知識が必要です。 任意の画像をコントロールに変換します。

テンプレート編集ツールを使用して、マウスを数回クリックするだけでコントロール、スタイル、テンプレートを変更できます。

たとえば、Blend for Visual Studio スタイル リソースを使用して、一般的な WPF コントロール (ボタン、リスト ボックス、スクロール バー、メニューなど) を実装し、Blend for Visual Studio で色、スタイル、または基になるテンプレートを直接変更できます。 必要に応じて、コードに切り替えて仕上げることもできます。
オブジェクトのスタイルを変更
UI をデータ に接続する SQL Server データベース、WCF、Web サービス、オブジェクト、SharePoint リストなどのリソースからデータ ソースを作成し、データ ソースを UI コントロールにバインドできます。

対話型のデザイン エクスペリエンスを実現するには、デザイン時データを手動で作成する必要があります。
.NET Framework アプリの場合は、プロトタイプ作成とテスト用のサンプル データを簡単に作成できます。 準備ができたらライブ データに切り替えます。

Blend for Visual Studio のデータ生成機能は優れています (名前、数字、URL、写真を簡単に追加できます)。時間を大幅に節約できます。

ライブ データの場合は、UI コントロールを XML ファイルまたは任意の CLR データ ソースにバインドできます。
データ を表示する

高度な XAML デザインの詳細については、「Blend for Visual Studio を使用した UI の作成」を参照してください。