Freigeben über

Windows Presentation Foundation, Viewport3D

  • Artikel

Windows Presentation Foundation (WPF) の売りの１つは、2Dも3Dもビデオもテキストも同じように扱えることです。これまでですと、3DはDirect3D、ビデオはDirctShow、2DはGDIなどと、それぞれ異なるプログラミングモデルとアーキテクチャを使わざるを得ませんでした。WPFでは描画としてどれも同じように使えます、たとえば描画したいところにテキストを書きたければ、 <TEXTBLOCK>World</TEXTBLOCK>と書けばよいし、画像を表示させたければ、<Image Source="follow.jpg" />に入れ替えるだけです。

3Dを描画したい場合には、Viewport3D を使います。ただし3Dを描画するにはカメラやジオメトリオブジェクト、マテリアル、座標変換などを設定しなければならないので、1行というわけにはいきません。ここでは、よく使われるティーポットを回転させる例をXAMLで紹介します。

まず、カメラの視点位置、向き、視野角などを設定します。

  <DockPanel Background="DarkBlue">
    <Viewport3D Name="myViewport">
      <!--カメラ-->
      <Viewport3D.Camera>
<PerspectiveCamera FarPlaneDistance="20" LookDirection="5,-2,-3"
UpDirection="0,1,0" NearPlaneDistance="0" Position="-5,2,3" FieldOfView="45" />
</Viewport3D.Camera>

次に光源です、ここでは白のディフューズ平行光源と、暗い灰色のアンビエント光を設定します。
      <!--ライトとモデル-->
      <ModelVisual3D x:Name="topModelVisual3D">
<ModelVisual3D.Children>
          <!--アンビエント光-->
          <ModelVisual3D>
<ModelVisual3D.Content>
<AmbientLight Color="#333333" />
</ModelVisual3D.Content>
</ModelVisual3D>
          <!--ディフューズ光の平行光-->
          <ModelVisual3D>
<ModelVisual3D.Content>
<DirectionalLight Color="#FFFFFFFF" Direction="-0,-0,-5" />
</ModelVisual3D.Content>
</ModelVisual3D>

そして、モデルの定義です、ここではジオメトリデータをリソースを使って定義しています。マテリアルとしてはやはり白を　SolidColorBrush で設定しています。ご想像通り、ここで画像やテキストを設定すれば、テクスチャとして3Dモデルに貼り付けられます。
          <!--モデル-->
          <ModelVisual3D>
<ModelVisual3D.Content>
              <!--ジオメトリデータ-->
              <GeometryModel3D Geometry="{StaticResource myTeapot}">
                <!--マテリアル-->
                <GeometryModel3D.Material>
<DiffuseMaterial>
<DiffuseMaterial.Brush>
<SolidColorBrush Color="White" Opacity="1.0" />
</DiffuseMaterial.Brush>
</DiffuseMaterial>
</GeometryModel3D.Material>

最後に座標変換です、ここではStoryBoard　(省略)　を使って回転のアニメーションを設定しています。
                <!--座標変換-->
                <GeometryModel3D.Transform>
<RotateTransform3D>
<RotateTransform3D.Rotation>
<AxisAngleRotation3D x:Name="myAngleRotation" Axis="0,3,0" Angle="1" />
</RotateTransform3D.Rotation>
</RotateTransform3D>
</GeometryModel3D.Transform>
</GeometryModel3D>
</ModelVisual3D.Content>
</ModelVisual3D>
</ModelVisual3D.Children>
</ModelVisual3D>

      <!--アニメーション-->
      <Viewport3D.Triggers>
<EventTrigger RoutedEvent="Viewport3D.Loaded">
<BeginStoryboard>
<Storyboard>
<DoubleAnimation Storyboard.TargetName="myAngleRotation"
Storyboard.TargetProperty="Angle" From="0" To="360"
Duration="0:0:10" RepeatBehavior="Forever" />
</Storyboard>
</BeginStoryboard>
</EventTrigger>
</Viewport3D.Triggers>
</Viewport3D>
</DockPanel>

決して簡単ではありませんが、3Dグラフィックスの基本を知っていれば、何のことはありません、お決まりの設定ばかりです。(.IE上で動作するXAMLファイルを添付しましたのでトライしてみてください。ただし動作させるには、NET Framework 3.0 ランタイムをインストールする必要があります。

teapot.xaml

Comments

  • Anonymous
    September 06, 2006
    xamlの3Dアニメーションについて質問があります。

    Storyboardの移動やスケールはXYZに分かれてアニメーションできるのに、回転アニメーションRotation3DAnimationUsingKeyFramesだけは、一つの軸でしか回転できません。

    回転はどうやればXYZ全部できるでしょうか？
  • Anonymous
    September 06, 2006
    xamlの3Dアニメーションについて質問があります。

    Storyboardの移動やスケールはXYZに分かれてアニメーションできるのに、回転アニメーションRotation3DAnimationUsingKeyFramesだけは、一つの軸でしか回転できません。

    回転はどうやればXYZ全部できるでしょうか？
  • Anonymous
    September 08, 2006
    <a href="http://windowssdk.msdn.microsoft.com/en-us/library/system.windows.media.animation.rotation3danimationusingkeyframes.keyframes.aspx">AxisAngleRotation3D</a> を使いましょう。
  • Anonymous
    September 08, 2006
    The comment has been removed
  • Anonymous
    September 10, 2006
    前回はありがとうございました。

    ところでまた質問があるのですが、Pivot(中心点ですよね？)は、xamlでどのように記述すればいいのでしょうか？
  • Anonymous
    September 14, 2006
    RotateTransform3DならCenterX,CenterY,CenterZというプロパティが使えます。
  • Anonymous
    September 15, 2006
    何度もありがとうございました。

    中心点がわかったので、3Dアニメーションツールからxaml形式にエクスポートできるようになりました。
    http://tool.cyberdelia.net/
  • Anonymous
    September 17, 2006
    MeshGeometry3Dで、法線Normalsを省略しても、勝手に法線を計算してくれているようですが、スムージング角度を指定したりできますか？

    それとも、見た感じ、陰影が少ないのですが、法線は関係なくて、必要もないのでしょうか？

    何度もすみませんが、川西さんしか日本で質問できる人がいないので。
  • Anonymous
    September 20, 2006
    SDKドキュメントhttp://windowssdk.msdn.microsoft.com/en-us/library/ms747437.aspx によると、"Though the Windows Presentation Foundation can determine default normal vectors by using the position coordinates, you can also specify different normal vectors to approximate the appearance of curved surfaces." なので、 自動的に生成してくれるようですが、しっくりこないときは明示的に入れたほうがよいでしょう。
    ちなみにデフォルト テクスチャ座標も自動生成してくれるようです。"As with the Normals property, the graphics system can calculate default texture coordinates, but you might choose to set different texture coordinates to control the mapping of a texture that includes part of a repeating pattern, for example."
  • Anonymous
    September 23, 2006
    川西さん、ありがとうございます。

    どちらも、書き出すか書き出さないか選択できるようにしました。