随笔分类 - 图形学
摘要：效果展示： ShaderLab Shader功能：图像变白+根据顶点的y值作透明裁剪； 才是可操作属性： IsDead: 控制像素变白，片元着色阶段IsDead小于0将颜色改为白色； Percent: 透明剔除分界线，也是图片展示百分比；在顶点计算阶段，记录Percent - vertex.y值，传
阅读全文
摘要：一、ShaderLab 1.Alpha值边缘检测 根据图片的Alpha值边缘判定，向内扩一段距离做边缘，颜色设置未描边颜色； 片元着色阶段，向上下左右四个方向做检测，有一个点的透明度为0，判定为边缘； Shader "2DOutline" { Properties { _MainTex("Textu
阅读全文
摘要：实现Vignette过场动画效果 postprocessing中有渐晕效果（Vignette），镜头可以由边缘往中间慢慢变黑； 但是我打包WebGL的时候提示我postprocessing，GPU不支持... so,用shaderlab实现了简单的效果，如果需要边缘模糊，就根据距离做透明度插值； 效
阅读全文
摘要：一、导入Texture 1.Inpspector TextureSize 2的n次幂，底层图形学需要，计算更快；不使用2的倍数，系统也会添加像素补全2n； 有最大尺寸限制8k，cubemap最高4k； Mipmap 图像逐渐减小版本的列表；纹理远离摄像机时，Unity 会自动使用较小版本的纹理；LO
阅读全文
摘要：使用噪声图实现火烧和水波纹效果； 1.溶解 关闭裁剪，根据noise纹理取样，r通道和_BurnAmount比较，裁剪掉小于_BurnAmount的片元； 通过菲尼尔得到裁剪边缘，添加火焰燃烧的颜色进行混合； 阴影pass需要单独写，同样做裁剪； Pass { Tags {"LightMode" =
阅读全文
摘要：顶点动画shader要关闭动态合批"DisableBatching"="True"； 1.序列帧动画 纹理取样有Scale和offset，将上面的png图当做纹理，每次按间隔时间偏移取样纹理的起点； fixed4 frag (v2f i) : SV_Target { //Time四个分量 y代表1t
阅读全文
摘要：在这一篇中会实现会介绍折射和反射，以及菲尼尔反射；并且实现镜子和玻璃效果； 这里和之前不同的地方在于取样的是一张CubeMap； demo里的cubemap使用的一样，相机所在位置拍出来的周围环境图； 生成CubeMap的工具脚本： public class RenderCubemapWizard
阅读全文
摘要：这篇主要总结Unity中ShaderLab的着色器代码实现总结，需要有一定图形学基础和ShaderLab基础； 一、着色器 1.顶点片元着色器 分顶点着色器和片元着色器，对应渲染管线的顶点变换和片元着色阶段； 最简单的顶点片元着色器： Shader "MyShader/VertexFragmentS
阅读全文
摘要：效果展示： 原模型： 简单分析 卡通渲染又叫非真实渲染（None-Physical Rendering-NPR）,一般日漫里的卡通风格有几个特点： 人物有描边 有明显的阴影分界线，没有太平滑的过渡 以下就根据这两点来实现卡渲效果； 描边 法线外扩 实现描边方式多种，比如卷积区分边界； 这里使用更简单
阅读全文
摘要：这篇只是一个总结，方便我写shader的时候查找API; 1.格式 Shader "Custom/MyShader" //命名+右键创建shader路径 { //属性必须在代码里声明才能使用 Properties{ //属性，会出现在inspector面板 [Toggle]_IsOpen("IsOp
阅读全文
摘要：效果 思路 5个面用5个RenderTexture来接受5个摄像机分别获取的小场景图像； RenderTexture就当成屏幕来理解，MainCamera是把画面显示在屏幕上，屏幕就是最大的RenderTexture且允许里面有子渲染； 把子摄像机拍摄到的画面当成纹理贴图理解，RenderTextu
阅读全文
摘要：Unity中的渲染管线流程 下图是《Unity Shader 入门精要》一书中的渲染流程图； ApplicationStage阶段：准备场景信息（视景体，摄像机参数）、粗粒度剔除、定义每个模型的渲染命令（材质，shader）——由开发者定义，不做讨论； GemetryStage阶段：顶点着色器、曲面
阅读全文
摘要：图形学3D渲染管线 DX和OpenGL左右手坐标系不同，会有一些差距，得出的矩阵会不一样; OpenGL的投影平面不是视景体的近截面； 顶点(vertexs) 顶点坐标，颜色，法线，纹理坐标（UV），连线索引; 图元(primitives) 几何顶点被组合为图元(点，线段或多边形)，图元装配； 片元
阅读全文
