DirectX11之简单三角形之美

最新推荐文章于 2022-04-13 00:06:30 发布
最新推荐文章于 2022-04-13 00:06:30 发布
阅读量532 收藏 1
点赞数 1
分类专栏： DirectX11
版权声明：本文为【黑客不黑】原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/weixin_44350205/article/details/103285070
版权

1、创建一个Win32项目（现在叫Windows桌面向导），命名为“D3DTriangle”。

2、创建一个h文件，命名为“d3dUtility.h”。在创建两个cpp文件，分别命名为“d3dTriangle.cpp”和“d3dUtility.cpp”。

3、创建hlsl文件

右键项目新建筛选器，在筛选器里面新建“HLSL”文件，如果没有看见这个选项随便选择一个文件类型创建，只要在后面加上.hlsl后缀。然后把hlsl文件设置为不参与生成。

4、复制第一个案例的d3dUtility.cpp和d3dUtility.h到本项目。

5、编写创建的Triangle.hlsl文件

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

float4 PSMain(float4 Pos:POSITION):SV_TARGET
{
	return float4(0.0f,1.0f,0.0f,1.0f);
}

6、编写d3dTriangle.cpp源文件

#include"d3dUtility.h"

ID3D11Device* device=NULL;
IDXGISwapChain* swapChain=NULL;
ID3D11DeviceContext* immediateContext=NULL;
ID3D11RenderTargetView* renderTargetView=NULL;

ID3D11VertexShader* vertexShader;
ID3D11PixelShader* pixelShader;

struct Vertex
{
	XMFLOAT3 Pos;
};

bool Setup()
{
	DWORD dwShaderFlag=D3DCOMPILE_ENABLE_STRICTNESS;
	ID3DBlob* pVSBlob=NULL;
	if(FAILED(D3DX11CompileFromFile(
		L"Triangle.hlsl",
		NULL,
		NULL,
		"VSMain",
		"vs_5_0",
		dwShaderFlag,
		0,
		NULL,
		&pVSBlob,
		NULL,
		NULL)))
	{
		MessageBox(NULL,L"Fail to compile vertex shader",L"ERROR",MB_OK);
		return S_FALSE;
	}
	
	device->CreateVertexShader(
		pVSBlob->GetBufferPointer(),
		pVSBlob->GetBufferSize(),
		NULL,
		&vertexShader);
	ID3DBlob* pPSBlob=NULL;

	if(FAILED(D3DX11CompileFromFile(
		L"Triangle.hlsl",
		NULL,
		NULL,
		"PSMain",
		"ps_5_0",
		dwShaderFlag,
		0,
		NULL,
		&pPSBlob,
		NULL,
		NULL)))
	{
		MessageBox(NULL,L"Fail to compile pixel shader",L"ERROR",MB_OK);
		return S_FALSE;
	}
	device->CreatePixelShader(
		pPSBlob->GetBufferPointer(),
		pPSBlob->GetBufferSize(),
		NULL,
		&pixelShader);

	D3D11_INPUT_ELEMENT_DESC layout[]=
	{
		{"POSITION",
		0,
		DXGI_FORMAT_R32G32B32_FLOAT,
		0,
		0,
		D3D11_INPUT_PER_VERTEX_DATA,
		0}
	};
	UINT numElements=ARRAYSIZE(layout);

	ID3D11InputLayout* pVertexLayout;
	device->CreateInputLayout(
		layout,
		numElements,
		pVSBlob->GetBufferPointer(),
		pVSBlob->GetBufferSize(),
		&pVertexLayout);
	immediateContext->IASetInputLayout(pVertexLayout);

	Vertex vertices[]=
	{
		//XMFLOAT3(0.0f,0.5f,0.0f),	
		//XMFLOAT3(0.5f,0.0f,0.0f),
		//XMFLOAT3(-0.5f,0.0f,0.0f),
		XMFLOAT3(0.5f,0.0f,0.0f),	
		XMFLOAT3(0.0f,-0.5f,0.0f),
		XMFLOAT3(-0.5f,0.0f,0.0f),
	};

	D3D11_BUFFER_DESC bd;
	ZeroMemory(&bd,sizeof(bd));
	bd.ByteWidth=sizeof(Vertex)*3;//顶点个数

	bd.BindFlags=D3D11_BIND_VERTEX_BUFFER;
	bd.CPUAccessFlags=0;
	bd.MiscFlags=0;

	D3D11_SUBRESOURCE_DATA InitData;
	ZeroMemory(&InitData,sizeof(InitData));
	InitData.pSysMem=vertices;

	ID3D11Buffer* vertexBuffer;
	device->CreateBuffer(&bd,&InitData,&vertexBuffer);
	UINT stride=sizeof(Vertex);
	UINT offset=0;

	immediateContext->IASetVertexBuffers(
		0,
		1,
		&vertexBuffer,
		&stride,
		&offset);
	immediateContext->IASetPrimitiveTopology(
		D3D11_PRIMITIVE_TOPOLOGY_TRIANGLELIST);
	
}

void Cleanup()
{
	if(renderTargetView) renderTargetView->Release();
	if(immediateContext) immediateContext->Release();
	if(swapChain) swapChain->Release();
	if(device) device->Release();
	if(vertexShader)vertexShader->Release();
	if(pixelShader)pixelShader->Release();
}
bool Display(float timeDelta)
{
	if(device)
	{
		float ClearColor[4]={0.0f,0.125f,0.3f,1.0f};
		immediateContext->ClearRenderTargetView(renderTargetView,ClearColor);

		immediateContext->VSSetShader(vertexShader,NULL,0);
		immediateContext->PSSetShader(pixelShader,NULL,0);
		immediateContext->Draw(3,0);//改变绘制的顶点个数

		swapChain->Present(0,0);
	}
	return true;
}

LRESULT CALLBACK d3d::WndProc(HWND hwnd,UINT msg,WPARAM wParam,LPARAM lParam)
{
	switch(msg)
	{
	case WM_DESTROY:
		::PostQuitMessage(0);
		break;
	case WM_KEYDOWN:
		if(wParam==VK_ESCAPE)
		::DestroyWindow(hwnd);
		break;
	}
	return ::DefWindowProc(hwnd,msg,wParam,lParam);
}

int WINAPI WinMain(HINSTANCE hinstance,
	HINSTANCE prevInstance,
	PSTR cmdLine,
	int showCmd)
{
	if(!d3d::InitD3D(hinstance,
		800,600,
		&renderTargetView,
		&immediateContext,
		&swapChain,
		&device))
	{
		::MessageBox(0,L"InitD3D()-FAILED",0,0);
		return 0;
	}
	if(!Setup())
	{
		::MessageBox(0,L"Setup()-FAILED",0,0);
		return 0;
	}
	d3d::EnterMsgLoop(Display);
	Cleanup();
	return 0;
}

7、编译运行程序，结果如下：

如果要更改颜色可以更改如下图代码：

如果要更改三角形为正三角形可以更改如下位置：

注释部分为正三角形

如下图效果：

注意：在绘制三角形的时候，D3D会默认顶点绕序为顺时针的三角形为正面，而顶点绕序为逆时针的三角形为背面。而默认情况下背面是不能显示的。

修改代码还可以实现一个可以移动和缩放的菱形，代码如下

#include"d3dUtility.h"

ID3D11Device* device=NULL;
IDXGISwapChain* swapChain=NULL;
ID3D11DeviceContext* immediateContext=NULL;
ID3D11RenderTargetView* renderTargetView=NULL;

ID3D11VertexShader* vertexShader;
ID3D11PixelShader* pixelShader;

float x = 0;
float y = 0;
float x2 = 0;
float y2 = 0;
float x3 = 0;
float y3 = 0;
float x4 = 0;
float y4 = 0;
float x5 = 0;
float y5 = 0;
float x6 = 0;
float y6 = 0;

struct Vertex
{
	XMFLOAT3 Pos;
};

bool Setup()
{
	DWORD dwShaderFlag=D3DCOMPILE_ENABLE_STRICTNESS;
	ID3DBlob* pVSBlob=NULL;
	if(FAILED(D3DX11CompileFromFile(
		L"Triangle.hlsl",
		NULL,
		NULL,
		"VSMain",
		"vs_5_0",
		dwShaderFlag,
		0,
		NULL,
		&pVSBlob,
		NULL,
		NULL)))
	{
		MessageBox(NULL,L"Fail to compile vertex shader",L"ERROR",MB_OK);
		return S_FALSE;
	}
	
	device->CreateVertexShader(
		pVSBlob->GetBufferPointer(),
		pVSBlob->GetBufferSize(),
		NULL,
		&vertexShader);
	ID3DBlob* pPSBlob=NULL;

	if(FAILED(D3DX11CompileFromFile(
		L"Triangle.hlsl",
		NULL,
		NULL,
		"PSMain",
		"ps_5_0",
		dwShaderFlag,
		0,
		NULL,
		&pPSBlob,
		NULL,
		NULL)))
	{
		MessageBox(NULL,L"Fail to compile pixel shader",L"ERROR",MB_OK);
		return S_FALSE;
	}
	device->CreatePixelShader(
		pPSBlob->GetBufferPointer(),
		pPSBlob->GetBufferSize(),
		NULL,
		&pixelShader);

	D3D11_INPUT_ELEMENT_DESC layout[]=
	{
		{"POSITION",
		0,
		DXGI_FORMAT_R32G32B32_FLOAT,
		0,
		0,
		D3D11_INPUT_PER_VERTEX_DATA,
		0}
	};
	UINT numElements=ARRAYSIZE(layout);

	ID3D11InputLayout* pVertexLayout;
	device->CreateInputLayout(
		layout,
		numElements,
		pVSBlob->GetBufferPointer(),
		pVSBlob->GetBufferSize(),
		&pVertexLayout);
	immediateContext->IASetInputLayout(pVertexLayout);




	Vertex vertices[]=
	{
		XMFLOAT3(0.0f + x,0.5f + y,0.0f),
		XMFLOAT3(0.5f + x2,0.0f + y2,0.0f),
		XMFLOAT3(-0.5f + x3,0.0f + y3,0.0f),

		XMFLOAT3(0.5f + x4,0.0f + y4,0.0f),
		XMFLOAT3(0.0f + x5,-0.5f + y5,0.0f),
		XMFLOAT3(-0.5f + x6,0.0f + y6,0.0f),
	};

	D3D11_BUFFER_DESC bd;
	ZeroMemory(&bd,sizeof(bd));
	bd.ByteWidth=sizeof(Vertex)*6;//顶点个数

	bd.BindFlags=D3D11_BIND_VERTEX_BUFFER;
	bd.CPUAccessFlags=0;
	bd.MiscFlags=0;

	D3D11_SUBRESOURCE_DATA InitData;
	ZeroMemory(&InitData,sizeof(InitData));
	InitData.pSysMem=vertices;

	ID3D11Buffer* vertexBuffer;
	device->CreateBuffer(&bd,&InitData,&vertexBuffer);
	UINT stride=sizeof(Vertex);
	UINT offset=0;

	immediateContext->IASetVertexBuffers(
		0,
		1,
		&vertexBuffer,
		&stride,
		&offset);
	immediateContext->IASetPrimitiveTopology(
		D3D11_PRIMITIVE_TOPOLOGY_TRIANGLELIST);
	
}

void Cleanup()
{
	if(renderTargetView) renderTargetView->Release();
	if(immediateContext) immediateContext->Release();
	if(swapChain) swapChain->Release();
	if(device) device->Release();
	if(vertexShader)vertexShader->Release();
	if(pixelShader)pixelShader->Release();
}
bool Display(float timeDelta)
{
	if(device)
	{
		float ClearColor[4]={0.0f,0.125f,0.3f,1.0f};
		immediateContext->ClearRenderTargetView(renderTargetView,ClearColor);

		immediateContext->VSSetShader(vertexShader,NULL,0);
		immediateContext->PSSetShader(pixelShader,NULL,0);
		immediateContext->Draw(6,0);//改变绘制的顶点个数

		swapChain->Present(0,0);
	}
	return true;
}

LRESULT CALLBACK d3d::WndProc(HWND hwnd,UINT msg,WPARAM wParam,LPARAM lParam)
{
	switch(msg)
	{
	case WM_DESTROY:
		::PostQuitMessage(0);
		break;
	case WM_KEYDOWN:
		if(wParam==VK_ESCAPE)
		::DestroyWindow(hwnd);
		//移动
		if (::GetAsyncKeyState('W') & 0x8000f)
		{
			x += 0.1;
			x2 += 0.1;
			x3 += 0.1;
			x4 += 0.1;
			x5 += 0.1;
			x6 += 0.1;
			Setup();
		}
		if (::GetAsyncKeyState('S') & 0x8000f)
		{
			x -= 0.1;
			x2 -= 0.1;
			x3 -= 0.1;
			x4 -= 0.1;
			x5 -= 0.1;
			x6 -= 0.1;
			Setup();
		}
		if (::GetAsyncKeyState('D') & 0x8000f)
		{
			y += 0.1;
			y2 += 0.1;
			y3 += 0.1;
			y4 += 0.1;
			y5 += 0.1;
			y6 += 0.1;
			Setup();
		}
		if (::GetAsyncKeyState('A') & 0x8000f)
		{
			y -= 0.1;
			y2 -= 0.1;
			y3 -= 0.1;
			y4 -= 0.1;
			y5 -= 0.1;
			y6 -= 0.1;
			Setup();
		}
		//缩放
		//放大
		if (::GetAsyncKeyState('Q') & 0x8000f)
		{
			y += 0.1;
			x2 += 0.1;
			x3 -= 0.1;
			x4 += 0.1;
			y5 -= 0.1;
			x6 -= 0.1;
			Setup();
		}
		//缩小
		if (::GetAsyncKeyState('R') & 0x8000f)
		{
			y -= 0.1;
			x2 -= 0.1;
			x3 += 0.1;
			x4 -= 0.1;
			y5 += 0.1;
			x6 += 0.1;
			Setup();
		}
		//
			break;

	}
	return ::DefWindowProc(hwnd,msg,wParam,lParam);
}

int WINAPI WinMain(HINSTANCE hinstance,
	HINSTANCE prevInstance,
	PSTR cmdLine,
	int showCmd)
{
	if(!d3d::InitD3D(hinstance,
		800,600,
		&renderTargetView,
		&immediateContext,
		&swapChain,
		&device))
	{
		::MessageBox(0,L"InitD3D()-FAILED",0,0);
		return 0;
	}
	if(!Setup())
	{
		::MessageBox(0,L"Setup()-FAILED",0,0);
		return 0;
	}
	d3d::EnterMsgLoop(Display);
	Cleanup();
	return 0;
}

结果为：

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

嘿克不黑
关注
专栏目录
DX11(三)-绘制一个三角形
weixin_44200074的博客
05-29 993
简单了解渲染管道的步骤并绘制一个简单三角形，主要关注输入装配阶段(IA)，顶点着色器(VS)阶段，和像素着色器（PS）阶段
【Visual C++】游戏开发笔记四十 浅墨DirectX教程之八 绘制真实质感的三维世界 光照与材质专场
yttyffggh的博客
02-11 272
【Visual C++】游戏开发笔记四十 浅墨DirectX教程之八 绘制真实质感的三维世界 光照与材质专场
Directx11学习笔记【十】 画一个简单的三角形
04-24 172
本篇笔记要实现的是在屏幕上渲染出一个三角形，重点要学习的是渲染一个几何体的流程方式。 为了渲染几何图形，需要一个顶点缓存和一个描述顶点布局的输入层，还有着色器（主要是顶点着色器和像素着色器），下面来看看具体Demo的实现。 新建一个Win32项目 ，新建一个类我们叫做TriangleDemo，继承自前面教程我们实现的基类Dx11DemoBase。 TriangleDemo.h...
【Visual C++】游戏开发笔记二十九 一步一步教你用优雅的Direct3D11代码画一个三角形...
duoerbasilu
07-23 305
本系列文章由zhmxy555（毛星云）编写，转载请注明出处。 http://blog.csdn.net/zhmxy555/article/details/7774929 作者：毛星云 邮箱： happylifemxy@qq.com 这个demo演示的效果是用Direct3D11在屏幕上渲染一个三角形，当然是通过这个demo进一步巩固和学习Direct3D11，而不是单单为了画一...
Directx11教程(5) 画一个简单的三角形(1)
weixin_34355881的博客
03-11 238
      在本篇教程中，我们将通过D3D11画一个简单的三角形。在D3D11中，GPU的渲染主要通过shader来操作(当然还有一些操作是由GPU固定管线完成，比如光栅化操作)，最常用的shader操作是顶点shader(vertex shader)和像素shader(pixel shader)。其实shader就是在GPU中执行的代码，这些代码被driver编译成硬件依赖的机器码，最终被GPU...
Directx11教程(6) 画一个简单的三角形(2)
weixin_34179762的博客
03-11 143
     在上篇教程中，我们实现了在D3D11中画一个简单的三角形，但是，当我们改变窗口大小时候，三角形形状却随着窗口高宽比例改变而改变，如下图所示：           这是因为我们改变了窗口大小，但后缓冲大小在程序初始化时候，已经被指定，不随着窗口改变而改变，这样在视口映射下，我们所渲染的三角形就改变了形状。 下面我们将对程序进行一些小的改动，从而实现改变窗口大小，而渲染的图形...
Visual C++OpenGL DirectX三维动画
11-15
《Visual C++ OpenGL DirectX三维动画》是一门深入探讨游戏开发和图形编程的课程，主要针对初学者和有志于在3D游戏开发领域提升技能的程序员。本课程以Visual C++为开发环境，结合OpenGL和DirectX这两个强大的图形库...
Directx3D编程框架
03-14
例如，以下代码创建了一个包含6个顶点的顶点数组，可以用来绘制一个简单的三角形： ```cpp CUSTOMVERTEX Vertices[] = { {-5.0, -5.0, 0.0}, {0.0, 5.0, 0.0}, {5.0, -5.0, 0.0}, {10.0, 5.0, 0.0}, // 更多...
光影之路 GPU架构发展史(1/4）
miaozk2006的专栏
12-22 473
在PC时代初始，还没有GPU这一说法，它的前身便是所谓的“显示芯片”，但当3D游戏出现在PC平台时，这一名称变为“图形芯片”，后来NVIDIA制造出功能更强的“图形芯片”，使图形应用对CPU的依赖逐渐降低，由此诞生了“图形处理器”，也就是我们所说的GPU。到2006年以后，GPU们又有了新的名称，即“流处理器”或“高并行处理器”。虽然业内习惯上对其还是沿用GPU的名称，但这已是一个...
css三角形之美
qq_42239440的博客
07-11 349
写法： font-size:0; line-height:0; 这两句只为了照顾兼容性
DX11 实现三角形
03-18
通过对DX11顶点缓存的学习，能够简单的实现基本图元的绘制
用Direct3D11绘制三角形演示demo
07-23
博文的配套源码 《 【Visual C++】游戏开发笔记二十九 一步一步教你用优雅的Direct3D11代码画一个三角形 》 ，配套博文地址为http://blog.csdn.net/zhmxy555/article/details/7774929， 为了更好的理解和提高，建议和配套博文一起学习理解 此为VS2010版。 我的博客地址是http://blog.csdn.net/zhmxy555，源码结合配套文章一起看效果更佳。 当然，必须是0资源分下载~~~~~~~~ 希望能和大家一起交流，共同学习，共同进步。
CSS三角形之美
canoe777的博客
08-05 396
三角之美，面试常问 div { width: 0; height: 0; line-height:0； font-size: 0; border-top: 10px solid red; border-right: 10px solid green; border-bottom: 10px solid blue; border-left: 10px solid #000; } 要点： 我们用css 边框可以模拟三角效果 宽度高度为0 我们4个边框都要
DirectX11学习笔记一 渲染一个三角形
MaxLykoS的博客
10-27 3041
  这两个月我看了看数据可视化，又看了看OpenCV，草稿箱里的东西阅存越多，最后还是决定入坑计算机图形学了。因为本科的时候学过一点OpenGLES和计算机图形学原理，再加上自己对游戏开发感兴趣，所以不打算再继续跟老师的方向走了。本来选现在的老师是打算学学游戏服务器的，奈何失算了，o(︶︿︶)o 唉。   本学习笔记的原始素材来自龙书DirectX11，代码来自GitHub。   不打算照抄别人博...
Direct3D 11第二节 渲染三角形
zty1012620的博客
04-19 595
[TOC]Elements of a TriangleInput LayoutRendering the Triangle
css三角形之美与品优购项目
chenyiboke的博客
11-11 517
CSS三角形之美 div{ width: 0; height: 0; line-height:0; font-size: 0; border-top: 10px solid red; border-right:10px solid green; ...
六、pink老师学习笔记——CSS三角形之美& margin负值之美&文字围绕浮动元素&行内块元素布局的巧妙运用
zep
05-06 443
7. 拓展@ 7.1 margin负值之美 1). 负边距+定位：水平垂直居中 咱们前面讲过， 一个绝对定位的盒子， 利用 父级盒子的 50%， 然后 往左(上) 走 自己宽度的一半 ，可以实现盒子水平垂直居中。 2). 压住盒子相邻边框 7.2 CSS三角形之美 div { width: 0; height: 0; line-height:0； font...
Direct3D 11 总结 —— 4 绘制三角形
dss875914213的博客
04-13 979
介绍 本文主要介绍如何使用 direct3D 11 绘制三角形。 pipeline 介绍 从 msdn 的文章，可以获得 direct3D 的 pipeline 如下图所示，对于本文只需要设置红框内的部分。 输入装配阶段 在这里需要将顶点坐标、顶点数据是使用什么格式保存的(float 还是 int；是几位的等)、想要顶点组成什么图像(比如传入3个点，你可能就是想画3个点或者一条线和1一个点或者一个三角形等) 顶点着色器阶段 着色器就是 gpu 执行的代码，gpu 的特点是计算单元的算力有线，但是每个 gp
Directx11基础教程三之VertexShader,PixelShader,buffer
linuxheik的专栏
10-22 472
一,看本节教程前应该掌握：      (1)D3D11基础教程二之D3D11初始化      (2)了解3D渲染流水线的知识，如世界变换,相机变换,透视投影变换，视口变换，光栅化，线性插值，gouraud着色等，最好具备一定的图形学基础，我推荐一本书<3D游戏编程大师技巧>，这本书完整的讲解了3D渲染流水线的方方面面。 二,本节教程的程序结构： 三,VertexShader(顶点...
入门DirectX11游戏编程
" Beginning DirectX11 Game Programming - 由Allen Sherrod和Wendy Jones撰写，是Course Technology PTR出版的一部分，属于Cengage Learning集团。本书旨在引导初学者进入DirectX11游戏编程的世界，覆盖了DirectX11...
评论 3
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

嘿克不黑

你的鼓励是我的最大的动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付：¥1
获取中
扫码支付

您的余额不足，请更换扫码支付或充值

打赏作者

实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

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

余额充值