away3D基础6-颜色材质

在前面的教程里我们已经接触到材质。这篇教程将探讨如何使用一些基本的材质:color materials, phong shader 和lighting

为3D元素添加颜色与线框材质会让3D元素更有三维的感觉。本教程要解释的是在流行的3D引擎away3D里的一些基础的颜色材质的使用。

先决条件

本教程建立在我们别的教程基础之上。假如你是flash3D菜鸟,你可能会先要去看看这些教程。举个例子,有些源文件,点击附带的as文件查看它们是如何工作的。所有这些例子都要用到一个Cover.as文件。这个文件是让教程里用到的flash影片不能同时工作,否则会拖垮你的电脑。如果你不确定如何使用这些例子,查看这个教程

教程里的一部分例子会用到“纹理”。关于纹理与材质我们会在后边教程详细介绍,如果要让代码在flash cs3里工作, 读这个教程.

Color materials(颜色材质)

默认情况下,Away3D里的所有3D元素都拥有一个带黑线框和随机底色的标准材质。教程里的大多数例子里我们都用这类材质,所以每次我们重新打开这些例子时,那些3d模型都呈现不同的颜色。这种材质我们称之为WireColorMaterial。

在away3D里书写代码有两种风格:紧凑与易读。紧凑方式要在创建实例时将颜色值传递给构造函数:

1.var sphere:Sphere = new Sphere({material:"orange#red"});

2.view.scene.addChild(sphere);

3.var sphere:Sphere = new Sphere({material:"orange#red"});

4.view.scene.addChild(sphere);

易读方式你要这样做:

1.var wireColorMaterial:WireColorMaterial = new WireColorMaterial();

2.wireColorMaterial.color = 0xFFA500;wireColorMaterial.wirecolor = 0xFF0000;

3.var sphere:Sphere = new Sphere();sphere.material = wireColorMaterial;

4.view.scene.addChild(sphere);

clip_image001

(Basic09_WireColorMaterial.as)

WireColorMaterial可以设置线的宽度:

1.wireColorMaterial.width = 5;

你也可以为3D元素指定无线框的纯色材质(ColorMaterial):

1.var sphere:Sphere = new Sphere({material:"orange"});

用易读模式书写如下:

1.var colorMaterial:ColorMaterial = new ColorMaterial();

2.colorMaterial.color = 0xFFA500;var sphere:Sphere = new Sphere();

3.sphere.material = colorMaterial;

clip_image002

(Basic09_ColorMaterial.as)

还有一个与之相对的只有线框的材质(WireframeMaterial):

1.var colorMaterial:WireframeMaterial = new WireframeMaterial();

2.colorMaterial.color = 0xFFA500;colorMaterial.width = 2;

3.var sphere:Sphere = new Sphere();sphere.material = colorMaterial;

4.view.scene.addChild(sphere);

clip_image003

(Basic09_WireframeMaterial.as)

这个材质没有像前面那样“简洁”语法。

材质为颜色材质的3D模型发生旋转时,我们很难分辨。但是加上轮廓线就不一样了。所有的3D元素都可以加上轮廓线,就像这样:

1.var outlineMaterial:WireframeMaterial = new WireframeMaterial(0x000000);

2.outlineMaterial.width = 3;sphere.outline = outlineMaterial;

这样球体就有了3像素宽的轮廓线了,再看下面的海龟.

code: Basic09_ColorMaterial2.as

Light and reflective color materials

当渲染3D模型时, “阴影”材质会考虑“光源”情况。假如你使用一种需要“光源”的材质时而忘了添加光源,模型就不会被渲染。Away3D里有三种光源,但通用于几种材质的是- the DirectionalLight3D。

1.var light:DirectionalLight3D = new DirectionalLight3D();

2.view.scene.addChild(light);

在场景里加光源后,你发现场景里的模型并不像我们有光源后所应该显示的那样。这是因为光源默认放在3D世界中心(0,0,0)。为了产生效果我们要让光源位置偏移。

1.light.y = 500;light.x = -300;light.z = -200;

上面数值是随机的,数值的不同光源位置会不同。另外光的反射情况也会根据三个属性的值的不同而不同,这三属性是:ambient, diffuse 和specular。它们的值都在0~1之间:

1.light.specular = 1;light.diffuse = 0.5;light.ambient = 0.5;

注意:光源还有一个属性brightness.这个属性在渲染之后就不能重新设置,所以一旦创建出光源之后就设置好这个属性的值。

ShadingColorMaterial

这种材质为场景布置光影效果很有用处。有了它我们才能看到光源对3D模型的影响。你可以通过给该材质构造函数付初始值也可通过设置.color属性指定颜色:

var mat:ShadingColorMaterial = new ShadingColorMaterial(0xff00ff);

点击下面的球产生随机颜色。

code: Basic09_ShadingColorMaterial.as

PhongColorMaterial

PhongColorMaterial与ShadingColorMaterial一样产生阴影,但不同的是它显得更为平滑。

clip_image004

(Basic09_PhongColorMaterial.as)

每种光源都有其自身的颜色。默认情况下,光源是纯白色的。光与材质的颜色会混合,假如是黄光与蓝球,最终结果是看到绿球。下面的Flex程序里,你可以给各属性设置生成你想要的效果:

code: DirectionalLight3DTest.mxml, Viewport.mxml

在下篇教程里,我们会更进一步讨论纹理和更高级的shaders。这些都可以很好地为我们提高3D模型效果。

转载于:https://www.cnblogs.com/nooon/archive/2009/05/18/1459593.html

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
未来社区的建设背景和需求分析指出,随着智能经济、大数据、人工智能、物联网、区块链、云计算等技术的发展,社区服务正朝着数字化、智能化转型。社区服务渠道由分散向统一融合转变,服务内容由通用庞杂向个性化、服务导向转变。未来社区将构建数字化生态,实现数据在线、组织在线、服务在线、产品智能和决策智能,赋能企业创新,同时注重人才培养和科研平台建设。 规划设计方面,未来社区将基于居民需求,打造以服务为中心的社区管理模式。通过统一的服务平台和应用,实现服务内容的整合和优化,提供灵活多样的服务方式,如推送式、订阅式、热点式等。社区将构建数据与应用的良性循环,提高服务效率,同时注重生态优美、绿色低碳、社会和谐,以实现幸福民生和产业发展。 建设运营上,未来社区强调科学规划、以人为本,创新引领、重点突破,统筹推进、整体提升。通过实施院落+社团自治工程,转变政府职能,深化社区自治法制化、信息化,解决社区治理中的重点问题。目标是培养有活力的社会组织,提高社区居民参与度和满意度,实现社区治理服务的制度机制创新。 未来社区的数字化解决方案包括信息发布系统、服务系统和管理系统。信息发布系统涵盖公共服务类和社会化服务类信息,提供政策宣传、家政服务、健康医疗咨询等功能。服务系统功能需求包括办事指南、公共服务、社区工作参与互动等,旨在提高社区服务能力。管理系统功能需求则涉及院落管理、社团管理、社工队伍管理等,以实现社区治理的现代化。 最后,未来社区建设注重整合政府、社会组织、企业等多方资源,以提高社区服务的效率和质量。通过建立社区管理服务综合信息平台,提供社区公共服务、社区社会组织管理服务和社区便民服务,实现管理精简、高效、透明,服务快速、便捷。同时,通过培育和发展社区协会、社团等组织,激发社会化组织活力,为居民提供综合性的咨询和服务,促进社区的和谐发展。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值