Silverlight 5 轻松开启绚丽的网页3D世界

Silverlight 5 轻松开启绚丽的网页3D世界

Silverlight 5已正式发布,新版本的最大亮点是通过引入轻量级的XNA游戏开发框架,从而可以在浏览器内轻松实现网页的3D应用。与此同时,微软正式发布了Silverlight Toolkit (December 2011) for Silverlight 5,这是一个超出开发者想象的工具包,你可以在这里下载,在这一版本中提供了大量对3D的支持工具,提供与3D项目相关的多种Visual Studio项目模板(如图1所示),包括:

lSilverlight3DApp:Silverlight 3D主程序(客户端)

lSilverlight3Dlib:Silverlight 3D主程序类库(客户端类库)

lSilverlightEffect:Silverlight 3D特效库(客户端库)

lSilverlight3DAppContent:Silverlight 3D主程序附带的素材库(客户端)

lSilverlight3DWeb:Silverlight 3D寄宿的Web应用程序(服务端)。

lSilverlight3DWebContent:直接发在服务器端的素材库,用于减少XAP包的大小。

1.png


 

图1 Toolkit中3D模板项目

使用Silverlight Toolkit可以非常容易地实现以前在Web中无法想象的3D特效,包括粒子效果(如图2)、光照效果、角色Skinning效果(如图3)。

2.png

 

图2 通过粒子效果形成烟雾特效

3.png

 

图3 角色Skinning效果

注:使用Silverlight Toolkit for Silverlight 5新建Silverlight3D项目前,需要在开发环境中安装XNA Game Studio 4否则无法打开素材项目。


伴随Silverlight 5正式版发布,已经有第三方3D引擎进行了框架更新,这其中包括非常优秀的Babylon 3D开源引擎,有兴趣的朋友可以通过一下地址获取基于Silverlight 5正式版的3D引擎源码,其中还包括一个顶点着色器、一个像素着色器、一个3D模型导入器和一个示例。对于主流的3D建模软件(包括MAYA、3D Studio Max、Modo、Blender)来说都可以导出.obj文件,这一类型文件可以无缝地集成到Babylon 3D开源引擎中,使得开发Silverlight 3D应用具有更好的兼容性(图4是源码包中的示例)。

4.png

 

图4 Babylon 3D示例

对于Silverlight 5而言,浏览器内的权限控制显得有点苛刻,如果我们需要在实际项目中开发浏览器内的3D应用,那么需要打开应用在浏览器内的权限,操作步骤如下:

1.在Silverlight项目属性中,勾选“允许在浏览器外运行应用程序“和”在浏览器内运行时需要提升的信任“(如图5所示),这时项目的Properties目录下将产生对应的OutOfBrowserSettings.xml和InBrowserSettings.xml两个文件,而后续步骤的设置将改变这两个文件的内容。

未命名.jpg

 

图5 提升Silverlight应用程序信任级别

2.点击“浏览器外设置”,勾选“使用GPU加速”与“在浏览器之外运行时需要提升的信任” (如图6所示),以保证使用GPU加速,如果此两项不选,则会出现RenderModeReason.GPUAccelerationDisabled的情况。

未命名2.jpg

 

图6 开启GPU加速

3.现在我们需要将第一步生成的OutOfBrowserSettings.xml和InBrowserSettings.xml两个文件加入到生成的XAP文件内容中,具体做法是在项目中分别选择两个文件,在其属性中的“生成操作”选择为“内容”(如图7所示)。

未命名3.jpg

 

图7 权限配置文件的生成操作选择

4.最后由于Silverlight 5正式版考虑到客户端环境的差异(包括有无显卡、显卡是否支持3D加速等多种情况),加入了对浏览器内3D内容的显示权限管理,因此,我们需要根据客户端实际情况提示使用者打开对本网站的3D显示权限。代码如下:

if (GraphicsDeviceManager.Current.RenderMode != RenderMode.Hardware){ switch (GraphicsDeviceManager.Current.RenderModeReason)
{
case RenderModeReason.GPUAccelerationDisabled: MessageBox.Show("3D加速被禁用,请启用显卡3D加速后刷新本页面!"); break; case RenderModeReason.SecurityBlocked: MessageBox.Show("请在右键的Silverlight菜单中打开权限,找到本站点域名后允许3D安全策略!"); break; case RenderModeReason.Not3DCapable: MessageBox.Show("没有找到显卡!"); break; case RenderModeReason.TemporarilyUnavailable: MessageBox.Show("暂时无法使用!"); break;
}
}

浏览器的权限可通过Silverlight程序的右键菜单中选择“权限”选项卡,然后找到应用程序的宿主域名,并将其3D权限设置为“允许”(如图8所示)

未命名0.jpg

 

图8 客户端3D权限设置

如果您想体验Silverlight 5绚丽的网页3D世界,笔者已经为你整理了更多精彩的示例,还等什么?现在就点击下面的网页来体验一下吧!

http://space.silverlightchina.net/xpeter/demo/3D.htm

Silverlight 5 Toolkit的3D示例程序源码,您可以在其安装目录下找到,默认目录如下:

C:\Program Files\Microsoft SDKs\Silverlight\v5.0\Toolkit\dec11\Source

解压缩该目录下的Sample source code.zip,可以在其中的Xna目录下找到示例源码。

本文笔者只是给大家介绍了Silverlight 5中3D Web应用中的凤毛麟角,对于Silverlight来说构建类似于XNA的大型3D应用基本已经具备条件。

转载于:https://www.cnblogs.com/xpeter/archive/2012/01/09/2317554.html

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值