Blend におけるオブジェクト スタイルの変更

オブジェクトをカスタマイズする最も簡単な方法は、[プロパティ] ペインにプロパティを設定することです。

設定または設定のグループを再利用する場合は、再利用可能なリソースを作成します。 再利用可能なリソースは、スタイル、テンプレート、またはカスタムの色のような簡単なものになります。 また、コントロールをその状態に基づいて異なる方法で表示することもできます。 たとえば、ユーザーがボタンをクリックするとボタンが緑色に変わるなどです。

このトピックの内容:

  • ブラシ: オブジェクトの外観を変更する

  • スタイルとテンプレート: コントロール全体で一貫したルック アンド フィールを作成する

  • 表示状態: コントロールの状態に基づき、コントロールの外観を変更する

  • リソース: 色、スタイル、テンプレートを作成し、後で再利用する

ブラシ: オブジェクトの外観を変更する

外観を変更する場合は、オブジェクトにブラシを適用します。

短いビデオを見る: インストール済みフィーチャーの構成 ブラシ エディター

繰り返しイメージまたはパターンでオブジェクトを塗りつぶします。

繰り返しイメージやパターンでオブジェクトを塗りつぶすには、タイル ブラシを使用します。

タイル ブラシを作成するには、初めにイメージ ブラシ、描画ブラシ、またはビジュアル ブラシの各リソースを作成します。

イメージ ブラシを作成するには、イメージを使用します。 次の図は、イメージ ブラシ、並べて表示されたイメージ ブラシ、反転させたイメージ ブラシを示しています。

81f84f56-906d-456b-8288-d77da1e01e31 d3782ca8-64da-47a4-a095-c6cdd0fa47a2 38ae3691-f3f1-4a1e-82ca-c7fa164bf56e

パスや図形など、ベクター描画を使用して、描画ブラシを作成します。 次の図は、描画ブラシ、並べて表示された描画ブラシ、反転させた描画ブラシを示しています。

197666ac-ef57-4c5c-9779-669e991a00a5 ba09cda3-4cee-40ba-b3d4-edc032158bdc 15bf6021-620c-4490-9eae-086153d3f14f

ボタンなどのコントロールから、ビジュアル ブラシを作成します。 次の図は、ビジュアル ブラシと並べて表示されたビジュアル ブラシを示しています。

fb6c90e0-153c-48fe-b563-e601beac6227 e261b99f-7d8f-4d91-bc84-19c7beccc255

短いビデオを見る: インストール済みフィーチャーの構成 タイル ブラシ

スタイルとテンプレート: コントロール全体で一貫したルック アンド フィールを作成する

コントロールの外観と動作を一度にデザインし、個別に維持しなくてもよいように、そのデザインを他のコントロールにも適用することができます。

スタイルを使用する必要がありますか?: 既定のプロパティ (ボタンの色など) を設定する場合は、スタイルを使用します。 スタイルを適用した後でも、コントロールを変更することができます。

テンプレートを使用する必要がありますか?: コントロールの構造を変更する場合は、テンプレートを使用します。 グラフィックまたはロゴをボタンに変換することを想像してください。 テンプレートを適用した後は、コントロールを変更することはできません。

テンプレートまたはスタイルを作成する

テンプレートを作成する方法は 2 つあります。 アートボード上のオブジェクトをコントロールに変換したり、既存のコントロールをテンプレートのベースにすることができます。

任意のオブジェクトをコントロール テンプレートに変換するには、オブジェクトを選択してから、[ツール] メニューの [コントロールの作成] を選択します。

既存のコントロールをテンプレートのベースにする場合は、アートボード上のオブジェクトを選択します。 次に、アートボードの上部にある [階層リンク] ボタン、[テンプレートの編集][コピーして編集] または [空アイテムの作成] の順にクリックします。

5ebdb33f-aad2-4c10-a328-5e8b04c56a36

スタイルを作成するには、オブジェクトを選択してから、[オブジェクト] メニューで [スタイルの編集][コピーして編集] または [空アイテムの作成] の順にクリックします。

  • [コピーして編集] を選択すると、コントロールの既定のスタイルまたはテンプレートから開始します。

  • [空アイテムの作成] を選択すると、最初から開始します。

[現在のテンプレートの編集] オプションは、既に作成したスタイルやテンプレートを編集する場合のみ表示されます。 既定のシステム テンプレートを使用しているコントロールの場合は表示されません。

[スタイル リソースの作成] ダイアログ ボックスで、スタイルやテンプレートを後で使えるように指定するか、スタイルやテンプレートを特定の種類のコントロールすべてに適用することができます。

4818ee6a-ce60-4b79-91c8-3b1871829eea

注意

スタイルやテンプレートを全種類のコントロールに対して作成することはできません。コントロールがスタイルやテンプレートをサポートしていない場合、[階層リンク] ボタンはアートボード上部に表示されません。

メイン ドキュメントのスコープの編集に戻るには、[スコープを <オブジェクト名に> 戻す] 55844eb3-ed98-4f20-aa66-a6f5b23eeb2bをクリックします。

4a5612e1-7a28-4587-b870-0fe7112ec2ad

短いビデオを見る: インストール済みフィーチャーの構成 スタイルの作成

短いビデオを見る: インストール済みフィーチャーの構成 Expression Blend でコントロール テンプレートを作成する

コントロールにスタイルまたはテンプレートを適用する

[オブジェクトとタイムライン] パネルでオブジェクトを右クリックして、[テンプレートの編集][リソースの適用] の順に選択します。

dc12debc-7711-47d9-84ce-10322a384397

コントロールの既定のスタイルまたはテンプレートを復元する

コントロールを選択し、[プロパティ] パネルで [スタイル] または [テンプレート] のプロパティの場所を探します。 次に、ショートカット メニューの [詳細オプション] 12e06962-5d8a-480d-a837-e06b84c545bb[リセット] の順にクリックします。

表示状態: コントロールの状態に基づき、コントロールの外観を変更する

ユーザーとの対話に基づいて、コントロールの視覚的外観が異なります。 たとえば、ユーザーがボタンをクリックするとボタンが緑色になる、アニメーションを実行できるなどです。 遷移を使用すると、表示状態の間の時間を短縮または延長することができます。

a95c671a-5639-40b9-83db-1e6b214330d5

短いビデオを見る: インストール済みフィーチャーの構成 WPF コントロールの状態を管理する

リソース: 色、スタイル、テンプレートを作成し、後で再利用する

プロジェクトにあるあらゆるものをリソースに変換できます。 リソースは、 アプリケーションのさまざまな場所で再利用できるオブジェクトです。 たとえば、1 回色を作成し、リソースにしてから、その色を複数のオブジェクトに使用することができます。 これらすべてのオブジェクトの色を変更するには、単に色リソースを変更します。

89203705-cf66-46e0-b153-52a23cd744f7 6bff8b19-3cd5-41a0-bbf9-ff65532d5aae

短いビデオを見る: インストール済みフィーチャーの構成 リソースに軽く触れる

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

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

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

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

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