uv纹理坐标设定与贴图规则

最新推荐文章于 2024-07-25 10:49:52 发布

YYYJ_BOY

最新推荐文章于 2024-07-25 10:49:52 发布

阅读量4k

点赞数 2

分类专栏：学习笔记文章标签： 1024程序员节

原文链接：https://www.cnblogs.com/jenry/p/4083415.html

版权

学习笔记专栏收录该内容

26 篇文章 2 订阅

订阅专栏

本文详细介绍了UV纹理坐标的概念，它是3D模型贴图的基础，用于定位图像在模型表面的位置。内容涵盖平面投影、纹理坐标设定规则及其在Android平台下的应用，以及平铺和箝位两种处理超出0.0到1.0范围纹理坐标的策略。平铺允许纹理在模型表面重复，而箝位则限制纹理坐标在边界内，防止失真。

摘要由CSDN通过智能技术生成

原文链接：https://www.cnblogs.com/jenry/p/4083415.html

1.什么是UV?

对于三维模型，有两个最重要的坐标系统，一是顶点的位置（X，Y，Z）坐标，另一个就是UV坐标。什么是UV？简单的说，就是贴图影射到模型表面的依据。完整的说，其实应该是UVW（因为XYZ已经用过了，所以另选三个字母表示）。U和V分别是图片在显示器水平、垂直方向上的坐标，取值一般都是0~1，也就是（水平方向的第U个像素/图片宽度，垂直方向的第V个像素/图片高度）。那W呢？贴图是二维的，何来三个坐标？嗯嗯，W的方向垂直于显示器表面，一般用于程序贴图或者某些3D贴图技术（记住，确实有三维贴图这种概念！），对于游戏而言不常用到，所以一般我们就简称UV了。

所有的图象文件都是二维的一个平面。水平方向是U，垂直方向是V，通过这个平面的，二维的UV坐标系。我们可以定位图象上的任意一个象素。但是一个问题是如何把这个二维的平面贴到三维的NURBS表面和多边形表面呢？对于NURBS表面。由于他本身具有UV参数，尽管这个UV值是用来定位表面上的点的参数，但由于它也是二维的，所以很容易通过换算把表面上的点和平面图象上的象素对应起来。所以把图象贴带NURBS是很直接的一件事。但是对于多变形模型来讲，贴图就变成一件麻烦的事了。所以多边形为了贴图就额外引进了一个UV坐标，以便把多边形的顶点和图象文件上的象素对应起来，这样才能在多边形表面上定位纹理贴图。所以说多边形的顶点除了具有三维的空间坐标外。还具有二维的UV坐标。

UV" 这里是指u,v纹理贴图坐标的简称(它和空间模型的X, Y, Z轴是类似的). 它定义了图片上每个点的位置的信息. 这些点与3D模型是相互联系的, 以决定表面纹理贴图的位置. UV就是将图像上每一个点精确对应到模型物体的表面. 在点与点之间的间隙位置由软件进行图像光滑插值处理. 这就是所谓的UV贴图.
那为什么用UV坐标而不是标准的投影坐标呢? 通常给物体纹理贴图最标准的方法就是以planar(平面),cylindrical(圆柱), spherical(球形),cubic(方盒)坐标方式投影贴图.
Planar projection(平面投影方式)是将图像沿x,y或z轴直接投影到物体. 这种方法使用于纸张, 布告, 书的封面等 - 也就是表面平整的物体.平面投影的缺点是如果表面不平整, 或者物体边缘弯曲, 就会产生如图A的不理想接缝和变形. 避免这种情况需要创建带有alpha通道的图像, 来掩盖临近的平面投影接缝, 而这会是非常烦琐的工作. 所以不要对有较大厚度的物体和不平整的表面运用平面投影方式. 对于立方体可以在x, y方向分别进行平面投影, 但是要注意边缘接缝的融合. 或者采用无缝连续的纹理, 并使用cubic投影方式. 多数软件有图片自动缩放功能, 使图像与表面吻合. 显然, 如果你的图像与表面形状不同, 自动缩放就会改变图像的比例以吻合表面. 这通常会产生不理想的效果, 所以制作贴图前先测量你的物体尺寸.

2、uv纹理坐标设定与贴图规则

当opengl对一个四方形进行贴图时，会定义纹理贴图坐标，一串数组，相信初学openggl es者看到后会很头疼，不知道写得是什么东西。现在就将我的研究成果与大家分享下！

当纹理映射启动后绘图时，你必须为OpenGL ES提供其他数据，即顶点数组中各顶点的纹理坐标。纹理坐标定义了图像的哪一部分将被映射到多边形。它的工作方式有点奇怪。

下面看下在android平台下Opengl纹理系统坐标，左下角为原点。在这里插入图片描述
我们现在讨论怎样使用这些纹理坐标。当我们指定顶点数组中的顶点时，我们需要在另一个数组中提供纹理坐标，它称为纹理坐标数组。这里需要注意定义坐标数组顺序，这很关键。

float texCoords[] = new float[] {
// FRONT
0.0f, 0.0f,
1.0f, 0.0f,
0.0f, 1.0f,
1.0f, 1.0f,
};

效果如下：
在这里插入图片描述
如果我们想截取图片有上角不分做纹理，按照上面方法可获的数组

float texCoords[] = new float[] {
// FRONT
0.5f, 0.5f,
1f, 0.5f,
0.5f, 1f,
1f, 1f
};

效果如下：
![在这里插入图片描述](https://img-blog.csdnimg.cn/20201024155932737.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1lZWUpfQk9Z,size_16,color_FFFFFF,t_70#pic_center
我们看下贴图的原始文件

你会发现截屏中的图片y轴是颠倒的，其实这是android图像坐标系统与Opengl es 坐标系统不一致导致的。最简单的修正办法将原始图片用工具翻转过来，这样会比用程序翻转节省很多性能，资源是宝贵的。