Unity Text字体颜色渐变

简介: 此代码实现文本颜色的垂直渐变效果。通过定义起始和结束颜色,获取像素位置信息(UV坐标),根据渐变方向计算颜色插值,并应用到每个像素上。具体步骤包括:1) 定义颜色范围;2) 获取UV坐标;3) 计算线性插值;4) 应用颜色。脚本挂载在Text组件上,可调节顶部和底部颜色实现渐变效果。

具体步骤及原理

  1. 定义颜色渐变方向和颜色范围
    开发者需要指定颜色渐变的方向(如垂直、水平)以及起始颜色和结束颜色。这些信息可以通过着色器的属性传递给着色器。例如,定义两个颜色属性 _StartColor 和 _EndColor 分别表示起始颜色和结束颜色。
  2. 获取像素位置信息
    在片段着色器中,需要获取当前处理像素的位置信息。对于 Text 组件,通常可以通过 UV 坐标来表示像素在文字纹理上的位置。UV 坐标的范围是 [0, 1],通过这个坐标可以确定像素在渐变方向上的相对位置。
  3. 计算颜色插值
    根据像素的 UV 坐标和渐变方向,计算该像素在起始颜色和结束颜色之间的插值。可以使用线性插值函数 lerp 来实现这一计算。例如,若渐变方向是垂直的,且 UV 的 y 坐标表示垂直位置,则可以根据 y 坐标的值在起始颜色和结束颜色之间进行插值。
  4. 应用颜色
    将计算得到的插值颜色应用到当前像素上,从而实现颜色渐变效果。

代码如下:

using System.Collections;
using System.Collections.Generic;
using UnityEngine;
using UnityEngine.UI;
/// <summary>
/// ************字体颜色渐变****************************挂在Text上调节颜色即可********************************
/// </summary>
[AddComponentMenu("UI/Effects/GradientText")]
public class GradientText : BaseMeshEffect
{
    [SerializeField]
    private Color32 topColor = Color.white;

    [SerializeField]
    private Color32 bottomColor = Color.black;

    public override void ModifyMesh(VertexHelper vh)
    {
        if (!IsActive() || vh.currentVertCount == 0)
            return;
        List<UIVertex> vertices = new List<UIVertex>();
        vh.GetUIVertexStream(vertices);
        float bottomY = vertices[0].position.y;
        float topY = vertices[0].position.y;
        for (int i = 1; i < vertices.Count; i++)
        {
            if (vertices[i].position.y > topY)
            {
                topY = vertices[i].position.y;
            }
            else if (vertices[i].position.y < bottomY)
            {
                bottomY = vertices[i].position.y;
            }
        }
        float uiElementHeight = topY - bottomY;
        UIVertex v = new UIVertex();
        for (int i = 0; i < vh.currentVertCount; i++)
        {
            vh.PopulateUIVertex(ref v, i);
            v.color = Color32.Lerp(bottomColor, topColor, (v.position.y - bottomY) / uiElementHeight);
            vh.SetUIVertex(v, i);
        }
    }
}

脚本挂载到Text上面即可调节

相关文章
|
C# 图形学
unity使用BMFont制作位图字体
unity也能制作艺术字拉
unity使用BMFont制作位图字体
|
1月前
|
图形学
Unity Text修改字间距
本文介绍了两种实现字间距调整的方法。第一种方法直接通过修改顶点位置实现字间距调整,代码简洁但换行时效果不佳。第二种方法引入了`Line`结构和对齐方式(左、中、右),能够处理多行文本并支持不同对齐方式,更加灵活和通用。两种方法均基于Unity的`BaseMeshEffect`类,通过重写`ModifyMesh`方法来调整UI文本的字间距。最终运行测试可验证效果。
|
7月前
|
前端开发 图形学
小功能⭐️3DCanvas交互方法、Unity自动调整文本框大小、改变文字大小和颜色
小功能⭐️3DCanvas交互方法、Unity自动调整文本框大小、改变文字大小和颜色
|
图形学
Unity 【Content Size Fitter】- 聊天气泡自动适配Text文本框大小
Unity 【Content Size Fitter】- 聊天气泡自动适配Text文本框大小
632 1
点击物体就变颜色,我也有了神笔了(Unity3D)
OnMouseOver(),OnMouseDown(),OnMouseUp(),这三个函数只对3D物体触发事件
简简单单修改游戏对象的材质颜色,一起来看看(Unity3D)
前段时间比较忙,好久没更新博客了,感觉技术都下降了,还是要坚持输出呀。 孔子曰:&quot;学而不思则罔,思而不学则殆&quot;,不能光学习,还要学会思考,要能用起来。 将自己学到的东西记录下来,这样会让学习更加有效。
|
图形学 Android开发
Unity从学习到赚钱系列-聊天气泡及字体模糊
众所周知,人生是一个漫长的流程,不断克服困难,不断反思前进的过程。在这个过程中会产生很多对于人生的质疑和思考,于是我决定将自己的思考,经验和故事全部分享出来,以此寻找共鸣!!!
374 0
|
vr&ar 图形学
【Unity3D 灵巧小知识点】☀️ | Unity控制台 输出打印不同颜色的字体
Unity 小科普 老规矩,先介绍一下 Unity 的科普小知识: Unity是 实时3D互动内容创作和运营平台 。 包括游戏开发、美术、建筑、汽车设计、影视在内的所有创作者,借助 Unity 将创意变成现实。 Unity 平台提供一整套完善的软件解决方案,可用于创作、运营和变现任何实时互动的2D和3D内容,支持平台包括手机、平板电脑、PC、游戏主机、增强现实和虚拟现实设备。 也可以简单把 Unity 理解为一个游戏引擎,可以用来专业制作游戏!
【Unity3D 灵巧小知识点】☀️ | Unity控制台 输出打印不同颜色的字体
|
图形学
Unity 便捷小工具之批量更改UGUI Font(字体)
在项目开发过程中可能会遇到更改字体的需求,如果手动逐一更改实在是太麻烦,所以我们需要自动化,一键能解决的问题绝不点击两次 效果过下 源码如下 using UnityEngine; using System.
2331 0
|
C# 图形学
Unity3d批量更换UGUI-NGUI字体工具
在咱们做项目的时候经常会遇到要换字体的情况,比如美工觉着字体不好看或者要做其它语言版本……遇到这种情况………如果UI很多,显示的字体特别多,那就呵呵了………累不累先放一边,万一漏了可是一件麻烦的事情………… 需要的朋友可以阅读脚本,当然,直接复制到你的工程新建C#脚本,放到Endit文件夹直接也可以使用的。
1904 0