光照之颜色

在学习部分之前,我们需要对上一部分代码进行部分修改重塑:
1.使用立方体模型来代替测试光照场景。
将原有代码的loadModel()方法替换成loadCube();

 void loadCube() {vertices = {// positions             // colors          // normals          // texture coords{{-0.5f, -0.5f, -0.5f}, {1.0f, 0.0f, 1.0f},{0.0f,  0.0f, -1.0f},{0.0f,  0.0f}},{{ 0.5f, -0.5f, -0.5f}, {1.0f, 0.0f, 1.0f},{0.0f,  0.0f, -1.0f},{1.0f,  0.0f}},{{ 0.5f,  0.5f, -0.5f}, {1.0f, 0.0f, 1.0f},{0.0f,  0.0f, -1.0f},{1.0f,  1.0f}},{{ 0.5f,  0.5f, -0.5f}, {1.0f, 0.0f, 1.0f},{0.0f,  0.0f, -1.0f},{1.0f,  1.0f}},{{-0.5f,  0.5f, -0.5f}, {1.0f, 0.0f, 1.0f},{0.0f,  0.0f, -1.0f},{0.0f,  1.0f}},{{-0.5f, -0.5f, -0.5f}, {1.0f, 0.0f, 1.0f},{0.0f,  0.0f, -1.0f},{0.0f,  0.0f}},{{-0.5f, -0.5f,  0.5f}, {1.0f, 0.0f, 0.0f},{0.0f,  0.0f,  1.0f},{0.0f,  0.0f}},{{ 0.5f, -0.5f,  0.5f}, {1.0f, 0.0f, 0.0f},{0.0f,  0.0f,  1.0f},{1.0f,  0.0f}},{{ 0.5f,  0.5f,  0.5f}, {1.0f, 0.0f, 0.0f},{0.0f,  0.0f,  1.0f},{1.0f,  1.0f}},{{ 0.5f,  0.5f,  0.5f}, {1.0f, 0.0f, 0.0f},{0.0f,  0.0f,  1.0f},{1.0f,  1.0f}},{{-0.5f,  0.5f,  0.5f}, {1.0f, 0.0f, 0.0f},{0.0f,  0.0f,  1.0f},{0.0f,  1.0f}},{{-0.5f, -0.5f,  0.5f}, {1.0f, 0.0f, 0.0f},{0.0f,  0.0f,  1.0f},{0.0f,  0.0f}},{{-0.5f,  0.5f,  0.5f}, {0.0f, 1.0f, 0.0f},{1.0f,  0.0f,  0.0f},{1.0f,  0.0f}},{{-0.5f,  0.5f, -0.5f}, {0.0f, 1.0f, 0.0f},{1.0f,  0.0f,  0.0f},{1.0f,  1.0f}},{{-0.5f, -0.5f, -0.5f}, {0.0f, 1.0f, 0.0f},{1.0f,  0.0f,  0.0f},{0.0f,  1.0f}},{{-0.5f, -0.5f, -0.5f}, {0.0f, 1.0f, 0.0f},{1.0f,  0.0f,  0.0f},{0.0f,  1.0f}},{{-0.5f, -0.5f,  0.5f}, {0.0f, 1.0f, 0.0f},{1.0f,  0.0f,  0.0f},{0.0f,  0.0f}},{{-0.5f,  0.5f,  0.5f}, {0.0f, 1.0f, 0.0f},{1.0f,  0.0f,  0.0f},{1.0f,  0.0f}},{{ 0.5f,  0.5f,  0.5f}, {0.0f, 0.0f, 1.0f},{1.0f,  0.0f,  0.0f},{1.0f,  0.0f}},{{ 0.5f,  0.5f, -0.5f}, {0.0f, 0.0f, 1.0f},{1.0f,  0.0f,  0.0f},{1.0f,  1.0f}},{{ 0.5f, -0.5f, -0.5f}, {0.0f, 0.0f, 1.0f},{1.0f,  0.0f,  0.0f},{0.0f,  1.0f}},{{ 0.5f, -0.5f, -0.5f}, {0.0f, 0.0f, 1.0f},{1.0f,  0.0f,  0.0f},{0.0f,  1.0f}},{{ 0.5f, -0.5f,  0.5f}, {0.0f, 0.0f, 1.0f},{1.0f,  0.0f,  0.0f},{0.0f,  0.0f}},{{ 0.5f,  0.5f,  0.5f}, {0.0f, 0.0f, 1.0f},{1.0f,  0.0f,  0.0f},{1.0f,  0.0f}},{{-0.5f, -0.5f, -0.5f}, {0.0f, 1.0f, 1.0f},{0.0f, -1.0f,  0.0f},{0.0f,  1.0f}},{{ 0.5f, -0.5f, -0.5f}, {0.0f, 1.0f, 1.0f},{0.0f, -1.0f,  0.0f},{1.0f,  1.0f}},{{ 0.5f, -0.5f,  0.5f}, {0.0f, 1.0f, 1.0f},{0.0f, -1.0f,  0.0f},{1.0f,  0.0f}},{{ 0.5f, -0.5f,  0.5f}, {0.0f, 1.0f, 1.0f},{0.0f, -1.0f,  0.0f},{1.0f,  0.0f}},{{-0.5f, -0.5f,  0.5f}, {0.0f, 1.0f, 1.0f},{0.0f, -1.0f,  0.0f},{0.0f,  0.0f}},{{-0.5f, -0.5f, -0.5f}, {0.0f, 1.0f, 1.0f},{0.0f, -1.0f,  0.0f},{0.0f,  1.0f}},{{-0.5f,  0.5f, -0.5f}, {1.0f, 1.0f, 1.0f},{0.0f,  1.0f,  0.0f},{0.0f,  1.0f}},{{ 0.5f,  0.5f, -0.5f}, {1.0f, 1.0f, 1.0f},{0.0f,  1.0f,  0.0f},{1.0f,  1.0f}},{{ 0.5f,  0.5f,  0.5f}, {1.0f, 1.0f, 1.0f},{0.0f,  1.0f,  0.0f},{1.0f,  0.0f}},{{ 0.5f,  0.5f,  0.5f}, {1.0f, 1.0f, 1.0f},{0.0f,  1.0f,  0.0f},{1.0f,  0.0f}},{{-0.5f,  0.5f,  0.5f}, {1.0f, 1.0f, 1.0f},{0.0f,  1.0f,  0.0f},{0.0f,  0.0f}},{{-0.5f,  0.5f, -0.5f}, {1.0f, 1.0f, 1.0f},{0.0f,  1.0f,  0.0f},{0.0f,  1.0f}}};indices = {2, 1, 0, 5, 4, 3,6, 7, 8, 9, 10,11,12,13,14,15,16,17 ,20,19,18,23,22,21,24,25,26,27,28,29 ,32,31,30,35,34,33};}

2.新增了Vertex结构体中新增了glm::vec3 normal(后续光照中需要使用到)。结构体修改如下:

struct Vertex {glm::vec3 pos;glm::vec3 color;glm::vec3 normal;glm::vec2 texCoord;//绑定描述static VkVertexInputBindingDescription getBindingDescription() {VkVertexInputBindingDescription bindingDescription = {};bindingDescription.binding = 0;bindingDescription.stride = sizeof(Vertex);bindingDescription.inputRate = VK_VERTEX_INPUT_RATE_VERTEX;return bindingDescription;}//属性描述static std::array<VkVertexInputAttributeDescription, 4> getAttributeDescriptions() {std::array<VkVertexInputAttributeDescription, 4> attributeDescriptions = {};attributeDescriptions[0].binding = 0;attributeDescriptions[0].location = 0;attributeDescriptions[0].format = VK_FORMAT_R32G32B32_SFLOAT;attributeDescriptions[0].offset = offsetof(Vertex, pos);attributeDescriptions[1].binding = 0;attributeDescriptions[1].location = 1;attributeDescriptions[1].format = VK_FORMAT_R32G32B32_SFLOAT;attributeDescriptions[1].offset = offsetof(Vertex, color);attributeDescriptions[2].binding = 0;attributeDescriptions[2].location = 2;attributeDescriptions[2].format = VK_FORMAT_R32G32B32_SFLOAT;attributeDescriptions[2].offset = offsetof(Vertex, normal);attributeDescriptions[3].binding = 0;attributeDescriptions[3].location = 3;attributeDescriptions[3].format = VK_FORMAT_R32G32_SFLOAT;attributeDescriptions[3].offset = offsetof(Vertex, texCoord);return attributeDescriptions;}bool operator==(const Vertex& other) const {return pos == other.pos && color == other.color && texCoord == other.texCoord;}
};

3.在UniformBufferObject结构体中新增了基础光照glm::vec3 baseLight和和环境光照强度float ambientStrength。结构体修改如下:

struct UniformBufferObject {glm::mat4 model;glm::mat4 view;glm::mat4 proj;glm::vec3 baseLight;float ambientStrength;
};

本学习没有独立新建另外UniformBuffer供片元着色器使用,后续会将所有光照需要用到的光照信息皆加入此结构体中,通过顶点着色器传递给片元着色器。

大致修改完毕,接下来我们来主要来实现vulkan中物体颜色。(shader中颜色部分基础知识可参照LearnOpenGL中颜色章节)

一、更新UniformBuffer

在此之前需要定义一个全局基础光照

//纯白光
glm::vec3 baseLight = glm::vec3(1.0f, 1.0f, 1.0f);

之后,在updateUniformBuffer函数中我们需要将UniformBufferObject结构体中的基础光照和光照系数实时传递给UniformBuffer。

void updateUniformBuffer() {...UniformBufferObject ubo = {};ubo.ambientStrength = 1 ;ubo.baseLight =  baseLight;...

二、更新着色器

更顶点着色器shader.vert:

#version 450
#extension GL_ARB_separate_shader_objects : enablelayout(binding = 0) uniform UniformBufferObject {mat4 model;mat4 view;mat4 proj;vec3 baseLight;float ambientStrength;
} ubo;layout(location = 0) in vec3 inPosition;
layout(location = 1) in vec3 inColor;
layout(location = 2) in vec3 inNormal;
layout(location = 3) in vec2 inTexCoord;layout(location = 0) out vec3 fragColor;
layout(location = 1) out vec3 fragNormal;
layout(location = 2) out vec2 fragTexCoord;
layout(location = 3) out vec3 fragBaseLight;
layout(location = 4) out float ambientStrength;void main() {gl_Position = ubo.proj * ubo.view * ubo.model * vec4(inPosition, 1.0);fragColor = inColor;fragNormal = inNormal;fragTexCoord = inTexCoord;fragBaseLight = ubo.baseLight;ambientStrength= ubo.ambientStrength;
}

在shader.vert中将UniformBufferObject结构体同步,并新定义:

  • layout(location = 2) in vec3 inNormal; 接收Vertex中的normal法线信息
  • layout(location = 1) out vec3 fragNormal;将法线传出到片元着色器中
  • layout(location = 3) out vec3 fragBaseLight;将基础光照传出到片元着色器中
  • layout(location = 4) out float ambientStrength;将光照强度传出到片元着色器中

更新片元着色器shader.frag:

#version 450
#extension GL_ARB_separate_shader_objects : enablelayout(binding = 1) uniform sampler2D texSampler;layout(location = 0) in vec3 fragColor;
layout(location = 1) in vec3 fragNormal;
layout(location = 2) in vec2 fragTexCoord;
layout(location = 3) in vec3 fragBaseLight;
layout(location = 4) in float ambientStrength;layout(location = 0) out vec4 outColor;void main() {vec3 lightColor=ambientStrength * fragBaseLight;outColor = vec4(fragColor * lightColor, 1.0);//outColor = vec4(fragTexCoord, 0.0, 1.0);//outColor = vec4(fragColor * texture(texSampler, fragTexCoord).rgb, 1.0);//outColor = texture(texSampler, fragTexCoord)* vec4(lightColor, 1.0);
}

重新编译shader,之后还需修改一下camera的初始位置:

Camera camera(glm::vec3(0.0f, 2.0f, 2.0f), glm::radians(-45.0f), glm::radians(180.0f), glm::vec3(0.0f, 1.0f, 0.0f));

运行代码,可以见到如图所示颜色的立方体

除此之外,您还可以通过更新ubo.ambientStrength或者ubo.baseLight来查看不同的效果 。
如,修改:

glm::vec3 baseLight = glm::vec3(0.0f, 0.0f, 0.0f);

则会看到,物体所有表面都会呈现黑色

除此之外我们还可以将
ambientStrength设置为动态的0-1之间的数值,

ubo.ambientStrength = (sin(time) + 1) / 2 ;

这样的话,您将会看见一个随时间变化而出现交替颜色变换的立方体。

下一步我们将着重来实现基础光照,即冯氏光照模型(Phong Lighting Model)。

Vulkan_Shader_Day01—光照(物体颜色)相关推荐

  1. python红色的颜色表达式_50行Python代码实现视频中物体颜色识别和跟踪(必须以红色为例)...

    目前计算机视觉(CV)与自然语言处理(NLP)及语音识别并列为人工智能三大热点方向,而计算机视觉中的对象检测(objectdetection)应用非常广泛,比如自动驾驶.视频监控.工业质检.医疗诊断等 ...

  2. uinty中对于物体颜色循环往复

    uinty中对于物体颜色循环往复 private void OnMouseDown() { //索引的转换index = (index +1) % colorTable.Length;//colorT ...

  3. 基于物体颜色的目标检测与跟踪

    目录 一.项目内容 二.项目分析 三.主要使用模块 四.选用HSV颜色空间 五.代码实现与分析 1. 颜色选择器: 2. 实现检测并跟踪绘制移动轨迹: 六.测试结果 一.项目内容 (1)利用摄像头,根 ...

  4. MATLAB实现物体颜色识别

    颜色是物体表面的固有特征,在目标识别和图像分割中有着无法替代的作用. 机器视觉利用光电成像系统和图像处理模块对物体进行尺寸.形状.颜色等的识别.这样就把计算机的快速性.可重复性与人眼视觉的高度智能化和 ...

  5. 惊!Python能够检测动态的物体颜色!

    作者 | 李秋键 责编 | 刘静 出品 | CSDN(ID:CSDNnews) 本篇文章将通过图片对比的方法检查视频中的动态物体,并将其中会动的物体定位用cv2矩形框圈出来.本次项目可用于树莓派或者单 ...

  6. Unity实现UGUI空物体颜色渐变的描边方法

    文章目录 一.关于UGUI的描边 二.重写OnPopulateMesh实现UI空物体描边 原理解析 完整代码实现 完整描边效果 三.拓展功能(渐变色的UI描边) 两种渐变色描边 多种渐变色描边 四.推 ...

  7. 虚幻随笔(UI改变物体颜色)

    内容浏览器里创建材质参数集,里面点击向量参数. 物体材质里面,把对应的替换为材质参数集(材质参数集是四维,使用mask节点能遮罩不需要的).左边参数名要对应好自己创建的. UI界面点击事件,线性颜色设 ...

  8. 50行Python代码实现视频中物体颜色识别和跟踪(必须以红色为例)

    目前计算机视觉(CV)与自然语言处理(NLP)及语音识别并列为人工智能三大热点方向,而计算机视觉中的对象检测(objectdetection)应用非常广泛,比如自动驾驶.视频监控.工业质检.医疗诊断等 ...

  9. Unity改变物体颜色(添加材质Materials)

    例子:让Cube方块变成红色 第一步:创建一个Cube 第二步:新建一个材质Materials 第三步:将材质修改为红色 第四步:将材质拖动到Cube上 这样就可以啦(●'◡'●)

最新文章

  1. 链接详解--多目标文件的链接
  2. 再谈MySQL JSON数据类型
  3. Flutter之点击按钮打开百度链接
  4. 线性回归中oracle性质,66.Oracle数据库SQL开发之 高级查询——使用线性回归函数...
  5. struts与spring整合方法copy
  6. 瑞芯微和全志哪个好_瑞芯微和全志科技基本面信息简要对比和整理
  7. Bailian2709 求出e的值【数列求和】(POJ NOI0105-35)
  8. Java 开发常用资源
  9. linux压缩文件夹
  10. 随机变量的数字特征(期望、方差、标准差、矩、协方差...)
  11. Flutter的Chip标签组件
  12. 【笔记】mac上如何用命令行编译jni
  13. Cfs三层靶机内网渗透模拟
  14. 使用Matlab产生m序列(PN序列的一种)
  15. 读王小波先生的《黄金时代》、《青铜时代》
  16. photoshop 安装和使用 蓝湖上传设计图
  17. 手机和电视不在一个网络如何投屏?跨网段投屏方法
  18. 【嵌入式Linux开发一路清障-连载03】Ubuntu22.04使用Mount加载硬盘或NAS等硬盘
  19. 3dsMax---用挤出做柜子
  20. 【Vue】详解Vue生命周期

热门文章

  1. win2003服务器某一个网站被劫持,windows server 2012 iis被劫持的处理过程
  2. 75佳精美的 CSS 网页设计作品欣赏(系列一)
  3. STM32的BootLoader 从SD卡更新固件
  4. 江在川上曰:vue中使用swiper
  5. Python生态工具
  6. Win2008 r2 远程桌面授权已过期的解决办法
  7. 图文详情展示html,图文展示新闻网站模板
  8. [并发并行]_[线程池]_[Programming With POSIX Threads的线程池实现分析1]
  9. Failed to load local image resource /pages/pics/cloud://xxxxxxxxx.jpg
  10. 斯嘉丽约翰逊60张pdf什么时间的?_什么叫美丽与演技并存?