Unity 3D UGUI Toggle用法教程

简介: UGUI Toggle用法教程本文提供全流程,中文翻译。 Chinar 坚持将简单的生活方式,带给世人!(拥有更好的阅读体验 —— 高分辨率用户请根据需求调整网页缩放比例) Chinar ——...

UGUI Toggle用法教程


本文提供全流程,中文翻译。

Chinar 坚持将简单的生活方式,带给世人!

(拥有更好的阅读体验 —— 高分辨率用户请根据需求调整网页缩放比例)



Chinar —— 心分享、心创新!

助力快速理解 UGUI Toggle 组件用法

为新手节省宝贵的时间,避免采坑!


Chinar 教程效果:
这里写图片描述



全文高清图片,点击即可放大观看 (很多人竟然不知道)


1

Description —— 说明


我们在项目开发的时候,有时需要一个按钮,来模拟 / 控制开关

此时,如果用 Button 的话,作为开发者还需要自己写一些判定逻辑

来告诉电脑,这个 Button 按钮是打开、还是关闭


众所周知,作为程序员、开发者都是比较懒的

能写10行代码实现的功能,绝不写11行,才是一个标准程序员的信仰!

由此: Toggle 组件诞生了,方便且简单的解决了上述问题

用法上和 Button 几乎没有区别,且动态的了模拟现实中开关按钮,为开发者提供了一个良好的解决方案

举个栗子黑白88
由简入深,下面我们先来了解下 Toggle 组件

附上开关组教程—— Unity 3D UGUI Toggle Group用法教程


2

Create Toggle —— 创建开关组件


强大的 Unity 在降低开发难度的路上,真是越走越远,甩的同行看不见屁股(有点夸张了)

Unity 提供了非常简单的创建 Toggle 方式:


我们只需要右键点击层次列表→ UI Toggle 即可完成创建

( 也可以自己搭建自己的模板,然后挂载 Toggle 组件是一样的 )

运行就可以直接看效果
举个栗子黑白88
这里写图片描述


3

Custom Template —— 可自定义调节模板


如图,可自由调节颜色/自由更换布局或是图片
举个栗子黑白88
这里写图片描述


4

Toggle —— 组件说明


Toggle 组件与 Button 不同之处:

1. Graphic :用来控制 Toggle 开关图片的显示/隐藏

2. IsOn :用来表示 Toggle 开关状态

3. Group :用来表示 Toggle 所属开关组/群(后边会讲到)

其他几乎完全一致
举个栗子黑白88
这里写图片描述


5

OnChangeValue —— 值改变时调用


当我们将需要调用的方法,手动添加到 OnChangeValue

发现跟 Button 一样,每点一下都会调用一次方法
举个栗子黑白88
手动添加监听方法:

using UnityEngine;


/// <summary>
/// Chinar专用测试类
/// </summary>
public class ChinarDemo : MonoBehaviour
{
    /// <summary>
    /// 绑定监听事件方法
    /// </summary>
    public void ListenInFunction()
    {
        print("调用");
    }
}

如果 代码动态添加监听,就无需在界面 OnChangeValue 手动添加

using UnityEngine;
using UnityEngine.UI;


/// <summary>
/// Chinar专用测试类
/// </summary>
public class ChinarDemo : MonoBehaviour
{
    void Start()
    {
        //找到组件,动态添加,Lambda表达式,精简!
        //与手动添加效果一致
        GameObject.Find("Toggle").GetComponent<Toggle>().onValueChanged.AddListener(isOn => print("调用"));
    }
}

运行/测试结果:
这里写图片描述


6

OnChangeValue IsOn —— (开关)控制监听调用


Toggle 组件与 Button 不同之处:

上边说到: IsOn :用来表示 Toggle 开关状态

那么当我们将需要调用的方法,进行开关的逻辑判定,手动添加到 OnChangeValue

就跟 Button 不一样了,不是每次都会调用,具体取决于函数逻辑

注意: IsOn 默认状态,就是运行后 开关按钮(Toggle)的默认状态
举个栗子黑白88
手动添加监听方法:

using UnityEngine;


/// <summary>
/// Chinar专用测试类
/// </summary>
public class ChinarDemo : MonoBehaviour
{
    /// <summary>
    /// 监听方法:可手动/动态绑定
    /// </summary>
    /// <param name="isOn"></param>
    public void OnClick(bool isOn)
    {
        if (isOn)
        {
            print("开");
        }
        else
        {
            print("关");
        }
    }
}

如果 代码动态添加监听,就无需在界面 OnChangeValue 手动添加

using UnityEngine;
using UnityEngine.UI;


/// <summary>
/// Chinar专用测试类
/// </summary>
public class ChinarDemo : MonoBehaviour
{
    void Start()
    {
        //找到组件,动态添加监听,Lambda表达式,精简!
        GameObject.Find("Toggle").GetComponent<Toggle>().onValueChanged.AddListener(isOn => print(isOn ? "开" : "关"));
    }
}

运行/测试结果:
这里写图片描述


7

Attention IsOn/Graphic —— 注意 IsOn!


注意: IsOn 默认状态,就是运行后 开关按钮(Toggle)的默认状态

Graphic:开关替换图片,可根据需求自由设定

IsOn True/False 决定图片是否显示/隐藏
举个栗子黑白88
这里写图片描述
至此:Toggle组件用法教程结束


支持

May Be —— 搞开发,总有一天要做的事!


拥有自己的服务器,无需再找攻略!

Chinar 提供一站式教程,闭眼式创建!

为新手节省宝贵时间,避免采坑!


先点击领取 —— 阿里全产品优惠券 (享受最低优惠)


1 —— 云服务器超全购买流程 (新手必备!)

2 —— 阿里ECS云服务器自定义配置 - 购买教程(新手必备!)

3—— Windows 服务器配置、运行、建站一条龙 !

4 —— Linux 服务器配置、运行、建站一条龙 !



70

技术交流群:806091680 ! Chinar 欢迎你的加入


END

本博客为非营利性个人原创,除部分有明确署名的作品外,所刊登的所有作品的著作权均为本人所拥有,本人保留所有法定权利。违者必究

对于需要复制、转载、链接和传播博客文章或内容的,请及时和本博主进行联系,留言,Email: ichinar@icloud.com

对于经本博主明确授权和许可使用文章及内容的,使用时请注明文章或内容出处并注明网址
>

相关文章
|
4月前
|
C# 图形学
【Unity 3D】元宇宙案例之虚拟地球信息射线实战(附源码、演示视频和步骤 超详细)
【Unity 3D】元宇宙案例之虚拟地球信息射线实战(附源码、演示视频和步骤 超详细)
48 0
|
4月前
|
人工智能 自然语言处理 区块链
【Unity 3D】元宇宙概念、应用前景、价值链等概述
【Unity 3D】元宇宙概念、应用前景、价值链等概述
49 0
|
4月前
|
vr&ar C# 图形学
【Unity 3D】VR飞机拆装后零件说明功能案例实战(附源码和演示视频 超详细)
【Unity 3D】VR飞机拆装后零件说明功能案例实战(附源码和演示视频 超详细)
36 0
|
4月前
|
vr&ar C# 图形学
【Unity 3D】VR飞机动态拆装及引擎开关控制案例(附源码和演示视频 超详细)
【Unity 3D】VR飞机动态拆装及引擎开关控制案例(附源码和演示视频 超详细)
38 0
|
4月前
|
vr&ar 图形学
【Unity 3D】VR飞机起飞喷火游戏案例实战(附源码和演示视频 超详细)
【Unity 3D】VR飞机起飞喷火游戏案例实战(附源码和演示视频 超详细)
48 0
|
4月前
|
vr&ar 开发工具 图形学
【Unity 3D】使用EasyAR实现单图识别的AR增强现实功能(附实现步骤)
【Unity 3D】使用EasyAR实现单图识别的AR增强现实功能(附实现步骤)
83 0
|
4月前
|
图形学
【Unity 3D】3D游戏跑酷小子实战教学(附源码和步骤 超详细)
【Unity 3D】3D游戏跑酷小子实战教学(附源码和步骤 超详细)
79 0
|
4月前
|
搜索推荐 算法 C#
【Unity 3D】C#中冒泡排序、选择排序、插入排序等算法的详解(附源码 超详细)
【Unity 3D】C#中冒泡排序、选择排序、插入排序等算法的详解(附源码 超详细)
46 1
|
4月前
|
开发框架 数据可视化 前端开发
【Unity 3D】GameFramework、QFramework框架简介及应用实战(超详细 附源码)
【Unity 3D】GameFramework、QFramework框架简介及应用实战(超详细 附源码)
119 0
|
4月前
|
数据可视化 安全 定位技术
【Unity 3D】常用插件DOTween、Haste、Exploder、KGFMapSystem介绍(图文解释)
【Unity 3D】常用插件DOTween、Haste、Exploder、KGFMapSystem介绍(图文解释)
43 0