Blend for Visual Studio ワークスペース (XAML)

Blend for Visual Studio については既に紹介し、プロジェクト テンプレートとアイテム テンプレートについて説明しました。テンプレートが設定されたので、ブレンドワークスペースをよりよく理解する時が来ました。これは、いくつかの見事なアニメーションをデザインおよび作成するための遊び場になります。

Blend Workspace:

Blend には 2 つの既定のワークスペースがあります

• Design Workspace
• Animation Workspace

2 つを切り替えるには、ウィンドウ > ワークスペースをクリックするか、Ctrl+F11 を使用します。これらのワークスペースはカスタマイズ可能であるため、必要に応じてパネルの向きを変更したり、ドッキングまたはフロートしたり、パネルのサイズを変更したりできます。また、「ツール」>「オプション」>「ワークスペース」>テーマ」をクリックして、ワークスペース全体のテーマを変更することもできます。

Panels

Tools Panel

ツールパネルには、UI要素をデザインするための最も便利なツールが含まれています。含まれているツールには、選択、直接選択、パン、ズーム、スポイト、ペイント バケツなどがあります。ツールパネルの一部のセクションには、右下隅に小さな白い三角形があることに気付くでしょう。これは、クリックアンドホールドすると、関連ツールの追加オプションが表示されることを示しています。

Assets Panel

アセットパネルには、すべてのコントロール、スタイル、シェイプ、メディア、カテゴリ、および場所が一覧表示されます。アセット内のコントロールには、AppBar、GridView、FlipViewなどのWindows 8固有のコントロールも含まれます。アセットパネルの検索ボックスは便利な機能です。または、ツールパネル(最後のボタン)からアセットパネルにアクセスすると、最近アクセスしたアセットが含まれます。

Artboard:

Artboard は、アプリケーションのページを視覚的にデザインする作業画面です。右上隅には、表示ボタンがあります。これらを使用して、デザインビュー、コード ビュー、​分割ビューを切り替えます。左下隅には、ズーム、スナップグリッドの表示、グリッド線へのスナップ、​スナップ線へのスナップをオフにするなどのアートボードコントロールがあります。スナップの詳細については、こちらをご覧ください。

オブジェクトとタイムラインパネル:

オブジェクトとタイムラインパネルは、アートボード内のオブジェクトの階層構造を表示するのに役立ちます。1つの位置からドラッグして目的の位置にドロップし、目的の構造を形成することで、直接変更できます。アプリケーションにアニメーションを追加するには、+ボタンをクリックして新しいストーリーボードを作成するだけです。ストーリーボードは、アニメーションのタイムラインを保持するコンテナです。アニメーションの追加の詳細については、こちらをご覧ください。

Properties Panel:

あなたがVisual Studioの開発者であれば、プロパティパネルはあなたにとって新しいものではありません!これは、アートボード上で選択されているオブジェクトのプロパティを表示および変更する場所です。

あなたが知っておくべき他のいくつかのパネル:

• プロジェクトパネル– プロジェクトに関するすべての情報を一覧表示します。Visual Studio Solutions Explorerに類似
• リソースパネル– 現在のプロジェクトで使用されているすべてのリソースを一覧表示します。リソースをアートボードにドラッグして、オブジェクトに適用できます
• 結果パネル– 結果パネルは 2 つのタブで構成されています。[エラー] タブ– ビルドと解析のエラーを表示します。[出力] タブ– プロジェクトのビルド、リビルド、クリーニング、またはテスト時にビルド情報を提供します。

概要

Windows 8チップセットからユーザーエクスペリエンスまで再考されているため、すべてのストアアプリ開発者は厳格なUIデザイン原則に従う必要があります。Blendは、最初に使用するのに最適なツールです。それはあなたが魅力的なアプリをデザインするのを助け、またアニメーションの配線を容易にします。だから、細部にまでこだわって、速くて流動的なアプリを作りましょう。