首页 > Unity3D频道 > 【UGUI研究院】 > UGUI研究院之Text文本渐变(十一)
2015
05-08

UGUI研究院之Text文本渐变(十一)

这是我无意间逛国外论坛发现的,感觉还可以就分享给大家。原文 http://pastebin.com/dJabCfWn

UGUI研究院之Text文本渐变(十一) - 雨松MOMO程序研究院 - 1

如下图所示,用法和UGUI自带的outline和shadow一样,可以同时使用。

UGUI研究院之Text文本渐变(十一) - 雨松MOMO程序研究院 - 2

代码在这里了。我加了个判断,它原来的有越界的隐患。

我也在测试中,欢迎大家提意见。

如果你的项目升级到了5.2 请使用下面的代码,感谢代码的提供者。@獨立遊戲開發熊

 

雨松MOMO提醒您:亲,如果您觉得本文不错,快快将这篇文章分享出去吧 。另外请点击网站顶部彩色广告或者捐赠支持本站发展,谢谢!

--

最后编辑:
作者:雨松MOMO
专注移动互联网,Unity3D游戏开发
捐 赠如果您愿意花10块钱请我喝一杯咖啡的话,请用手机扫描二维码即可通过支付宝直接向我捐款哦。

UGUI研究院之Text文本渐变(十一)》有 60 条评论

  1. 斯樵 说:

    UGUI研究院之Text文本渐变(十一) - 雨松MOMO程序研究院 - 1参考雨松的脚步,写了一个可以自定义任意颜色和位置的 文本变色组件,使用Gradient来自定义也颜色设置。详情查看:http://blog.sqstudio.com/?p=1270

  2. hj 说:

    BaseMeshEffect是怎么来的?

  3. 葃兲啲眀兲 说:

    5.3.6可以 5.4的还没试using UnityEngine;using System.Collections;using System.Collections.Generic;using UnityEngine.UI;[AddComponentMenu(“UI/Effects/Gradient”)]public class Gradient : BaseMeshEffect{ public Color32 topColor = Color.white; public Color32 bottomColor = Color.black; public override void ModifyMesh(VertexHelper vh) { if (!IsActive()) { return; } var count = vh.currentVertCount; if (count == 0) return; var vertexs = new List(); for (var i = 0; i < count; i ) { var vertex = new UIVertex(); vh.PopulateUIVertex(ref vertex, i); vertexs.Add(vertex); } var topY = vertexs[0].position.y; var bottomY = vertexs[0].position.y; for (var i = 1; i < count; i ) { var y = vertexs UGUI研究院之Text文本渐变(十一) - 雨松MOMO程序研究院 - 1 .position.y; if (y > topY) { topY = y; } else if (y < bottomY) { bottomY = y; } } var height = topY – bottomY; for (var i = 0; i < count; i ) { var vertex = vertexs UGUI研究院之Text文本渐变(十一) - 雨松MOMO程序研究院 - 2 ; var color = Color32.Lerp(bottomColor, topColor, (vertex.position.y – bottomY) / height); vertex.color = color; vh.SetUIVertex(vertex, i); } }}

  4. 葃兲啲眀兲 说:

    5.3.6可以 5.4的还没试using UnityEngine;using System.Collections;using System.Collections.Generic;using UnityEngine.UI;[AddComponentMenu(“UI/Effects/Gradient”)]public class Gradient : BaseMeshEffect{ public Color32 topColor = Color.white; public Color32 bottomColor = Color.black; public override void ModifyMesh(VertexHelper vh) { if (!IsActive()) { return; } var count = vh.currentVertCount; if (count == 0) return; var vertexs = new List(); for (var i = 0; i < count; i++) { var vertex = new UIVertex(); vh.PopulateUIVertex(ref vertex, i); vertexs.Add(vertex); } var topY = vertexs[0].position.y; var bottomY = vertexs[0].position.y; for (var i = 1; i < count; i++) { var y = vertexs UGUI研究院之Text文本渐变(十一) - 雨松MOMO程序研究院 - 1 .position.y; if (y > topY) { topY = y; } else if (y < bottomY) { bottomY = y; } } var height = topY – bottomY; for (var i = 0; i < count; i++) { var vertex = vertexs UGUI研究院之Text文本渐变(十一) - 雨松MOMO程序研究院 - 2 ; var color = Color32.Lerp(bottomColor, topColor, (vertex.position.y – bottomY) / height); vertex.color = color; vh.SetUIVertex(vertex, i); } }}

  5. XGODX 说:

    error CS0534: Gradient' does not implement inherited abstract member UnityEngine.UI.BaseMeshEffect.ModifyMesh(UnityEngine.UI.VertexHelper)’问一下我是5.3 为啥会出这个报错

  6. LoftShawn 说:

    请问博主,ugui 下 bbcode 要怎么搞?

  7. 一线天 说:

    松哥,求UGUI插件下载地址

  8. 阿尼薇__ 说:

    喔。。雨松大大,再请教一个问题吗,你有没有遇到过使用艺术字的时候,mask遮罩不起作用的情况?

  9. 阿尼薇__ 说:

    不是有组件能支持文本渐变吗?gradient color 组件。。。

  10. huhu 说:

    5.3版本实测已经变成这个了:
    for (int i = 0; i = 6; )
    {
    ChangeColor(ref vertexList, i, topColor);
    ChangeColor(ref vertexList, i 1, topColor);
    ChangeColor(ref vertexList, i 2, bottomColor);
    ChangeColor(ref vertexList, i 3, bottomColor);
    ChangeColor(ref vertexList, i 4, bottomColor);
    ChangeColor(ref vertexList, i 5, topColor);
    i = 6;
    }

  11. huhu 说:

    话说这个代码放在什么位置呢??for (int i = 0; i < vertexList.Count; )

  12. pan 说:

    unity5.22版本参考http://answers.unity3d.com/questions/1086415/gradient-text-in-unity-522-basevertexeffect-is-obs.html
    使用正常。代码如下:
    using UnityEngine;
    using System.Collections.Generic;
    using UnityEngine.UI;

    [AddComponentMenu(“UI/Effects/Gradient”)]
    public class Gradient : BaseMeshEffect
    {
    public Color32 topColor = Color.white;
    public Color32 bottomColor = Color.black;

    public override void ModifyMesh(VertexHelper helper)
    {
    if (!IsActive() || helper.currentVertCount == 0)
    return;

    List vertices = new List();
    helper.GetUIVertexStream(vertices);

    float bottomY = vertices[0].position.y;
    float topY = vertices[0].position.y;

    for (int i = 1; i topY)
    {
    topY = y;
    }
    else if (y < bottomY)
    {
    bottomY = y;
    }
    }

    float uiElementHeight = topY – bottomY;

    UIVertex v = new UIVertex();

    for (int i = 0; i < helper.currentVertCount; i )
    {
    helper.PopulateUIVertex(ref v, i);
    v.color = Color32.Lerp(bottomColor, topColor, (v.position.y – bottomY) / uiElementHeight);
    helper.SetUIVertex(v, i);
    }
    }
    }

  13. pan 说:

    unity5.22版本参考http://answers.unity3d.com/questions/1086415/gradient-text-in-unity-522-basevertexeffect-is-obs.html
    使用正常。代码如下:
    using UnityEngine;
    using System.Collections.Generic;
    using UnityEngine.UI;

    [AddComponentMenu(“UI/Effects/Gradient”)]
    public class Gradient : BaseMeshEffect
    {
    public Color32 topColor = Color.white;
    public Color32 bottomColor = Color.black;

    public override void ModifyMesh(VertexHelper helper)
    {
    if (!IsActive() || helper.currentVertCount == 0)
    return;

    List vertices = new List();
    helper.GetUIVertexStream(vertices);

    float bottomY = vertices[0].position.y;
    float topY = vertices[0].position.y;

    for (int i = 1; i topY)
    {
    topY = y;
    }
    else if (y < bottomY)
    {
    bottomY = y;
    }
    }

    float uiElementHeight = topY – bottomY;

    UIVertex v = new UIVertex();

    for (int i = 0; i < helper.currentVertCount; i++)
    {
    helper.PopulateUIVertex(ref v, i);
    v.color = Color32.Lerp(bottomColor, topColor, (v.position.y – bottomY) / uiElementHeight);
    helper.SetUIVertex(v, i);
    }
    }
    }

  14. aq_1000 说:

    using UnityEngine;
    using System.Collections;
    using System.Collections.Generic;
    using UnityEngine.UI;
    using System;

    [AddComponentMenu(“UI/Effects/Gradient”)]
    public class Gradient : BaseMeshEffect
    {
    [SerializeField]
    private Color32 topColor = Color.white;
    [SerializeField]
    private Color32 bottomColor = Color.black;

    public override void ModifyMesh(VertexHelper vh)
    {
    if (!this.IsActive())
    return;

    List vertexList = new List();
    vh.GetUIVertexStream(vertexList);

    ModifyVertices(vertexList);

    vh.Clear();
    vh.AddUIVertexTriangleStream(vertexList);
    }

    public void ModifyVertices(List vertexList)
    {
    if (!IsActive())
    {
    return;
    }

    int count = vertexList.Count;
    if (count > 0)
    {
    float bottomY = vertexList[0].position.y;
    float topY = vertexList[0].position.y;

    for (int i = 1; i topY)
    {
    topY = y;
    }
    else if (y < bottomY)
    {
    bottomY = y;
    }
    }

    float uiElementHeight = topY – bottomY;

    for (int i = 0; i < count; i )
    {
    UIVertex uiVertex = vertexList[i];
    uiVertex.color = Color32.Lerp(bottomColor, topColor, (uiVertex.position.y – bottomY) / uiElementHeight);
    vertexList[i] = uiVertex;
    }
    }
    }
    }

    Unity5.2.1p4版本

  15. 奥的灰烬 说:

    现在UGUI有这个效果,添加组件-effect 就可以找到

  16. chaos 说:

    大神,我想问下UGUI 的Text 文本要加 中划线 怎么弄???我查了文档好像只有加粗斜体和颜色。我记得以前用NGUI是可以的。。求解答

  17. 莫名 说:

    为什么我按照上面的代码 写了一份,UI/Effects 里面没有出现Gradient 选项啊

  18. 雪焰 说:

    可不可以自己写一个描边Outline?感觉现在的不好用,想描粗一点就走样了

  19. yx 说:

    Image上面覆盖一层Text,就是button的情况。然后有重叠的时候会产生大量的draw call。不知道要怎么解决啊。

  20. 织博 说:

    我修改了下.可以支持多行显示,大家可以测试下.for (int i = 0; i < vertexList.Count; ){ChangeColor( ref vertexList, i, topColor);ChangeColor( ref vertexList, i 1, topColor);ChangeColor( ref vertexList, i 2, bottomColor);ChangeColor( ref vertexList, i 3, bottomColor);i = 4;}private void ChangeColor( ref List verList, int index, Color color){UIVertex temp = verList[index];temp.color = color;verList[index] = temp;}

  21. 织博 说:

    我修改了下.可以支持多行显示,大家可以测试下.for (int i = 0; i < vertexList.Count; ){ ChangeColor( ref vertexList, i, topColor); ChangeColor( ref vertexList, i + 1, topColor); ChangeColor( ref vertexList, i + 2, bottomColor); ChangeColor( ref vertexList, i + 3, bottomColor); i += 4;}private void ChangeColor( ref List verList, int index, Color color){ UIVertex temp = verList[index]; temp.color = color; verList[index] = temp;}

  22. 伊克西 说:

    发现一个蛋疼的问题。 UGUI的Text 没有字间距这种属性。。。。。。。。。。。。。。

  23. lojne 说:

    还有我的outline和shadow的颜色也被同化了 并没有出黑色的阴影和描边效果 调大distance出现的是一个和原来文字效果一样的文字

  24. lojne 说:

    这个是对于整个字段总体的一个渐变啊!~如果是一段文字就发现上面一行都是一个颜色 有没有方法让每行文字都有渐变

  25. 黄宝欢 说:

    请问脚本是C#么?有一些不是很懂!

  26. az 说:

    是哪个国外论坛?最近在学习u3d,麻烦雨松推荐几个Unity3D的论坛和网站 UGUI研究院之Text文本渐变(十一) - 雨松MOMO程序研究院 - 1

留下一个回复

你的email不会被公开。