概述

在上一个教程中,我们设置了一个顶点缓冲区并将一个三角形传递给GPU。 现在,我们将逐步完成图形管道并查看每个阶段的工作原理。 将解释着色器和效果系统的概念。

请注意,本教程与前一个源代码共享相同的源代码,但将强调不同的部分。

资源目录

(SDK root)\Samples\C++\Direct3D11\Tutorials\Tutorial03

Github仓库

图形管道

在上一个教程中,我们设置顶点缓冲区,然后将顶点布局与顶点着色器相关联。 现在,我们将解释着色器是什么以及它是如何工作的。 为了完全理解各个着色器,我们将退后一步,查看整个图形管道。

在教程2中,当我们调用VSSetShader()和PSSetShader()时,我们实际上将着色器绑定到管道中的一个阶段。 然后,当我们调用Draw时,我们开始处理传递到图形管道的顶点数据。 以下部分详细描述了Draw命令之后发生的情况。

着色器

在Direct3D 11中,着色器位于图形管道的不同阶段。它们是由GPU执行的短程序,它接收某些输入数据,处理该数据,然后将结果输出到管道的下一阶段。 Direct3D 11支持三种基本类型的着色器:顶点着色器,几何着色器和像素着色器。顶点着色器将顶点作为输入。对于通过顶点缓冲区传递给GPU的每个顶点,它运行一次。几何着色器将基元作为输入,并对传递给GPU的每个基元运行一次。基元是点,线或三角形。像素着色器将像素(或有时称为片段)作为输入,并且对于我们希望渲染的图元的每个像素运行一次。顶点,几何和像素着色器一起是动作的主要部分。使用Direct3D 11渲染时,GPU必须具有有效的顶点着色器和像素着色器。几何着色器是Direct3D 11中的高级功能,是可选的,因此我们不会在本教程中讨论几何着色器。在Direct3D 11中,还有用于细分的外壳和域着色器以及用于计算的计算着色器。有关这些的更多信息,请参阅其他示例。

顶点着色器

顶点着色器是GPU在顶点上执行的短程序。 将顶点着色器视为C函数,将每个顶点作为输入,处理输入,然后输出修改后的顶点。 应用程序以顶点缓冲区的形式将顶点数据传递给GPU后,GPU遍历顶点缓冲区中的顶点,并为每个顶点执行一次活动顶点着色器,将顶点数据作为输入参数传递给顶点着色器。

虽然顶点着色器可用于执行许多任务,但顶点着色器最重要的工作是变换。 转换是将矢量从一个坐标系转换为另一个坐标系的过程。 例如,3D场景中的三角形可以使其顶点位于(0,0,0)(1,0,0)(0,1,0)的位置。 当在2D纹理缓冲区上绘制三角形时,GPU必须知道缓冲区上应该绘制顶点的点的2D坐标。 正是转型帮助我们实现了这一目标。 转换将在下一个教程中详细讨论。 在本教程中,我们将使用一个简单的顶点着色器,除了将输入数据作为输出传递之外什么都不做。

在Direct3D 11教程中,我们将使用高级着色语言(HLSL)编写着色器。 回想一下,我们的顶点数据有一个3D位置元素,顶点着色器根本不对输入进行处理。 生成的顶点着色器如下所示:

 float4 VS( float4 Pos : POSITION ) : SV_POSITION
{
return Pos;
}

  

这个顶点着色器看起来很像C函数。 HLSL使用类似C语法的语言,使C / C ++程序员更容易学习。我们可以看到这个名为VS的顶点着色器采用float4类型的参数并返回一个float4值。在HLSL中,float4是一个4分量向量,其中每个分量都是一个浮点数。冒号定义参数的语义以及返回值。如上所述,HLSL中的语义描述了数据的性质。在上面的着色器中,我们选择POSITION作为Pos输入参数的语义,因为此参数将包含顶点位置。返回值的语义SV_POSITION是具有特殊含义的预定义语义。这种语义告诉图形管道,与语义相关联的数据定义了剪辑空间位置。 GPU需要此位置才能在屏幕上绘制像素。 (我们将在下一个教程中讨论剪辑空间。)在我们的着色器中,我们获取输入位置数据并将完全相同的数据输出回管道。

像素着色器

现代计算机显示器通常是光栅显示器,这意味着屏幕实际上是称为像素的小点的二维网格。 每个像素包含独立于其他像素的颜色。 当我们在屏幕上渲染三角形时,我们并不真正将三角形渲染为一个实体。 相反,我们点亮了三角形区域所覆盖的像素组。 图2显示了这一点。

图2.左:我们想要绘制的内容。 右:屏幕上实际显示的是什么。

将由三个顶点定义的三角形转换为由三角形覆盖的一组像素的过程称为光栅化。 GPU首先确定被渲染的三角形覆盖哪些像素。 然后它为每个像素调用活动像素着色器。 像素着色器的主要用途是计算每个像素应具有的颜色。 着色器对要着色的像素进行某些输入,计算像素的颜色,然后将该颜色输出回管道。 它所采用的输入来自活动几何着色器,或者,如果不存在几何着色器,例如本教程中的情况,则输入直接来自顶点着色器。

我们在上面创建的顶点着色器输出一个带有语义SV_POSITION的float4。 这将是我们的像素着色器的输入。 由于像素着色器输出颜色值,因此像素着色器的输出将为float4。 我们给输出语义SV_TARGET以表示输出到渲染目标格式。 像素着色器如下所示:

float4 PS( float4 Pos : SV_POSITION ) : SV_Target
{
return float4( 1.0f, 1.0f, 0.0f, 1.0f ); // 黄色, 同时透明度为1
}

  

创建着色器

在应用程序代码中,我们需要创建一个顶点着色器和一个像素着色器对象。 这些对象代表着色器,通过调用 D3DX11CompileFromFile()创建。 代码如下所示:

    // 创建顶点着色器
if( FAILED( D3DX11CompileFromFile( "Tutorial03.fx", NULL, NULL, "VS", "vs_4_0", D3DCOMPILE_ENABLE_STRICTNESS, NULL, NULL, &pVSBlob, &pErrorBlob, NULL ) ) )
return FALSE; // 创建像素着色器
if( FAILED( D3DX11CompileFromFile( "Tutorial03.fx", NULL, NULL, "PS", "ps_4_0", D3DCOMPILE_ENABLE_STRICTNESS, NULL, NULL, &pPSBlob, &pErrorBlob, NULL ) ) )
return FALSE;

  

把它放在一起

在遍历图形管道之后,我们可以开始理解渲染我们在教程2开始时创建的三角形的过程。创建Direct3D应用程序需要两个不同的步骤。

  1. 第一个阶段是在顶点数据中创建源数据,正如我们在教程2中所做的那样。
  2. 第二个阶段是创建着色器,这些着色器将转换该数据以进行渲染,我们在本教程中展示了这些。

Direct3D 11 Tutorial 3: Shaders and Effect System_Direct3D 11 教程3:着色器和效果系统的更多相关文章

  1. Direct3D 11 Tutorial 7:Texture Mapping and Constant Buffers_Direct3D 11 教程7:纹理映射和常量缓冲区

    概述 在上一个教程中,我们为项目引入了照明. 现在我们将通过向我们的立方体添加纹理来构建它. 此外,我们将介绍常量缓冲区的概念,并解释如何使用缓冲区通过最小化带宽使用来加速处理. 本教程的目的是修改中 ...

  2. 【Unity Shaders】Lighting Models —— 衣服着色器

    本系列主要参考<Unity Shaders and Effects Cookbook>一书(感谢原书作者),同时会加上一点个人理解或拓展. 这里是本书所有的插图.这里是本书所需的代码和资源 ...

  3. Direct3D 11 Tutorial 5: 3D Transformation_Direct3D 11 教程5:3D转型

    概述 在上一个教程中,我们从模型空间到屏幕渲染了一个立方体. 在本教程中,我们将扩展转换的概念并演示可以通过这些转换实现的简单动画. 本教程的结果将是围绕另一个轨道运行的对象. 展示转换以及如何将它们 ...

  4. Direct3D 11 Tutorial 4: 3D Spaces_Direct3D 11 教程4:3D空间

    概述 在上一个教程中,我们在应用程序窗口的中心成功渲染了一个三角形. 我们没有太注意我们在顶点缓冲区中拾取的顶点位置. 在本教程中,我们将深入研究3D位置和转换的细节. 本教程的结果将是渲染到屏幕的3 ...

  5. Direct3D 11 Tutorial 2: Rendering a Triangle_Direct3D 11 教程2:渲染一个三角形

    概要 在之前的教程中,我们建立了一个最小的Direct3D 11的应用程序,它用来在窗口上输出一个单一颜色.在本次教程中,我们将扩展这个应用程序,在屏幕上渲染出一个单一颜色的三角形.我们将通过设置数据 ...

  6. Java 11 Tutorial

    Java 11 Tutorial 参考 https://blog.csdn.net/sihai12345/article/details/82889827 原文 https://winterbe.co ...

  7. Math.round(11.5)等于()Math.round(-11.5)等于()

    几天前去面试,这道简单的题目居然做错了,看来基础就是慢慢积累的.并不断使用和复习才会成为高手,假设基础不是那么熟练.恐怕在成为高手的路上会困难重重.所以在做项目的间歇时间.偶尔回顾一下最基础的知识.是 ...

  8. CM5(5.11.0)和CDH5(5.11.0)离线安装

    概述 文件下载 系统环境搭建 日志查看 Q&A 参考 概述 CDH (Cloudera's Distribution, including Apache Hadoop),是Hadoop众多分支 ...

  9. hibernate中基于主键映射1-1关联关系和基于外键映射1-1关联关系的不同

    基于主键映射1-1关联关系和基于外键映射1-1关联关系的不同,主要区别是在配置映射文件上会有区别 两个持久化类为Manager和Department 1:基于主键映射1-1关联关系 1)使用其他持久化 ...

随机推荐

  1. BZOJ4963 : String

    用SAM支持往末尾在线添加字符的功能. 设$f[i][j]$表示右端点为i的每个左端点的答案,那么当$i$变为$i+1$时,在SAM的parent链形成的树中会新增一个叶子$p$. 对于每个节点,维护 ...

  2. shell脚本使用--sleep

    #!/bin/bash #filename.sh echo -n Count: tput sc count=; while true; do ]; then let count++; ; tput r ...

  3. X-factor Chains [POJ3421] [素数]

    Description    给定一个正整数X, 一个长度为m的X-因子链是由m+1个整数组成的.其中    1 = X0, X1, X2, …, Xm = X 满足Xi < Xi+1 且 Xi ...

  4. Android 去除应用标题栏(Android Studio)

    修改styles.xml文件 <resources> <!-- Base application theme. --> <style name="AppThem ...

  5. 关于setTimeout和setInterval的函数参数问题

    今天在写验证码倒计时小demo时,用了如下代码: window.setTimeout(count(num),1000); 这样直接使用将使count函数立即执行,并将返回值传递给setTimeout函 ...

  6. python之模块2

    1.logging模块 等级 debug--->info--->warning(默认)--->error--->critical 配置两种方式: #1.congfig函数 lo ...

  7. CSS_盒子模型

    2016-10-22 <css入门经典>第6章 1.每个HTML元素对应于一个显示盒子,但不是所有的元素都显示在屏幕上. 2.HTML元素显示为CSS显示盒子的真正方法称为“可视格式化方式 ...

  8. C#_02.13_基础三_.NET类基础

    C#_02.13_基础三_.NET类基础 一.类概述: 类是一个能存储数据和功能并执行代码的数据结构,包含数据成员和函数成员.(有什么和能够干什么) 运行中的程序是一组相互作用的对象的集合. 二.为类 ...

  9. 使用JfreeChart生成图表遇到的问题

    生成的图片不显示 需要在web.xml中配置一个指定的Servlet <servlet> <servlet-name>DisplayChart</servlet-name ...

  10. delphi ListView 设置固定列宽

    object Form1: TForm1 Left = Top = Caption = 'Form1' ClientHeight = ClientWidth = Color = clBtnFace F ...