Blend におけるワークスペースの領域

Blend を初めて使用する場合は、少しの時間を頂き、Blend ワークスペースについて理解してください。 このトピックでは、短いツアーにお連れします。

このトピックの内容:

• ワークスペースのツアー

• アートボードのツアー

• [ツール] パネルのツアー

• [アセット] パネルのツアー

• [オブジェクトとタイムライン] パネルのツアー

• [プロパティ] パネルのツアー

• [プロジェクト] パネルのツアー

• [デバイス] パネルのツアー

ワークスペースのツアー

Blend には、デザイン ワークスペースと アニメーション ワークスペースという 2 つの既定のワークスペースがあります。 Ctrl キーと F11 キーを同時に押すと、これらのワークスペースを切り替えることができます。

デザイン ワークスペースで、通常のデザイン作業を行います。 アニメーション ワークスペースを開くと、タイムラインが表示される場所が広くなるように [オブジェクトとタイムライン] パネルがアートボードの下に移動します。

[デザイン] ワークスペース (左) と [アニメーション] ワークスペース (右)

	メニュー		アートボード
	ツール パネル		[プロジェクト] パネル、[プロパティ] パネル、および [リソース] パネル
	[オブジェクトとタイムライン] パネル		[結果] パネル (アニメーション ワークスペースでは [オブジェクトとタイムライン] パネルに表示されます)

Blend for Visual Studio のワークスペースは、すべてのビジュアル インターフェイス要素で構成されます。 それには、アートボード、パネル、ワークスペースの構成、オーサリング ビュー、メニューがあります。

	[ドキュメント] タブ ウィンドウ、ページ、リソース ディクショナリ、ユーザー コントロールを含め、開いているすべてのプロジェクトのドキュメントが表示されます。
	アクティブなファイル アートボードに現在開いているドキュメントを判断します。また、[ドキュメント] タブで開いているファイルがすべて表示されます。
	ビュー 3 種類のリアルタイム編集環境の 1 つを使用します。 デザイン ビュー [デザイン] ビューを使用して、アートボードの視覚的表現を使用して文書を作成します。 コード ビュー [コード] ビューを使用して、XAML コードを作成または編集します 。 注意 [ツール] パネル、[オブジェクトとタイムライン] パネル、[プロパティ] は [コード] ビューでは使用できません。さらに、このビューでは、ほとんどのメニュー項目は無効になります。 分割ビュー [コード] と [デザイン] ビューの両方を表示します。 また [表示] メニューの [分割ビューの方向] を使用してウィンドウの向きを変更できます。

Blend のワークスペースはカスタマイズが可能で拡張性に優れています。 パネルの向きの変更、パネルのドッキングまたはフローティング、パネルの境界線をドラッグすることによるサイズ変更、アートボードのズーム、およびアートボード上のオブジェクトのスナップの切り替えを行うことができます。 さらに、[ツール] メニューから表示できる [オプション] ダイアログ ボックスの Theme プロパティを使用して、ワークスペースの配色を変更できます。

アートボードのツアー

アートボードは作業サーフェイスです。 オブジェクトを描画および変更して、ドキュメントを視覚的に設計します。

	ビジュアル デザイン画面 [オプション] ダイアログ ボックスで、画面の表示様式 (背景色など) を変更できます。
	XAML エディター XAML コードを編集します。
	アートボードのコントロール アートボードのズーム設定、効果の表示の切り替え、スナップ オプションの設定、ファイルのコメントの表示用のコントロールがあります。
	ドキュメントのタブ アートボードで複数のドキュメントを開いている場合は、対応するタブをクリックしてドキュメントを切り替えます。
	ビュー ボタン [デザイン] ビュー、[XAML] ビュー、[分割] ビューを切り替えます。
	オブジェクト ハンドル マウスでオブジェクト ハンドルを操作して、オブジェクトを変更できます。

短いビデオを見る: アートボード。

[ツール] パネルのツアー

Blend for Visual Studio の [ツール] パネルは、アプリケーションのオブジェクトの作成と変更に使用します。 パネルにあるツールを選択してアートボード上でマウスを動かすと、オブジェクトを描画できます。

	選択ツール オブジェクトとパスを選択します。 個別選択ツールを使用すると、入れ子状のオブジェクトやパス セグメントを選択できます。		グラデーション ツールとブラシ ツール
	表示ツール 手のひらツールでの移動、ズームなど、アートボードの表示の調整を行います。		パス ツール
	ブラシ ツール ブラシの変換や、オブジェクトのペイントを行ったり、あるオブジェクトの属性を選択して別のオブジェクトに適用するなど、オブジェクトの表示属性を操作します。		シェイプ ツール
	オブジェクト ツール パス、図形、レイアウト パネル、テキスト、コントロールなど、よく使用するオブジェクトをアートボード上で描画します。		レイアウト パネル
	アセット ツール [アセット] パネルにアクセスし、ライブラリから最近使用したアセットを表示します。		テキスト コントロール
			コモン コントロール

短いビデオを見る: ツールバー.

[アセット] パネルのツアー

[ツール] パネルには、最もよく使うコントロールが表示されますが、[アセット] パネルですべてのコントロールを見つけることができます。 実際、コントロール、スタイル、メディア、動作、特殊効果など、アートボードに追加できるすべてのものを見つけられます。

	[検索] ボックス [検索] ボックスに入力することにより、アセットの一覧を絞り込みます。
	グリッド モードとリスト モード アセットの表示モードを、グリッド モードまたはリスト モードに切り替えます。
	アセットのカテゴリ カテゴリまたはサブカテゴリをクリックすると、そのカテゴリに属するアセットが表示されます。
	スタイル リソース ディクショナリに含まれるすべてのスタイルを表示します。
	説明 選択したカテゴリまたはサブカテゴリの説明が表示されます。

[オブジェクトとタイムライン] パネルのツアー

このパネルを使用すると、アートボード上のオブジェクトを整理して、必要な場合はアニメーション化できます。

	オブジェクト ビュー: ドキュメントをツリー表示します。 さまざまなレベルの詳細にドリル ダウンできます。 さらに、アートボード上のオブジェクトを整理するレイヤーを追加することもできます。 そのように、グループとしてロックし、非表示にすることができます。
	記録モード インジケーター: タイムラインでプロパティの変更を記録中かどうかを表示します。
	ストーリーボードの一覧 作成済みのストーリーボードが一覧表示されます。
	ストーリー ボードを閉じる 現在のストーリー ボードを閉じます。
	ストーリー ボードのオプション ストーリー ボードの作成、複製、動作の取り消し、削除、名前の変更を行ったり、ストーリー ボードを閉じます。
	再生コントロール タイムライン上を移動します。 再生ヘッドは、ドラッグしてタイムライン上を移動する (スクラブする) こともできます。
	スコープを戻す オブジェクト ビューのスコープを前のルート オブジェクトまたは前のスコープに戻します。 スタイルまたはテンプレートを変更する場合にのみ、これを実行できます。
	キーフレームの記録 現時点で選択されているオブジェクトのプロパティのスナップショットを記録します。
	スナップ オプション タイムラインのスナップ、スナップの精度を設定し、タイムラインのスナップをオフにします。
	表示/非表示、ロック/ロック解除 オブジェクト ビューの表示と非表示、ロックとロック解除を切り替えます。
	タイムライン上の再生ヘッドの位置 現在の時刻をミリ秒単位で表示します。 このフィールドに時間値を直接入力し、特定の時点に移動することもできます。 精度は [スナップ オプション] に設定したスナップ精度によって決まります。
	再生ヘッド アニメーションがどの時点にあるかを示します。 タイムラインで再生ヘッドをドラッグして、アニメーションをプレビューできます。
	タイムラインに設定されたキーフレーム 特定の時点でのプロパティの値を変更します。
	オブジェクトの順序の変更 オブジェクトの表示順序を設定します。 構造ビューのオブジェクトを Z 軸を基準 (手前から奥)、またはマークアップ順 (XAML での表示順) に整列させるには、このボタンをクリックします。
	タイムラインのズーム タイムラインのズーム解像度を設定します。 ズーム インでは、アニメーションを詳細に編集できます。ズーム アウトすると、長い再生時間にわたる動作の概要が表示されます。 ズーム インしても、目的の位置にキーフレームを設定できない場合は、スナップ精度が十分高く設定されていることを確認してください。
	タイムライン構成領域 タイムラインを表示するとともに、キーフレームをドラッグするかショートカット メニューを使用してキーフレームを移動します。

[プロパティ] パネルのツアー

オブジェクトのプロパティを表示して変更するには、このパネルを使用します。 また、アートボード上で直接設定することもできます。 この場合、プロパティの変更が [プロパティ] パネルに反映されます。

[カテゴリ] プロパティのカテゴリを展開し、折りたたみます。 カテゴリの詳細を表示するには [展開] をクリックし、非表示にするには [折りたたみ] をクリックします。

	[名前] と [種類] 選択したオブジェクトのアイコン、名前、種類が表示されます。
	[並べ替え] プロパティを名前、ソース、またはカテゴリごとにアルファベット順に並べ替えます。
	ブラシのプロパティ Fill、Stroke、Foreground など、ブラシの視覚的なプロパティを設定します。
	カラー エディター 単色ブラシおよびグラデーション ブラシで使用します。
	カラー ピッカー 色を選択します。
	カラー チップ 初期の色、現在の色、および最後の色が表示されます。
	スポイト ツール 画面上の任意の要素の色を使用します。 色スポイトは、単色ブラシが選択されているときに使用できます。 [グラデーションのスポイト] は、[グラデーション ブラシ] が選択されているときに使用できます。
	プロパティとイベント 選択された要素に対してプロパティを設定したり、イベントを選択します。
	[検索] ボックス プロパティを検索します。 [検索] ボックスに入力することで、表示されるプロパティをフィルター処理します。
	ブラシ エディターのタブ ブラシ エディターを選択する場合に使用します。 ブラシなし、単色ブラシ、グラデーション ブラシ、タイル ブラシ、またはブラシ リソースから選択できます。
	色リソース 異なるプロパティにまったく同じ色を適用します。 [色リソース] タブには、[ローカル リソース] と [システム リソース] が表示されます。
	RGB 色空間 [R]、[G]、または [B] (赤、緑、青) の各数値エディターの値を調整して色を変更します。
	アルファ チャネル [A] の横にある数値エディターを使用してアルファ値を変更します。
	色をリソースに変換 選択した色を色リソースに変換します。 色リソースは、[色リソース] タブをクリックした場合に使用できます。
	16 進数値 表示されている色を表す 16 進数値が表示されます。
	グラデーション スライダー グラデーション ブラシが選択されている場合にのみ表示されます。
	詳細設定プロパティの表示 使用頻度が低いプロパティのカテゴリを表示します。

短いビデオを見る: [プロパティ] パネル。

[プロジェクト] パネルのツアー

[プロジェクト] パネルを使用すると、プロジェクト内のファイルを管理できます。

	[検索] ボックス [検索] ボックスに入力して、一覧に表示するプロジェクト ファイルを絞り込みます。
	ソリューション アプリケーション プロジェクトおよび対応するファイルが含まれています。
	参照 DLL ファイルなど、プロジェクトの参照が含まれています。
	リンクされたアイテム リンクされているアイテムのアイコンの上には矢印が表示されます。つまり、そのアイテムはプロジェクト フォルダー内にはありません。
	SampleData 生成されたサンプル データ ファイルが含まれています。
	MainWindow.xaml メイン ドキュメントの分離コード ファイル。
	ResourceDictionary プロジェクト全体で共有できるリソースの集まり。

短いビデオを見る: [プロジェクト] パネル。

[デバイス] パネルのツアー

このパネルを使用すると、アプリの実行時にアプリのさまざまなビューをシミュレートできます。

	[表示] アプリのプレビューに使用する画面のサイズおよび解像度を変更します。
	[方向] アプリのプレビュー方向を [横] または [縦] に変更します。
	[端] プレビューでの端の揃え方を [両方]、[左]、[右]、または [なし] に変更します。
	[ハイコントラスト] 選択したコントラスト設定に基づいてアプリをプレビューします。 [既定] 以外の値を設定すると、App.xaml 内に設定された RequestedTheme プロパティではなく、こちらの設定値が使用されます。
	[スケーリングのオーバーライド] 大きい表示スケールに基づいてアプリをプレビューします。 [スケーリングのオーバーライド] を選択すると、表示スケールが 100% の場合には 140% がシミュレートされます。 表示スケールが 140% の場合にシミュレートされるスケールは 180% です。
	[テーマ] 選択したテーマに基づいてアプリをプレビューします。
	[最小幅] 最小幅の設定に基づいてアプリをプレビューします。 最小幅は App.xaml で変更できます。
	[クロムの表示] [クロムの表示] チェック ボックスを選択またはクリアして、[デザイン] ビューのアプリケーションの周囲にあるシミュレートされたタブレットのフレームをオンまたはオフにします。
	[クリップして表示] ドキュメント全体をクリップするか、ドキュメント画面を表示するには、[クリップして表示] チェック ボックスを選択またはクリアします。
	[配置ターゲット] アプリケーションをビルドしたときにアプリケーションを配置するターゲット デバイスを指定します。

コンテンツの進化にご協力ください。

Blend ワークスペースの習得に役立つビデオや記事が見つかった場合は、私たちと共有してください。 コンテンツを確認後、他のユーザーがお客様の発見の恩恵を受けられるように、当社がリンクを追加する可能性があります。

お客様から新しいビデオを提案される場合は、お客様からお話を伺いたいと思います。 他のユーザーからも同様の依頼を受けている場合は、時間と優先順位が許すときに新しいビデオを作成します。

お客様よりお客様の業務をよく知っている人はいません。 そのため、どのリソースが Blend ワークスペースの習得に役立ったか、また、当社または当社のコミュニティの誰かによる説明が不十分なのはどの領域かについて教えてください。そうすることで、お客様に役立つコンテンツを進化させることができます。

ご提案はこちらで共有してください。