次の方法で共有


WPF グラフィックス、アニメーション、およびメディアの概要

更新 : 2007 年 11 月

ここでは、アプリケーションにグラフィックス、遷移効果、サウンド、およびビデオを追加できるようにする Windows Presentation Foundation (WPF) のグラフィックス、アニメーション、およびメディア機能について説明します。

WPF には、高度な描画およびアニメーション機能が用意されています。これらの機能は、以前は特殊なライブラリ (具体的には Microsoft Windows グラフィックス デバイス インターフェイス (GDI) および Microsoft Windows GDI+) からしか使用できませんでした。WPF では現在、マルチメディア、ベクタ グラフィックス、アニメーション、およびコンテンツ構成の統合サポートが提供されるので、開発者は人の目をひきつけるユーザー インターフェイスとコンテンツを簡単に開発できます。Microsoft Visual Studio .NET または Microsoft メモ帳などのテキスト エディタを使用して、ベクタ グラフィックスまたは複雑なアニメーションを作成し、メディアをアプリケーションに統合することができます。

このトピックには次のセクションが含まれています。

  • WPF のグラフィックスとマルチメディアの新機能
  • アニメーション
  • メディア
  • 関連トピック

WPF のグラフィックスとマルチメディアの新機能

WPF では、Windows 開発者のために、次の利点がある新しいグラフィックス機能が導入されています。

  • 解像度およびデバイスに依存しないグラフィックス。WPF のグラフィックス システムでは、解像度およびデバイスに依存しないようにするためにデバイスに依存しない単位が使用されます。各デバイス非依存ピクセルは、システムのドット/インチ (dpi) 設定に従って自動的にスケーリングされます。

  • 精度の向上。WPF の座標系では floats ではなく doubles が使用されます。変換および不透明度の値も doubles を使用して表されます。また、WPF はより広い色域 (scRGB) をサポートし、さまざまな色空間からの入力の管理を統合的にサポートします。

  • 高度なグラフィックスおよびアニメーションのサポート。WPF では、シーン グラフを管理することでグラフィックス プログラミングが簡略化されます。シーンの処理、レンダリング ループ、およびバイリニア補間に煩わされることはありません。WPF はヒット テストをサポートし、アニメーション システムを統合し、アルファ合成を完全にサポートします。

  • ハードウェアの加速。WPF のグラフィックス システムは、グラフィックス ハードウェアを利用して CPU 使用率を最小限に抑えるように設計されています。

2-D 図形

WPF には、次の図に示すような四角形や楕円などの、一般的に使用されるベクタ描画の 2-D 図形のライブラリが用意されています。

楕円と四角形

これらの固有の WPF 図形は単なる図形ではなく、キーボード入力やマウス入力を含む最も一般的なコントロールで得られる機能の多くを実装するプログラミング可能な要素です。

<Window
  xmlns="https://schemas.microsoft.com/winfx/2006/xaml/presentation"
  xmlns:x="https://schemas.microsoft.com/winfx/2006/xaml"
  x:Class="Window1" >
  <Ellipse Fill="LightBlue" MouseUp="ellipseButton_MouseUp" />
</Window>
public partial class Window1  : Window
{
    void ellipseButton_MouseUp(object sender, MouseButtonEventArgs e)
    {
        MessageBox.Show("Me, a simple ellipse, was mouse clicked!");
    }
}

上記の XAML マークアップおよび分離コードの出力を次の図に示します。

"you clicked the ellipse!" というテキストを含むウィンドウ

詳細については、「WPF での図形と基本描画の概要」を参照してください。導入サンプルについては、「Shape 要素のサンプル」を参照してください。

2-D ジオメトリ

WPF で提供される 2-D 図形では不十分な場合は、WPF でのジオメトリおよびパスのサポートを利用して独自の図形を作成します。ジオメトリを使用して図形を描画ブラシとして作成し、他の WPF 要素をクリップする方法を次の図に示します。

パスのさまざまな使用

詳細については、「ジオメトリの概要」を参照してください。導入サンプルについては、「ジオメトリのサンプル」を参照してください。

2-D 効果

WPF には、さまざまな効果を作成するために使用できる 2-D クラスのライブラリが用意されています。WPF の 2-D レンダリング機能を使用すると、UI 要素をグラデーション、ビットマップ、描画、およびビデオで塗りつぶすことができます。また、回転、拡大縮小、および傾斜を使用して要素を操作できます。WPF ブラシを使用して得られる多くの効果の例を次の図に示します。

さまざまなブラシの図

詳細については、「WPF のブラシの概要」を参照してください。導入サンプルについては、「ブラシのサンプル」を参照してください。

3-D レンダリング

WPF には、さらに人目を引くレイアウト、UI、およびデータの視覚化を実現するために WPF の 2-D グラフィックス サポートと統合された一連の 3-D レンダリング機能が用意されています。たとえば、WPF では、次の図に示すように 3-D 図形のサーフェイスに 2-D イメージを描画できます。

Visual3D サンプルのスクリーン ショット

詳細については、「3-D グラフィックスの概要」を参照してください。導入サンプルについては、「3-D ソリッドのサンプル」を参照してください。

アニメーション

アニメーションを使用すると、コントロールおよび要素の拡張、振動、回転、およびフェード効果を実現できます。また、人の関心を引くページの遷移なども作成できます。WPF ではほとんどのプロパティをアニメーション化できるため、ほとんどの WPF オブジェクトをアニメーション化できるだけでなく、WPF を使用して作成するカスタム オブジェクトをアニメーション化することもできます。

アニメーション キューブのイメージ

詳細については、「アニメーションの概要」を参照してください。導入サンプルについては、「アニメーション サンプル ギャラリー」を参照してください。

メディア

イメージ、ビデオ、およびオーディオは、情報およびユーザー エクスペリエンスを伝えるメディア リッチな手段です。

イメージ

アイコン、背景、およびアニメーションのパーツを含むイメージは、ほとんどのアプリケーションの中核です。イメージは頻繁に使用する必要があるため、WPF ではさまざまな方法でイメージを処理できます。その方法の一例を次の図に示します。

スタイル サンプル スクリーン ショット

詳細については、「イメージングの概要」を参照してください。導入サンプルについては、「WPF フォト ビューアのデモ」を参照してください。

ビデオとオーディオ

WPF のグラフィックス機能の主要な特性は、ビデオやオーディオを含むマルチメディアの処理をネイティブにサポートすることです。次の例は、アプリケーションにメディア プレーヤーを挿入する方法を示しています。

<MediaElement Source="media\numbers.wmv" Width="450" Height="250" />

MediaElement はビデオとオーディオの両方を再生でき、カスタム UI を簡単に作成できる拡張性を備えています。

詳細については、「マルチメディアの概要」を参照してください。導入サンプルについては、「メディア ギャラリー」を参照してください。

参照

概念

パフォーマンスの最適化 : 2D グラフィックスとイメージング

WPF での図形と基本描画の概要

純色およびグラデーションによる塗りつぶしの概要

イメージ、描画、およびビジュアルによる塗りつぶし

アニメーションの概要