Godot4.x 几何与绘图
文章平均质量分 82
巽星石
业余编程爱好者,Godot游戏引擎爱好者
展开
-
【Godot4.2】太极八卦图绘制
作为中国传统文化符号之一,太极八卦图,无论是哲学还是玄学,都不可能避开。之前在函数库实现了太极的点求取函数。当时采用的时圆弧拼接的方式,但是存在某些尺寸下多边形无法三角化的问题。于是就有了今天的内容。就是采取一种完全不同的思路来绘制太极。并在此基础上补足八卦的绘制。本节介绍了对复杂图形——太极八卦图的求图形顶点和绘制思路可以看到,灵活的利用绘图顺序,进行“盖印”操作,是一种聪明的图形绘制方式另外,也可以看到,有些复杂图形的求解需要使用多重线性变换。原创 2024-04-21 13:53:32 · 299 阅读 · 0 评论 -
【Godot4.2】圆环绘制思路以及函数
在Godot中没有办法直接绘制圆环,利用Geometry2D的布尔运算也无法实现。所以只能另想办法。这个问题其实想了有一段时间了,昨天因为QQ群群友的提问,于是就直接试验了一下,结果就有了本文。对于在Godot中绘制圆环,我自己想到两种办法。这种思路的好处是,通过求一个小梯形,然后旋转变换,就可以绘制出圆环的形状。而且这种方式可以很方便的用颜色插值做出渐变色环效果。这种方法获得的圆环一体性强,可以直接作为单个多边形绘制,顶点数目也相较第一种方式少但缺点是可能没法获得方法1样的效果。原创 2024-04-20 15:27:01 · 431 阅读 · 0 评论 -
【Godot4.2】极坐标点函数与绘图应用
在一个平面上基于一个定点,可以创建一个平面直角坐标系,同时也可以创建一个极坐标系。通过极坐标系,可以将平面上的点用极坐标形式描述出来。本文就记录一下如何在Godot中创建和表示极坐标点,并将其运用于绘图。本文描述了如何创建一个与Godot的屏幕坐标系保持一致的假想的极坐标系,并通过pVector2()函数来表示极坐标点pVector2()返回的实际是等价的直角坐标系中的Vector2,因此我们可以直接将它用于图形顶点的表示和绘制pVector2()本质上还是Vector2,所以可以使用Vector2。原创 2024-04-14 17:32:48 · 632 阅读 · 0 评论 -
【Godot4.2】绘制分形图案 - 科赫雪花
如果用向量加减和旋转方式,估计艰难绘制分形图案,好在有了myPoint类后,简单的分形图案绘制不再是什么难事。本篇我们就研究使用myPoint类在Godot的CanvasItem中绘制科赫雪花。科赫雪花是一种简单的分形图形,它的规律就是不断的将边线划分为三段,并在中间这一段向上拉出来一个正三角形。绘制思路当然是使用函数和递归,绘制出一条科赫曲线,然后通过旋转90度方式绘制其他三个边,构成一个闭合的科赫雪花。原创 2024-04-14 14:55:22 · 431 阅读 · 0 评论 -
【Godot4.0】几何图形、网格、刻度线顶点求取函数库ShapePoints
用于生成常见二维几何图形顶点数据)的静态函数库。生成的数据可用于_draw和Line2DPolygon2D等进行绘制和显示。原创 2024-03-18 01:23:11 · 457 阅读 · 3 评论 -
【Godot 4.2】常见几何图形、网格、刻度线点求取函数及原理总结
本篇为静态函数库的补充和辅助文档。函数库是一个用于生成常见几何图形顶点数据()的静态函数库。生成的数据可用于_draw和Line2DPolygon2D等进行绘制和显示。因为不断地持续扩展,函数库的函数数目在不断增加,同时涉及的图形类型也在发生变化。本篇按照一定的分类,阐述每个图形函数的原理和具体实现,以及具体使用。注意:本篇基础内容写于2023年7月,由3篇文章汇总而成。函数库及其使用会单独发文贴出。本篇更接近原理讲解。原创 2024-03-17 21:57:17 · 1039 阅读 · 0 评论 -
【Godot4.2】任意多边形或折线围绕任意点旋转
在很多绘图软件中,都会有对于任意图形围绕给定的旋转中心旋转的基本操作。本节就基于Godot实现任意多边形(Polygon)或折线(Polyline)绕任意旋转中心(在图形内或外都可以)进行旋转。原创 2024-03-18 21:47:44 · 330 阅读 · 0 评论 -
【Godot4.2】求沿任意直线对称的点的坐标
求一个点沿任意直线对称的点的坐标,这是一个简单的初中几何问题,如果用传统的求解思路,就是用公式,解方程组。但是作为Godot的使用者,要深谙向量的魅力。对称轴L可以被理解为一个向量A点也可以理解为一个从坐标系原点指向(x1,y1)的向量A向量与X轴的夹角为σL向量与X轴的夹角为θ则A向量与对称轴L向量的夹角θ=σ-θ`那么B点坐标就可以通过A向量旋转`2θ``求得。如果L不经过原点,那么只需要加上偏移值offset就可以了。原创 2024-03-18 19:17:08 · 304 阅读 · 0 评论 -
【Godot4.2】像素直线画法及点求取函数
基于CanvasItem提供的绘图函数进行线段绘制只需要直接调用draw_line函数就可以了。但是对于可以保存的图片,却需要依靠Image类,而Image类没有直接提供基于像素的绘图函数。只能依靠set_pixel或set_pixelv进行逐个像素的填色。所以问题就变成了获取线段上两点之间所有经过的点的位置的问题。搞定绘制线段后,就可以基于多个点连线绘制多边形,也就可以绘制出其他常见的几何图形。基于Image搞自己的绘图函数,其目的不言而喻,就是为了实现像素画绘制工具,以及实现。原创 2024-03-24 21:41:00 · 710 阅读 · 0 评论 -
【Godot4.2】Rect2拓展——mRect2类
Rect2存在一些问题,比如难以获取除positionend和center之外的其他点。虽然计算并不复杂,就是简单的向量加减。但每次手动计算则比较麻烦。其实在静态函数库中,已经尝试返回矩形的四个顶点,用于绘制矩形。# 返回矩形的顶点# 注意:以(0,0)为几何中心-size/2,size/2,-size/2]mRect2要做的是基于一个Rect2,快速返回九个位置点。这个类初始创建于2023年7月9日,于2024年3月21日进行了一定的改进和扩充。原创 2024-03-21 21:51:36 · 349 阅读 · 0 评论 -
【Godot4.2】基础知识 - Godot中的2D向量
在Godot中,乃至一切游戏编程中,你应该都躲不开向量。这是每一个初学者都应该知道和掌握的内容,否则你将很难理解和实现某些其实原理非常简单的东西。我也是好几次想尝试完全总结这一部分内容了,这次就趁着要写公众号文章和星球剪报,尝试一次性总下。让新手们不再和我当初初学时那样迷茫。本篇汇总了我两年时间里写过的一些关于向量的东西。说明:本文写于2022年11月26日,基于的Godot版本是3.5,与目前Godot4.2在某些语法和API上可能会有差异,后续会基于4.2进行改写和拓展。原创 2024-03-21 23:56:49 · 1021 阅读 · 0 评论 -
【Godot4.2】2D辅助类Geometry2D入门
Godot4.2提供了一个名叫Geometry2D的类。它提供了一些用于2D几何图形如多边形(Polygon)、折线(PolyLine)相关的函数,可以方便实现诸如多边形与多边形或多边形与折线的布尔运算求交点等。这是一个非常强大的2D几何辅助类,可以方便你基于几何图形的一些复杂操作。本篇是笔者2023年7月受到B站一个搬运视频启发,然后基于Godot内置文档研究Geometry2D并逐个尝试方法,从而总结的一份笔记。原始笔记分为两篇,这里合二为一,并可能会做一定的改写和扩充。期望对你的学习或项目有用。原创 2024-03-23 01:41:17 · 1070 阅读 · 0 评论 -
【Godot4.2】CanvasItem绘图函数全解析 - 0.概述
Godot提供了CanvasItem类型,并提供了_draw虚函数和一系列绘图函数。通过这些绘图函数,我们可以绘制各种图形、文本、纹理、样式盒、导航路径、辅助线以及制作自定义Node2D或Control。我个人以往研究和使用比较多的是基础图形绘制功能,我想这也是很多人停留的层次。但是经过我本次的一番研究,发现了很多以往忽略或不了解的功能和细节。还发现有很多其他类型本身提供了绘图函数,可以绘制在某些CanvasItem或其子类型上。本系列就尽量完整补足CanvasItem相关绘图函数以及相关类型的内容。原创 2024-04-13 17:54:36 · 342 阅读 · 0 评论 -
【Godot4.2】CanvasItem绘图函数全解析 - 4.绘制样式盒
欢迎来到系列的第4节,本节我们来讲CanvasItem绘图函数中的样式盒绘制函数。:空样式盒:平面样式盒,不使用纹理,而是通过定义边框和背景色来实现。:线样式盒,可以绘制水平或垂直的分割线:纹理样式盒,类似于,可以基于九宫格形式,拼凑出自适应的纹理背景样式。而CanvasItem提供了用来绘制样式盒,上面4种都可以用这个函数来绘制。可以看到,与绘制简单的几何图形相比,样式盒可以做出更好的设计,可以很简单的实现圆角矩形以及描边和阴影等效果。我也会在下一节讲完字符和字符串绘制后,在综合案例。原创 2024-04-13 23:19:17 · 365 阅读 · 0 评论 -
【Godot4.2】CanvasItem绘图函数全解析 - 1.绘制简单图形
本节通过实例来简单讲解CanvasItem绘图函数中用于图形绘制的一些函数。其他内容可以查看系列相关文章。原创 2024-04-13 19:33:15 · 661 阅读 · 0 评论 -
【Godot4.2】CanvasItem绘图函数全解析 - 7.自定义节点TextBoard
之前发布的几篇文章几乎阐述了CanvasItem绘图函数最基础的内容。本篇结合和类,自定义了一个可以自适应宽高显示多行文本,且带有一个样式盒作为背景的文字板节点TextBoard。原创 2024-04-14 01:08:57 · 224 阅读 · 0 评论 -
【Godot4.2】CanvasItem绘图函数全解析 - 5.绘制字符和字符串
到这一节为止,我们已经学习了如何在CanvasItem中绘制简单几何图形、图片以及样式盒。但是对于很重要的文字一直没有涉及。本节就来讲一下字符和字符串绘制函数,以及替换它们的两个类。本节简要讲述了CanvasItem内置的字符和字符串绘制函数及其缺点然后讲述了更好用的TextLine和,用于绘制单行和多行文本。实际上TextLine和好有很多特性和功能,可以让我们轻松实现很多东西。但是篇幅所限,留到下节。对于文本绘制的综合使用,也会专门留几个案例,也是相当有趣。原创 2024-04-14 00:28:08 · 989 阅读 · 0 评论 -
【Godot4.2】CanvasItem绘图函数全解析 - 9.绘制表格
之前介绍TextLine和的时候,提到了用制表符和设定列宽形式来绘制简易表格,但是很明显,单纯使用此种方式很难获得对表格的精确控制。所以对于表格绘制问题,我决定单独开坑,单独深入研究。将表格数据储存为一个二维数组设定列宽然后通过遍历每个单元格数据,来构造单独的TextLine或实例,并通过列宽设定动态计算和绘制。原创 2024-04-14 01:45:29 · 333 阅读 · 0 评论 -
【Godot4.2】CanvasItem绘图函数全解析 - 2.设定绘图变换
上一节我们讲了如何使用绘图函数绘制常见的几何图形。在末尾绘制椭圆部分,我们简单涉及到了也就是变换的内容。关于变换的内容可以参考我即将发布的文章。这里我暂时认为你已经比较了解线性变换的本质以及如何构造、使用旋转缩放和平移变换。对2D几何图形,施加2D变换,是一个非常基础的内容,但是也很重要。通过构造几何中心在原点的图形,比如单位圆单位矩形,我们就可以通过对其施加旋转、缩放以及平移变换来获得任意的圆、椭圆以及矩形通过设定绘图变换,可以简化图形的绘制操作。原创 2024-04-13 20:06:42 · 592 阅读 · 0 评论 -
【Godot4.2】CanvasItem绘图函数全解析 - 6.TextLine和TextParagraph详解
上一节讲述了CanvasItem内置文本绘制函数,以及TextLine和类,绘制单行和多行文本的基础内容。但是实际上TextLine和类比我们想象的要功能丰富和强大的多。本节就来详细介绍一下。本节简单补充了一下TextLine和的细节功能,包括图文混排和制表这两个非常重要的功能。其实不仅仅可以添加图片站位来实现图文混排,实际上也可以将控件或某些节点混合到文字中国对于绘制表格,如果想要更细节的控制则不能单单使用tab_align和制表符实现。对于更好的表格绘制,可以见后续文章。原创 2024-04-14 01:02:58 · 323 阅读 · 0 评论 -
【Godot4.2】CanvasItem绘图函数全解析 - 8.绘制点索引
在示意图绘制过程中或者测试过程中,可能需要标记点的索引。最常见的形式就是用一个圆圈作为背景,用阿拉伯数字作为索引。实现的重点是动态计算背景圆的半径。原理是,获取字符串的矩形,取对角线长度的一半作为外接圆的半径。标记和绘制点索引是一种很常用且重要的效果本文只是涉及了点索引在几何图形上的使用,实际上可以将它使用在类似标记AStar路径点这样的功能上,让原本抽象的内容一下子变得清晰。原创 2024-04-14 01:19:51 · 189 阅读 · 0 评论 -
【Godot4.2】CanvasItem绘图函数全解析 - 3.绘制纹理
前两节我们讲述了常见几何图形绘制以及对几何图形应用变换的基础知识。本节我们来讲如何在CanvasItem中绘制纹理。我们通过设定一个名叫texture的导出变量来接收从文件系统和监视器面板设定的图片。然后在_draw()中使用原样绘制出来。@toolset(val):# 绘制texture参数指定的纹理本节内容比较简单,主要涉及绘制纹理相关的3个函数。通过这3个函数,能实现很多自定义节点或绘图时的功能需要。原创 2024-04-13 22:57:55 · 664 阅读 · 0 评论 -
【Godot4.2】myPoint类 - 基于旋转和移动的点求取方式
记得很久以前(大约17年前)有个用指令绘图的软件(不是LOGO,而是它的一个模仿者,我找半天实在找不到。),基于移动和旋转来绘制折线。每次移动和旋转都是基于当前位置和方向,就像一个人在走路一样。这是一种有别于向量旋转的方式。所以我就突发奇想,想要自己实现这种独特的绘图方法。myPoint类基本上是开辟了另一种几何图形点求取方式,可以很好的作为简单向量旋转和加减法求点形式的补充通过简单的旋转和移动函数可以绘制很多特殊几何图形,而且也可以通过进一步编写函数来参数化的快速获取图形。原创 2024-04-14 14:36:55 · 672 阅读 · 0 评论