在Expression Blend中使用XAML建立3D应用程序

参考微软<Creating 3D Content with WPF>文档翻译。

源文件下载http://www.wangpangzi.net/uploads/200703/3dlab.zip

本文的目的是在Blend环境中研究Windows Presentation Foundation(WPF)的3D特性,首先我们导入一个已经建立好的3D模型到程序中,使用动画让其旋转。然后,我们会研究如何动态的使用代码生成模型。最后我们会把2D的用户界面映射到3D模型上,用户并可以与其交互。

注意,源文件中的源代码是为每个阶段而设计的,因此你可以从中间开始学习或者做阶段备份之用。每个练习也包含了一份完整的完成后源代码,你可以直接通过它们查看最终结果。

练习一 使用静态3D模型(共4个任务)

在本练习中,你将会导入一个已经建立好的3D模型,并使用Viewport3D对象把它显示出来,然后使用动画让他旋转起来。最后,用户可以使用鼠标旋转这个模型。

任务1 导入3D模型。

虽然我们可以使用XAML直接建立3D模型了,但对于稍微复杂的模型来说,我们最好使用专业工具建立模型,再导出成XAML格式供我们使用。在本练习中,我们将会使用一个用这种方式建立的3D模型,即一个XAML文件。并将其导入Blend中。

1.打开Microsoft Expression Blend.

2.运行File > New Project…建立新程序。

3.在弹出的New Project 窗口中选择Standard Application,在Name中输入Show3DModel, 选择你的保存文件夹,点OK建立新程序。

4.在Source\Exercise1子文件中,你会看到一个叫做Model.xaml的文件,它包含了你将要使用的3D模型。用记事本打开这个文件,你会看到很多代码,这些代码靠手工输入无疑是困难并且枯燥的。而生成这个模型文件的工具就大大简化了工作,并且自动的将代码封装在Viewport3D里并放入Viewbox中。你可以将整个文件放入XamlPad中来预览模型。

5.将Model.xaml中的所有内容贴到应用程序中window.xaml文件里的Grid标签中。

6.按F5编译程序,运行结果如下:

任务2 改变摄像机的位置。

  在本任务中,我们将了解如何改变摄像机的位置。

1.  打开Window1.xaml文件,找到Viewport3D中的Viewport3D.Camera 标签,它包括了一个PerspectiveCamera,即透视摄像机。它的UpDirection 目前是0,1,0,把它改为0.2,1,0,然后按F5运行程序,看看效果的变化。

2.  改变摄像机的Position为0.25,0,2.2339, 然后运行程序,观察摄像机位置发生的变化。

3.  改变Position为3,0,2.2339,同时也改变LookDirection为-3,0,-2.2,然后再运行程序观察变化。

4.  好,现在请随便尝试几个数据组合,请注意如果尝试过大的数据,很容易使摄像机跑到一个较远的地方,因此会什么都看不到。

5.  当你完成实验后,用一下代码使其回到初始的默认位置,以进行后面的任务。

<PerspectiveCamera x:Name="FrontOR9" FarPlaneDistance="10" LookDirection="0,0,-1"
   UpDirection="0,1,0" NearPlaneDistance="1" Position="0,0,2.29339"
   FieldOfView="39.5978" />

任务3 给模型添加动画。

1.打开Window1.xaml文件,找到Viewport3D中的Viewport3D.Camera 标签,在此标签后,添加下面的代码:

<Viewport3D.Triggers>
 <EventTrigger RoutedEvent="Viewport3D.Loaded">
 <EventTrigger.Actions>
 <BeginStoryboard>
 <Storyboard>
 <Rotation3DAnimation Storyboard.TargetName="WpfLogoOR12"
 Storyboard.TargetProperty="(Model3DGroup.Transform).(Transform3DGroup.Children)[2].(RotateTransform3D.Rotation)"
 Duration="0:0:5" AutoReverse="True"
 RepeatBehavior="Forever" AccelerationRatio="0.4" DecelerationRatio="0.4">
 <Rotation3DAnimation.From>
 <AxisAngleRotation3D Axis="2,10,3" Angle="-45" />
 </Rotation3DAnimation.From>
 <Rotation3DAnimation.To>
 <AxisAngleRotation3D Axis="2,10,3" Angle="45" />
 </Rotation3DAnimation.To>
 </Rotation3DAnimation>

 </Storyboard>
 </BeginStoryboard>
 </EventTrigger.Actions>
 </EventTrigger>
</Viewport3D.Triggers>

这段代码使用了Rotation3DAnimation标签给模型添加动画,Storyboard.TargetName和Storyboard.TargetProperty属性指示了模型发生动画的具体部分。(WpfLogoOR12是模型中的一个标签,代表logo模型整体)

2.运行程序,logo模型会自动的发生反复旋转。

任务4 可交互的旋转模型。

在本练习的最后一个任务中,我们将允许使用鼠标旋转模型。你会用到 3D Tools for the Windows Presentation Foundation, 这是一套可以辅助我们在WPF中使用XAML制作3D应用的工具,可以从http://www.codeplex.com/3DTools上下载。当然,我们现在已经不必去下载了,我们要用到的3DTools.dll 库文件在实例的Source\Exercise1文件夹下。

1.给项目中添加3DTools.dll库文件。(在Project面板中,右击References, 选Add Reference…, 然后找到3DTools.dll文件)

2.打开Window1.xaml文件,添加一个XML 命名空间声明,以在这个XAML文件中使用3D tools:

<Window x:Class="Show3DModel.Window1"
 xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
 xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
 xmlns:tools="clr-namespace:_3DTools;assembly=3DTools" 
 Title="Show3DModel" Height="300" Width="300"
 >

3.添加<tools:TrackballDecorator>标签,使<Viewport3D></Viewport3D>标签整体包含在添入的标签<tools:TrackballDecorator>... </tools:TrackballDecorator>中。

TrackballDecorator允许使用鼠标左键拖动旋转包含的模型,使用鼠标右键缩小放大。

4.编译运行程序,现在就实现与模型的旋转、缩小放大交互了。

本练习完

原译文:http://www.wangpangzi.net/article.asp?id=87

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

发表于

我来说两句

0 条评论
登录 后参与评论

相关文章

来自专栏葡萄城控件技术团队

Spread for Windows Forms高级主题(1)---底层模型

底层模型概述 Spread控件提供了很多模型,这些模型提供了自定义控件的基础架构。同时,这些模型作为底层模板,派生出了更多通用的快捷对象。 在不使用Spread...

20560
来自专栏用户2442861的专栏

Tesseract文字训练,以及样本生成

版权声明:本文为博主原创文章,未经博主允许不得转载。 https://blog.csdn.net/haluoluo211/article/details...

25310
来自专栏帮你学MatLab

期刊要求图片eps格式的输出

期刊图片 部分版本在生成eps文件是会报错,才发现原来这个工具升级了,这是新的下载地址:http://www.mathworks.com/matlabcen...

36560
来自专栏编程

厉害了,用Python一行代码实现人脸识别

摘要: 1行代码实现人脸识别,1. 首先你需要提供一个文件夹,里面是所有你希望系统认识的人的图片。其中每个人一张图片,图片以人的名字命名。2. 接下来,你需要准...

30480
来自专栏Python小屋

使用Python提取JPEG图像文件dpi并计算物理尺寸

感谢浙江省浦江中学方春林老师提供的问题、测试图像和第一版本的代码! 下面的代码需要安装Python图像处理库pillow,由于不同公司对JPEG压缩算法和格式的...

641100
来自专栏python爬虫日记

利用jTessBoxEditor工具进行Tesseract3.02.02样本训练,提高验证码识别率

前文已经简要介绍tesseract ocr引擎的安装及基本使用,其中提到使用-l eng参数来限定语言库,可以提高识别准确率及识别效率。

93620
来自专栏林德熙的博客

WPF 解决弹出模态窗口关闭后,主窗口不在最前

本文告诉大家如何解决这个问题,在 WPF 的软件,弹出一个模态窗口。使用另一个窗口在模态窗口前面。从任务栏打开模态窗口。关闭模态窗口。这时发现,主窗口会在刚才使...

55120
来自专栏测试开发架构之路

前端之bootstrap模态框

  简介:模态框(Modal)是覆盖在父窗体上的子窗体。通常,目的是显示来自一个单独的源的内容,可以在不离开父窗体的情况下有一些互动。子窗体可提供信息、交互等。...

39150
来自专栏贾志刚-OpenCV学堂

干货 | 基于OpenCV Python实现二维码检测与识别

特别要关注的是图中三个黑色正方形区域,它们就是用来定位一个二维码的最重要的三个区域,我们二维码扫描不检测首先要做的就是要发现这三个区域,如果找到这个三个区域,我...

2K20
来自专栏我爱编程

Day21第三方模块Pillow&requests

Pillow PIL:Python Imaging Library,已经是Python平台事实上的图像处理标准库了。PIL功能非常强大,但API却非常简单易用。...

33550

扫码关注云+社区

领取腾讯云代金券