剑英陪你玩转图形学 (一) 打通任督二脉

发表于2015-09-20
评论8 1.2k浏览

想免费获取内部独家PPT资料库?观看行业大牛直播?点击加入腾讯游戏学院游戏程序行业精英群

711501594
  这是一个尝试的系列,突发奇想觉得有声音可能会更有趣,这个系列Blog都会出视频有声版。这个系列主要是为了玩一玩代码。我觉得呢,写程序是一件很有意思的事情,没有必要搞得那么苦大仇深。但是,却总有那么一些人、那么一些资料,非要把写代码搞成一件高山仰止的事情,搞成是非精英屌丝不可完成的任务。搞成是非要你上辈子就注定是个屌丝,这辈子投胎转世还是个屌丝才能够从事的职业。
  简单的事情复杂化,具体的东西抽象化,抽象的东西再把它神化。这就是很多资料对你所做的事,他们,只是把你的大脑搞乱,然后让你觉得,只有成为屌丝,才能写好程序。我想搞出一些不一样的声音。
  大家好,我叫李剑英。我姓李,又总是一副屌丝的样子,圈内人称李总。不要百度搜索我的名字,你搜不到,我说的是朋友圈。

快速提高班
现在教大家一些快速提高自己业务(zhuangbi)水平的方法。要提高自己的业务水平,第一个要诀是:忍。等到别人问你问题,不要主动去说。
1、问:图形学中什么最重要
标准答案:首先得轻叹一口气,注意轻叹一口气的时机非常重要,在思考两到三秒后(其实是故作姿态),然后叹一口气。哎,学问中哪来的高低贵贱,你想要了解什么,你就问吧。
2、问:什么是Shader
标准答案:请注意,在回答这种问题的时候,仅仅叹气已经不能体现你的业务水平了。一定要微微抬起头,转向一个没有人的方向,盯着天花板或者天空(取决于你所在的环境),眼神空灵,表情空洞。表现出一副若有所思,若有所悟的样子,停顿两三秒种之后,微微叹一口气。哎,shader,不过是管线式渲染体系GPU中的异构子程。
3、问:那什么又是异构子程呢
答:异构与同构,乃是哲学中研究主客体关系的一种概念。(其实很简单,必须要扯上哲学,才能凸显出业务水平)
  被人这样打破砂锅问到底,你会不会觉得快要破功了,那,跟着李总一起学点真东西吧。

什么是真东西
这个问题早有公论:

怎么学真东西
阿基米德说:给我一个支点,我就能撬动地球
卡马克说:给我一个像素,我就能弄一个3D引擎
李总说,一个像素也不用,我们现在就弄一个3D引擎。伟人们告诉我们,从零单排就是最好的方式。

从零单排
接下来是一段历史介绍,也就是通常所说的尿点。有事情的同学可以去忙了。
很久以前,有一个屌丝在浴缸里想出了密度这个概念,那时候连阿拉伯数字都还没有,他叫阿基米德。
不久以前,有一个屌丝在浴缸里没事就在想怎么弄出更好3D效果,那时候连GPU都还没有,他叫约翰卡马克。
现在,有一个屌丝,他没有浴缸,准备陪你一起从零单排3D引擎。现在连一行代码都没有,他叫李总。
很久以前,在3D图形硬件还没走走上舞台的时候,3D画面,需要卡马克这样的人在自己的软件中开发出3D渲染功能。所谓渲染,就是突出描写,对画画来说,就是精加工。
卡马克手里的工具就是像素,他写代码把一个个像素画成了3D画面,今天我们叫这个模块:渲染引擎。
软件中自己实现了渲染引擎,软渲染,就是这个意思。那个时代,渲染就是指软渲染。
后来3DFX搞出了Voodoo,GPU才真的普及了,OpenGL、DirectX这一个如雷贯耳的东东才一个个出现,开创了3D硬件加速时代的乱世纷争。
直到Nvidia吃掉了3Dfx,打败Trident的TNT、S3的野人,ATI也打响了镭这个品牌,整个世界仿佛在A卡N卡的光辉下,忘却了渲染本来就是程序。
从此以后,一谈渲染,必定是A卡N卡的硬件加速渲染。而过去的那个渲染,就叫软渲染。历史说到这里为止。
不积跬步,无以至千里;不积小流,无以成江海。
不学说话,唱不了歌;不学算数,解不了方程。
软渲染,非学不可

开始开发地球上最简陋的软渲染引擎
我们将不使用一个像素,在100行代码内,开发一个基础的渲染引擎。
首先,新建一个控制台项目,我们说过的,不用像素,控制台程序不能绘图。
96行,展示了主循环,建立了一个六个顶点组成的模型,每帧清除画面,并绘制模型,这就是一个3D引擎了。
运行起来是这样的,3D引擎的本质就是在屏幕上画三角形,我们做到了,96行代s码。在屏幕上画三角型就叫做光栅化,现在你已经可以深刻的研究,什么是光栅化。
光栅化就是根据三角形,画出屏幕上的一个个像素,我用的方法并不为高效,而只为清晰易懂。
我用了在三角形的AABB碰撞盒范围内按照字符(像素)进行扫描的方法,扫描时判断每个点在不在三角形内。
  这里用了一种叫做同向法的方法来判断,这个专题不讨论这种对业务(zhuangbi)水平没有帮助的基础问题,如果有基础知识的空缺,需要自己搜索补充一下。接下去,我们要让个模型动起来。在DX OGL的固定管线设计中,设计了三个矩阵去对顶点进行T&L操作,变换与光照。在可编程管线中,就一个矩阵,传递给VertexShader,去做变换与光照。矩阵是可以摸得着,看的见的东西,他并不神秘,接着往下看。我们也会做一个VertexShader,Shader也并不神秘,往下做你自己就明白了。
先来休息一下,回顾一下,把这张图缩小一点,是不是三角形变的清晰起来了你可以从这里取得源代码:
稍微研究一下,你会有一种感觉,3D引擎不过如此。

空间变换
  让模型动起来,我们要对模型做空间变换,听上去好高大上,其实空间就是坐标系。控制台屏幕,左上角0,0。右下角80,25,这就是屏幕空间。而模型为了方便使用,一般会以模型的中点为零点,向三方向扩展描述一个模型的坐标系。比如:y轴向上,x轴向右制作模型,让模型的脚底作为零点,让模型的高度为10,至少需要这些条件才能描述清楚一个坐标系,而模型的零点在他自己的坐标系中永远是零,而当他要在其他坐标系中出现的时候,他需要一个位置。若要问在控制台屏幕上,我们的模型零点在哪?这就是空间变换。模型是由顶点描述的,只要变换了每一个顶点,就变换了整个模型。

矩阵
为了对顶点做变换,我们加入了矩阵,用了一个3X4矩阵,这是3D变换中最常用的矩阵,有些数学库不提供3X4矩阵,用4X4可以兼容。
M11 m12 m13 m14
M21 m22 m23 m24
M31 m32 m33 m34
初看矩阵,会觉得这密密麻麻的数字,高深莫测。其实他却是最简单质朴,土的掉渣的数学工具。
矩阵就好像计算器,我们只写了一个顶点变换函数,输入顶点 xyz 由m11到m13功能决定输出的x,在加上m14.
矩阵的变换方法,仔细一看是非常简单的,就是用乘法和加法建立了关系。
对于算法,计算并不重要,计算所带来的意义才重要。就像小学生考数学必须手算,后来,考试就可以用计算器。
  只要我们理解了算法的意义所在,知道何时应用一个算法能产生怎样的效果。剩下的事情,交给计算器去做吧。简单质朴,土的掉渣的矩阵可以做什么呢?蔡依林最懂。
旋转、跳跃、我闭着眼。
把那个行列式填成这样
1 0 0 0
0 1 0 0
0 0 1 0
  你可以试算一下变换函数,随便输入一个顶点,输出结果没有变化。三点成一面,输入一个三角形就不会有变化。输入一个模型,也不会有变化。你可以从这里取得源代码:https://github.com/lightszero/BlockFun/tree/master/win/havefun1然后运行一下
是不是很有趣呢,旋转跳跃我闭着眼,用你强大的空间想象(脑补)能力把它想象成师洋在跳舞娘,简直停不下来啊。旋转是通过改行列式的值
M14 M24 是XY的偏移,如果你渐进的改编他们,就可以获得跳跃的效果
M11 M22 的修改可以产生缩放,我们也让他动起来,像眯眯眼一样。
旋转、跳跃、我闭着眼。最终就变成了这样
矩阵建议你自己玩一玩,这里只要建立起矩阵能干什么,怎么做到的这个基本的概念。知道矩阵的合成,剩下就可以交给那些数学库去完成了,没要必要什么都自己算。搞图形,最重要的是空间想象(脑补)能力

Shader
  Shader简单到什么程度呢,你如果读到这里,在havefun1的源码中早就窥透了Shader
所谓Shader,就是把顶点变换,和像素输出,两个步骤,抽象成为了两个函数,再配合一些参数。Shader就是程序,还记得我们是在哪里破功的么
问:那什么又是异构子程呢
答:异构与同构,乃是哲学中研究主客体关系的一种概念。(其实很简单,必须要扯上哲学,才能凸显出业务水平)
  我们这个不足200行的引擎中的Shader 是和引擎一样用C#编写的,同构子程序。而GPU中执行的Shader要用专门的语言编写,hlsl cg glsl,和引擎编写的程序不同,异构子程序。区别,仅仅就是这样。经过这一次和李总一起玩代码,你再也不会在图形学业务方面破功(zhuangbi shibai)了。
  祝大家业务(zhuangbi)水平蒸蒸日上,源源不绝。两条毛腿肩上扛,再会。



如社区发表内容存在侵权行为,您可以点击这里查看侵权投诉指引

游戏学院公众号二维码
腾讯游戏学院
微信公众号

提供更专业的游戏知识学习平台