Unity UGUI的Outline(描边)组件的介绍及使用

news/2024/10/30 1:04:27/

Unity UGUI的Outline(描边)组件的介绍及使用

1. 什么是Outline(描边)组件?

Outline(描边)组件是Unity UGUI中的一种特效组件,用于给UI元素添加描边效果。通过设置描边的颜色、宽度和模糊程度,可以使UI元素在视觉上更加突出。

2. Outline(描边)组件的工作原理

Outline(描边)组件通过在UI元素周围绘制多个相同的UI元素,并设置不同的颜色和大小,从而实现描边的效果。描边的宽度和模糊程度可以通过调整参数来控制。

3. Outline(描边)组件的常用属性

  • Effect Color:描边的颜色。
  • Effect Distance:描边的距离,可以设置为正值或负值。
  • Use Graphic Alpha:是否使用UI元素的透明度作为描边的透明度。
  • Blur:描边的模糊程度。
  • Outline:描边的宽度。

4. Outline(描边)组件的常用函数

  • ModifyMesh:修改UI元素的网格,用于绘制描边效果。

5. 完整例子代码

例子1:给按钮添加红色描边

using UnityEngine;
using UnityEngine.UI;public class Example1 : MonoBehaviour
{public Button button;public Outline outline;void Start(){outline.effectColor = Color.red;outline.effectDistance = new Vector2(2, -2);outline.useGraphicAlpha = true;outline.blur = 0;outline.outline = 5;}
}

操作步骤:

  1. 创建一个按钮,并将Example1脚本挂载到按钮上。
  2. 将按钮的Outline组件拖拽到Example1脚本的outline变量上。
  3. 在Start函数中,设置outline的属性,包括effectColor、effectDistance、useGraphicAlpha、blur和outline。

注意事项:

  • 可以根据需要调整描边的颜色、距离、透明度、模糊程度和宽度。

例子2:给文本添加蓝色描边

using UnityEngine;
using UnityEngine.UI;public class Example2 : MonoBehaviour
{public Text text;public Outline outline;void Start(){outline.effectColor = Color.blue;outline.effectDistance = new Vector2(1, -1);outline.useGraphicAlpha = true;outline.blur = 0;outline.outline = 3;}
}

操作步骤:

  1. 创建一个文本对象,并将Example2脚本挂载到文本对象上。
  2. 将文本对象的Outline组件拖拽到Example2脚本的outline变量上。
  3. 在Start函数中,设置outline的属性,包括effectColor、effectDistance、useGraphicAlpha、blur和outline。

注意事项:

  • 可以根据需要调整描边的颜色、距离、透明度、模糊程度和宽度。

例子3:给图片添加绿色描边

using UnityEngine;
using UnityEngine.UI;public class Example3 : MonoBehaviour
{public Image image;public Outline outline;void Start(){outline.effectColor = Color.green;outline.effectDistance = new Vector2(3, -3);outline.useGraphicAlpha = true;outline.blur = 0;outline.outline = 7;}
}

操作步骤:

  1. 创建一个图片对象,并将Example3脚本挂载到图片对象上。
  2. 将图片对象的Outline组件拖拽到Example3脚本的outline变量上。
  3. 在Start函数中,设置outline的属性,包括effectColor、effectDistance、useGraphicAlpha、blur和outline。

注意事项:

  • 可以根据需要调整描边的颜色、距离、透明度、模糊程度和宽度。

例子4:给滑动条添加黄色描边

using UnityEngine;
using UnityEngine.UI;public class Example4 : MonoBehaviour
{public Slider slider;public Outline outline;void Start(){outline.effectColor = Color.yellow;outline.effectDistance = new Vector2(2, -2);outline.useGraphicAlpha = true;outline.blur = 0;outline.outline = 5;}
}

操作步骤:

  1. 创建一个滑动条对象,并将Example4脚本挂载到滑动条对象上。
  2. 将滑动条对象的Outline组件拖拽到Example4脚本的outline变量上。
  3. 在Start函数中,设置outline的属性,包括effectColor、effectDistance、useGraphicAlpha、blur和outline。

注意事项:

  • 可以根据需要调整描边的颜色、距离、透明度、模糊程度和宽度。

例子5:给输入框添加紫色描边

using UnityEngine;
using UnityEngine.UI;public class Example5 : MonoBehaviour
{public InputField inputField;public Outline outline;void Start(){outline.effectColor = Color.magenta;outline.effectDistance = new Vector2(1, -1);outline.useGraphicAlpha = true;outline.blur = 0;outline.outline = 3;}
}

操作步骤:

  1. 创建一个输入框对象,并将Example5脚本挂载到输入框对象上。
  2. 将输入框对象的Outline组件拖拽到Example5脚本的outline变量上。
  3. 在Start函数中,设置outline的属性,包括effectColor、effectDistance、useGraphicAlpha、blur和outline。

注意事项:

  • 可以根据需要调整描边的颜色、距离、透明度、模糊程度和宽度。

参考资料

  • Unity官方文档:Outline

http://www.ppmy.cn/news/991457.html

相关文章

【leetcode】977. 有序数组的平方(easy)

给你一个按 非递减顺序 排序的整数数组 nums,返回 每个数字的平方 组成的新数组,要求也按 非递减顺序 排序。 示例 1: 输入:nums [-4,-1,0,3,10] 输出:[0,1,9,16,100] 解释:平方后,数组变为 […

linux nginx 布置方案

一、安装前的准备 1 安装编译工具(nginx安装之前需要编译) yum install -y gcc gcc-c2安装PCRE #2.1下载wget http://downloads.sourceforge.net/project/pcre/pcre/8.35/pcre-8.35.tar.gz#2.2 解压tar -zxvf pcre-8.35.tar.gz#2.3进入目录cd pre-8.3…

ROS中使用RealSense-D435

文章目录 D435简介RealSense的SDK2.0安装方法1:直接利用安装源安装注册服务器公匙将服务器添加到存储库列表安装库 方法2:利用源码安装GitHub下载librealsense安装编译依赖运行脚本cmake编译 软件显示 ROS接口安装启动节点查看话题rviz显示点云 Python接…

一、SpringBoot基础[日志]

一、日志 解释:SpringBoot使用logback作为默认的日志框架,其中还可以导入log4j2等优秀的日志框架 1.修改日志内容 修改整个日志格式:logging.pattern.console%d{yyyy-MM-dd HH:mm:ss} %-5level [%thread] %logger{15} 你好 %msg%n %d{yyy…

华为openGauss数据库入门 - gsql用法

目录 1.1 gsql的语法 1.2 gsql常用选项 1.2.1 最常用的必要选项 1.2.2 -r选项 1.2.3 -E选项 1.2.4 -t选项 1.2.5 -A选项 1.2.6 -v选项 1.2.7 -c选项 1.2.8 -f选项 1.2.9 -q选项 1.3 gsql的元命令 1.3.1 \l命令 1.3.2 \du命令和\dg命令 1.3.3 \db命令 1.3.4 \d…

[SQL挖掘机] - 窗口函数 - rank

介绍: rank() 是一种常用的窗口函数,它为结果集中的每一行分配一个排名(rank)。这个排名基于指定的排序顺序,并且在遇到相同的值时,会跳过相同的排名。 用法: rank() 函数的语法如下: rank() over ([pa…

数字转义汉字数字显示的简单研究

最近有个需求,需要显示汉字数字,比如一二三四五…这样子,问题看起来挺简单,但我没有找到有自带这样的转换的方法,数字转汉字数字,挺有意思的,就简单研究了一下; 百度了一下&#xff…

ARM基础(6):内存屏障指令之DMB、DSB和ISB详解

内存屏障是一个通用术语,用于指代一条或多条指令,它们强制处理器在执行加载(load)或存储(store)指令时进行同步事件。ARMv7-M 和 ARMv6-M架构都提供了三个内存屏障指令来支持内存顺序模型。这三个内存屏障指令分别是:DMB、DSB和ISB。 文章目录…