EasyX实现镜面反射倒影效果

最近通关了《闪避刺客》,非常不错的游戏,爽快的战斗、宏大但细节拉满的演出与同品类游戏中让人印象深刻。无论是室外还是室内,游戏场景中多次使用了类似下图所示的静面反射效果,用来烘托氛围和叙事;在《刀剑神域》中,也有类似的倒影地面,本文分享使用EasyX实现镜面反射效果的思路。

闪避刺客(左)/ 刀剑神域(右)

在图形学中,一提到“镜子”,最直接的思路一定是帧缓冲,比较通用且简单的思路就是使用额外的摄像机渲染场景到纹理中,然后再将其贴到场景中的物体上。在EasyX中,我们可以使用IMAGE对象实现帧缓冲纹理,并借助SetWorkingImage函数切换当前的渲染目标,整体流程如下图所示:

镜面反射场景渲染流程

阅读更多

EasyX游戏帧动画效果处理

通过对一组动画帧IMAGE对象色彩缓冲区的操作,实现了动画帧翻转、无敌帧闪烁、冻结三种常见的游戏效果,本文介绍这三种效果的相关概念和实现思路。程序中所使用的帧动画素材为提瓦特幸存者进阶版中分享的素材,需要测试的小伙伴可以在文末找到相关素材的下载链接。

原始动画和三种效果

阅读更多

新手教程 - 如何发布你的EasyX游戏

有小伙伴在交流群里问起如何发布自己的游戏,才意识到还有这个问题。之前的视频教程只是讲解了如何在VisualStudio中编写EasyX相关的代码,并没有提到如何将完成的项目发布的方法,这种问题在很多教程中都是默认学习者已经掌握了,但实际情况是如何打包发布涉及到开发工具使用和编译选项等诸多概念,想来自己初学时也踩过很多坑,便整理一下相关的内容,供新手小伙伴们参考。

群聊记录

本文以提瓦特幸存者进阶版的项目为例,以点带面地讲解新手在发布自己的程序时可能遇到的问题和对应的解决方案,本项目开发环境为VisualStudio2022,图形库为EasyX,使用其他开发环境或图形库的C++项目操作相似。

阅读更多

EasyX渲染黑客风格泛光文本

朋友的社团邀请我去做技术培训,带着小伙伴们一起做一款小游戏,正好手头有一个黑客题材游戏的灵感,便整理了一下策划案,准备以教学为目的带着大家做一部完整的游戏作品;一开始是打算用引擎的,但是引擎使用中的诸多概念对仅有浅薄编程语法基础的同学们来说还是有点为时过早了,想来近期在做的EasyX系列教程,便试着用EasyX实现一点高级的画面效果。本文代码作为软渲染的实践,仅用作算法思路分享,实际工程中还需要考虑渲染效率的优化等问题。

本文算法和实现思路参考了以下内容:

泛光概述

为什么要做泛光?泛光在一般用来强化画面中的亮部,因为显示器的亮度范围是有限的,例如游戏画面中有一张阳光下的白纸,白纸显示为纯白色,而太阳为了表达光亮最多也是为纯白色,二者同时出现时便会有亮度一样的感觉,而当我们给太阳加一个光晕,这样二者的亮度就有所区分了。

色彩亮度相同时泛光可以显著提升光源感官亮度

泛光可以看做是在摄像机视角下,光源的颜色向着画面中其他物体的颜色逐渐侵染的过程。泛光的通用实现思路主要分为以下几步:亮部提取 -> 模糊处理 -> 混叠渲染

阅读更多

视频被培训机构选做直播课了,但是我却很担忧…

距离《从零开始的C++游戏开发》系列视频更新的第0期,到现在已经有将近一个半月的时间了,这是我第一次在B站这种公众空间尝试进行知识分享,有点陌生,有点紧张,但是很开心。在这不长不短的时间里面,有2000+的小伙伴因为这个系列教程关注了我,私信和评论区也得到了很多小伙伴的鼓励。虽然视频是近期才开始制作的,但是制作这套教程的想法,却早在很多年前便萌生了出来。

如果说这一切的动机是什么,可能是作为技术从业者那种最本源的热爱和分享欲,以及,对于知识传承的责任感……

有的时候,人生的经历就像小说一样充满着铺垫和预言。高中的时候,我很喜欢在学校周围的书店里面购买诸如《电脑报》之流的刊物,已经不记得从哪篇文章的边角处,瞥见了雷霄骅前辈的新闻,那时的自己对他的所作所为或是经历都一无所知,只是对这个名字大致有了印象。在大学的时候,在钻研音视频技术开发的时候,到处搜集资料时却发现,国内音视频技术圈子的知识分享,源头似乎都指向了他的博客,而当我追根溯源翻找博客评论区时,却发现,雷前辈已经逝去多年了,而视频资料,也只能找到年代久远画质模糊的录屏。回想起来,高中时报刊上的新闻,应该是他英年早逝的消息,这是我第一次,对一个远在天边曾经存在于这个世界上的陌生人,产生了天妒英才的惋惜情绪。

知乎@鹏小鹕

阅读更多

基于EasyX软渲染实现常见故障艺术

本文极大地参考了毛星云大师的《高品质后处理:十种故障艺术(Glitch Art)算法的总结与实现》一文,以及由他开发的 Unity 高品质后处理库 X-PostProcessing-Library源码,能力有限,但也希望本文能够给感兴趣的小伙伴们抛砖引玉,为国产 3A 游戏续星星之火。

怎么绘事呢?

故事的起因是群友的一句话让我想起了当年做 3D“软渲染”的冲动,想来 CodeBus 上已经有大佬给出了相对不错的实现,便重新拉取代码本地编译查看,却没料到性能比预想的还要差一些,就算是在此基础上费尽心思实现了导入 3D 模型导入进行渲染,在没有 PBR 等高性能需求的技术实现可能的情况下,“炫酷”这方面可能就多少差点意思——不过,既然 3D 软渲染提升的空间有限,那么实现 2D 软渲染应该还可以有相当大的操作可能。

EasyX 群聊天记录

想来近期工作研究的故障艺术效果(Glitch Art),便重新翻出了收藏夹中毛星云大师的文章,试着将应用于 GPU 的 shader 实现移植到 CPU 端。
本文着重探究在 CPU 端逐像素的图像处理逻辑,即模拟 shader 程序在片段着色器阶段的工作,这就导致其工作流并不一定是 CPU 这种相对线性的工作者所喜欢的,也就是说在实际运行的过程中,效率可能远不及 GPU 的并行处理。尽管如此,考虑到本文重点在于算法和编程思想的分享,而非高性能场景的实际应用,况且对于 60 帧的游戏 demo 而言,本文提及的大部分算法实现都还算可以勉强胜任。

阅读更多

Soloud 踩坑日志

由于新作对引擎内核的音频模块提出了更高的要求,所以一直陪伴在身边的 SDL_mixer 便差不多该结束他的职业生涯了,是时候进行新的音频内核探索了,本文主要围绕着在探索过程中遇到的让人又爱又恨的 Soloud 音频库展开记录——

为什么是 Soloud ?

因为在研的下一代引擎 StarDustEngine 暂定目标仍为开源项目,截止到目前为止所依赖的所有三方库均为开源,在协议方面对于再分发和商业使用都没有太大限制,所以,对于常见音频库的选择思路:

  • OpenAL:其实玩 OpenGL 已经耗费了几乎所有精力,所有 OpenXX 的这种相对底层的库,现在的我大概保持一种敬而远之的态度;
  • FMODE:我承认他很强大,但是他太过于强大了,这种次时代的商业音频库对于我们现在能力范围内所实现的轻量级小体量引擎来说,就像是小正太在被大车开;更何况,FMODE 不仅不开源,在商业授权上也是一套又一套,一眼望过去便繁琐至极;
  • SDL_mixer:诚然,作为 SDL 全家桶中的重要一环,使用起来算是极其方便的,但是,简明的 API 所带来的反面效果便是开发者很难从相对底层的层面上去控制音频播控,从而无法实现效果器和响度调控等功能,这正是下一代引擎所必须的功能;
  • IrrKlang:算作是相对小众的老牌音频库,虽然自己没有深度使用过,但是在学习过程中看到过很多资料作者都在用其进行项目教学;仔细了解下后才发现,IrrKlang 同样没有开源,且对商业授权付费,所以依然 Pass;
  • Soloud:开源,免费,并且专为游戏打造,虽然比较小众,但是当我看到下文时,我就决定是他了:

    If you’re planning to make a multi-million budgeted console game, this library is (probably) not for you. Feel free to try it though :-)
    如果您计划制作一款预算数百万美元的主机游戏,那么这个库(可能)不适合您。不过请随意尝试一下:-)

Soloud Logo

阅读更多

面向猛新的小游戏制作 - EasyX 超级马里奥

近些日子有同学与我聊起来学校的小学期任务是用 EasyX 做一款超级马里奥,不由得来了兴趣,毕竟在一个月左右的时间内,以大多数同学的编程水平,在只提供了图形接口功能的 EasyX 图形库基础上去实现一个包含渲染、音频、数据存档和物理模拟的一个卷轴关卡游戏,本身的难度还是有的,更何况即便是单个功能可以花费点时间探究予以实现,但当整个程序作为一个具有游戏逻辑的系统时,就考验语法之上的架构能力了,如何使用面向对象进行类的划分,系统之间如何通信进行数据的传递,如何将输入与渲染的结果动态地呈现在窗口中……如果要相对完美地实现这些功能,对编程经验还是有一定的考验的。

念及在初学编程时对 EasyX 的旧情,便想挑战一下,看看现在的自己多少时间可以完成一个功能相对完整的超级马里奥。结果便是差不多花费了总计三天左右,在工作之余的摸鱼时间中、牺牲了部分休息时间,完成了一份有效代码约 1.5K 行,稍具可玩性的游戏程序,想到可能自己在编程过程中的思路可能对使用 EasyX 的初学者具有启发意义,便写下这篇文章,希望借此抛砖引玉。

在开始正文之前,请注意以下提醒:

  • 本文的读者是“猛新”而不是“萌新”,所以如果你对 C++ 的基础语法几乎一无所知,那么建议你先学习基础后再来阅读本文,否则配上本人特有的花里胡哨代码风格可能让你产生不必要的畏难情绪;
  • 正如上文所述,由于本项目只是一次心猿意马的随写,尽管考虑到了减少不必要的技术依赖(如习惯的 XML/JSON 存档),但是在代码风格上,还是可能会用到些许的 C++ 新特性或 STL 模板,这不是坏事,但是可能需要希望理解此些部分的同学多搜索一下相关内容补课;
  • 面向对象的设计和资源生命周期的管理等方面,站在完成者的角度来讲并不完美,但是考虑到深究会让代码体系变得更加复杂晦涩,且本身作为随写内容没有重构的必要,但是对于大部分初学的同学还是相对有参考价值的,如果你能注意到这些问题,并提出更优雅和安全的设计,那么恭喜你,你的编码水平已经脱离仅是让编译器不报错的阶段,开始向着代码架构的方向前进了;
  • 本文只是以点带面地讲述思路和技术关键点,并不是一篇手把手教你如何用 C++ 实现一个超级马里奥的教程,但是项目完整的代码工程和可以发布单文件版本下载链接我会放到文章最后,感兴趣的同学可以下载体验,请确保自己的电脑上装有 VisualStudio 2019/2022,并且安装了 EasyX 图形扩展
阅读更多

DirectX 11 Tutorials 5 - 纹理贴图

原文链接:http://www.rastertek.com/dx11s2tut05.html

本教程将介绍如何在 DirectX 11 中使用纹理,纹理使我们能够通过将照片和其他图像应用到多边形面上,为场景添加真实感。

例如,在本教程中,我们将使用如下图像:

纹理贴图

然后将其应用于上一教程中的多边形,以生成如下内容:

纹理效果

我们将使用的纹理格式是 .tga 文件,这是支持红色、绿色、蓝色和 alpha 通道的常见图形格式。你可以使用任何通用图像编辑软件创建和编辑 targa 文件,这种文件格式一般是可以直接使用的。

在我们进入代码之前,我们应该讨论纹理贴图是如何工作的。

阅读更多

DirectX 11 Tutorials 4 - 缓冲区、着色器和 HLSL

原文链接:http://www.rastertek.com/dx11s2tut04.html

本教程将介绍如何在 DirectX 11 中编写顶点和像素着色器,还将介绍如何在 DirectX 11 中使用顶点和索引缓冲区,这些是渲染 3D 图形时需要理解和利用的最基本概念。

顶点缓冲区

首先要理解的概念是顶点缓冲区,为了说明这个概念,让我们以球体的 3D 模型为例:

3D球体模型图1

3D 球体模型实际上由成百上千个三角形组成:

3D球体模型图2

球体模型中的每个三角形都有三个点,我们称每个点为顶点,因此,为了渲染球体模型,我们需要将构成球体的所有顶点放入一个特殊的数据数组中,我们称之为顶点缓冲区;一旦球体模型的所有点都被放置到了顶点缓冲区中,我们就可以将顶点缓冲区发送到 GPU,来将模型渲染出来。

阅读更多