用 4 个脚本快速实现 Unity UGUI 颜色渐变

用 4 个脚本快速实现 Unity UGUI 颜色渐变

【免费下载链接】Unity-UIGradientA UI gradient effect script for Unity项目地址: https://gitcode.com/gh_mirrors/un/Unity-UIGradient

Unity-UIGradient 是一套为 Unity UGUI 元素添加渐变效果的轻量脚本集合。标准 UGUI 的 Image、Text 只支持纯色，想要渐变通常得自己写着色器。这里提供 4 个可直接挂载的组件，不用写一行 Shader 代码，也不用引入第三方插件。

🎯 解决什么问题

给游戏按钮做一个上浅下深的渐变、给标题做双色文字，是很常见的需求。但标准 UGUI 只接受单一颜色，自己写 Shader 处理顶点色，对新手不友好。这个项目的做法是把渐变做成 4 个组件：挂到 UI 元素上，在 Inspector 里挑颜色、拖角度滑块，效果直接生效。

🧩 拆开看，它由哪些部分组成

4 个组件都在 Assets/Scripts 目录，一个脚本对应一种效果：

1. UIGradient：双色线性渐变，可设角度（-180 到 180 度），可选是否按宽高比补偿。适合纯色背景板和按钮的渐变底色。
2. UICornersGradient：四角各分配一个颜色，角间做双线性插值。适合四个方向有色差变化的大尺寸背景面板。
3. UITextGradient：按每个字符做双色渐变。适合主标题、宣传文案的双色过渡文字。
4. UITextCornersGradient：每个字符拥有 4 个独立角颜色。适合风格化的艺术字标题。

🖼️ 哪些场景适合用它

• 游戏主菜单的按钮与背景面板
• 导航栏、标签页、进度条的渐变色
• 数据图表背景的明暗过渡
• 艺术字标题与宣传文案
• 需要渐变又不想写自定义 Shader 的界面

对新手最友好的一点：全程不需要着色器基础，独立开发者和小团队可以直接放进项目使用。

🔧 上手成本有多低

• 易用：4 个脚本注册在 UI/Effects 菜单下，从菜单直接挂载。参数只有颜色选择器和一个角度滑条，Inspector 里一目了然。
• 灵活：兼容 Image、Text 等 UGUI 组件。双色渐变带“忽略宽高比”选项，面板拉伸后渐变方向不会变形。
• 性能：全部继承 UGUI 的 BaseMeshEffect，只在已有网格上做顶点色插值，不新增 Draw Call 和着色器资源。
• 可扩展：单个组件源码不足 40 行，核心逻辑都集中在 ModifyMesh，方便阅读和改动。

📦 什么时候用，什么时候不必用

需要给 UGUI 按钮、面板、文字加颜色渐变时，这套组件从简单双色到逐字四色覆盖了 4 个层次。如果 UI 只需要纯色，或要在金属、描边等材质效果上叠加渐变，就没必要引入它。把 Assets 目录导入 Unity 工程、挂上脚本即可使用，源码集中在 Assets/Scripts，便于查看和二次修改。

【免费下载链接】Unity-UIGradientA UI gradient effect script for Unity项目地址: https://gitcode.com/gh_mirrors/un/Unity-UIGradient