在uGUI正交相机中实现旋转透视效果
正常uGUI使用正交相机的话,旋转是没有透视效果的,但如果能实现较简单的透视,
对一些效果表现来说还是不错的;见下图(左为透视效果):

正常思路感觉各种麻烦。
因为uGUI使用unity的x和y方向表示宽高,z方向自然就是纵深,我们可以直接拿z值作为系数进行缩放处理,
达到伪透视的效果(美中不足,细看会有弧度感)。
但是,直接对z轴进行缩放会出现扭曲问题:

这种情况可以通过顶点细分来解决,一般细分一次即可。顶点越多,UV插值产生的扭曲影响就越小:

再扩展一下可支持Text组件:

最后上代码:
namespace Hont
{
using System.Collections.Generic;
using UnityEngine;
using UnityEngine.UI; [ExecuteInEditMode]
public class UiPerspectiveFx : BaseMeshEffect
{
[Header("Only Image")]
public int subdivision = 2;//有的材质细分2次,有的需3-4次。
public float perspectiveScale = 1.0f;
public bool alwaysRefresh = true; private void Update()
{
if (alwaysRefresh)
graphic.SetVerticesDirty();
} private void CalcPerspectiveScale(ref Vector3 point)
{
Vector3 wPos = transform.localToWorldMatrix.MultiplyPoint(point);
float fixValue = wPos.z * perspectiveScale;
point *= 1f + fixValue;
} public override void ModifyMesh(VertexHelper vh)
{
RectTransform rectTransform = transform as RectTransform; if (graphic is Image)
{
vh.Clear(); Vector2 begin = -rectTransform.sizeDelta * 0.5f;
Vector2 cell = rectTransform.sizeDelta / subdivision;
float uvCell = 1f / subdivision;
for (int x = 0; x < subdivision; x++)//TODO:可进一步做缓存优化
{
for (int y = 0; y < subdivision; y++)
{
Vector3 p0 = new Vector3(begin.x + cell.x * x, begin.y + cell.y * y);
Vector3 p1 = new Vector3(begin.x + cell.x * x, begin.y + cell.y * (y + 1));
Vector3 p2 = new Vector3(begin.x + cell.x * (x + 1), begin.y + cell.y * (y + 1));
Vector3 p3 = new Vector3(begin.x + cell.x * (x + 1), begin.y + cell.y * y); Vector3 uv0 = new Vector3(x * uvCell, y * uvCell);
Vector3 uv1 = new Vector3(x * uvCell, (y + 1) * uvCell);
Vector3 uv2 = new Vector3((x + 1) * uvCell, (y + 1) * uvCell);
Vector3 uv3 = new Vector3((x + 1) * uvCell, y * uvCell); CalcPerspectiveScale(ref p0);
CalcPerspectiveScale(ref p1);
CalcPerspectiveScale(ref p2);
CalcPerspectiveScale(ref p3); vh.AddUIVertexQuad(new UIVertex[]
{
new UIVertex(){position=p0, color=graphic.color, uv0=uv0},
new UIVertex(){position=p1, color=graphic.color, uv0=uv1},
new UIVertex(){position=p2, color=graphic.color, uv0=uv2},
new UIVertex(){position=p3, color=graphic.color, uv0=uv3}
});
}
}
}
else if (graphic is Text)
{
for (int i = 0, iMax = vh.currentVertCount; i < iMax; i++)
{
UIVertex vertex = default;
vh.PopulateUIVertex(ref vertex, i);
CalcPerspectiveScale(ref vertex.position);
vh.SetUIVertex(vertex, i);
}
}
}
}
}
挂载到Image/Text组件下即可:

在uGUI正交相机中实现旋转透视效果的更多相关文章
- 子坐标系C在父坐标系W中的旋转问题
关键词:空间旋转.旋转轴.刚体旋转 用途:相机位姿估计.无人机位姿估计 文章类型:概念.公式总结(本文不带推倒过程,若想了解公式是如何推出来的请自习搜索文献),C++函数展示 @Author:VSha ...
- ios中从相册:相机中获取图片信息
ios中从相册/相机中获取图片信息 从相册中获取图片的信息 UIImagePickerController *imgPickView = [[UIImagePickerController alloc ...
- Unity正交相机智能包围物体(组)方案
Unity正交相机智能包围物体(组)方案 目录 Unity正交相机智能包围物体(组)方案 一.技术背景 二.相关概念 2.1 正交摄像机 2.2 正交相机的Size 2.3 相机的Aspect 2.4 ...
- Unity 3D 正交相机(Orthographic)
1. Camera.aspect 表示摄像机显示区域的纵横比.宽高比,摄像机初始化的时候会默认设置成当前屏幕的宽高比,可以更改,也可以通过 Camera.ResetAspect 来重置. 2. Cam ...
- 矩阵中的旋转(Rotation)
参考的是<游戏和图形学的3D数学入门教程>,算是读书笔记吧. 目录 [隐藏] 1.2D中的旋转 2.3D中的旋转 2.1绕x轴旋转: 2.2绕Y轴旋转 2.3绕Z轴旋转 1.2D中的旋转 ...
- OpenGL中的旋转是可以叠加的?
OpenGL中的旋转是可以叠加的? 1. opengl中的旋转 如:glrogtate(45.0f, 0, 0, 1),是将当前坐标系顺时针旋转45度,然后绘制, 程序如下: ; float line ...
- Android中图片旋转
Activity_main.xml文件配置 <LinearLayout xmlns:android="http://schemas.android.com/apk/res/androi ...
- WPF中3D旋转的实现
原文:WPF中3D旋转的实现 关于3D旋转的原理,请看Daniel Lehenbauer的文章 <Rotating the Camera with the Mouse> http://vi ...
- vue实现点击图标,图标在2s中完成旋转
<!-- 点击 vue实现点击图标,图标在2s中完成旋转 1==>如何让它在2s内完成旋转 使用动画 transform: rotate(-180deg); 动画的运动状态 transit ...
- 【VS开发】【图像处理】相机中白平衡的算法模拟实现
相机主要技术点为3A算法. 而3A算法主要指的是自动对焦(AF).自动曝光(AE)及自动白平衡(AWB).自动白平衡:根据光源条件调整图片颜色的保真程度. 网上时常有类似招聘如下的招聘信息: ---- ...
随机推荐
- #插头dp#洛谷 5074 HDU 1693 Eat the Trees
题目 给出 \(n*m\) 的方格,有些格子不能铺线, 其它格子必须铺,可以形成多个闭合回路. 问有多少种铺法? \(n,m\leq 12\) 分析 设 \(dp[n][m][S][0/1]\) 表示 ...
- 国产开源数据库OpenGauss的安装运行
步骤一:OpenGauss 的安装 环境 OS:openEuler 20.03 64bit with ARM 架构:arm64 部署:单机 安装过程 1.环境配置 安装依赖包: yum install ...
- Prometheus AlertManager 生产实践-直接根据 to_email label 发 alert 到对应邮箱
概述 通过之前的文章 - Prometheus Alertmanager 生产配置趟过的坑总结, 我们已经知道 AlertManager 作为告警平台,是非常强大的,可以去重 (deduplicati ...
- 如何增强Java Excel API 的导入和导出性能
前言 GrapeCity Documents for Excel (以下简称GcExcel)是葡萄城公司的一款服务端表格组件,它提供了一组全面的 API 以编程方式生成 Excel (XLSX) 电子 ...
- js es6系列——map函数
正文 map,必要解释就是map不是地图的意思,而是映射的意思. 这里就简单的介绍了这个map了. array.map(callback,[ thisObject]); 看下这个案例后,我们发现了就发 ...
- WPF开发随笔收录-查看PDF文件
一.前言 在项目的开发过程中,涉及到查看服务器生成的pdf报告文件的查看,起初的方案是通过spire.pdf这个库来将pdf文件转换成图片,然后在进行查看.但是经常被吐槽预览不清晰,后面上网发现了一个 ...
- React中类组件和函数组件
一.类组件 类组件,顾名思义,也就是通过使用ES6类的编写形式去编写组件,该类必须继承React.Component 如果想要访问父组件传递过来的参数,可通过this.props的方式去访问 在组件中 ...
- 什么是token,为什么需要token
1.为什么需要token 随着互联网的发展,为了更安全,以及更好的用户体验,逐渐产生了token这个技术方案 之所以使用token是因为http/https协议本身是无状态的,不能进行信息的存储 (c ...
- 力扣442(java)-数组中重复的数据(中等)
题目: 给你一个长度为 n 的整数数组 nums ,其中 nums 的所有整数都在范围 [1, n] 内,且每个整数出现 一次 或 两次 .请你找出所有出现 两次 的整数,并以数组形式返回. 你必须设 ...
- 力扣454(java&python)-四数相加 II(中等)
题目: 给你四个整数数组 nums1.nums2.nums3 和 nums4 ,数组长度都是 n ,请你计算有多少个元组 (i, j, k, l) 能满足: 0 <= i, j, k, l &l ...