toggle界面转化（UGUI）

最新推荐文章于 2025-10-16 01:41:21 发布
原创 最新推荐文章于 2025-10-16 01:41:21 发布 · 1k 阅读 · 0 ·
CC 4.0 BY-SA版权
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。

本文详细介绍了如何在Unity中通过新建一个Image组件并添加ToggleGroup，然后创建多个子Image，每个子Image绑定ToggleScript，实现类似多选框的单选效果。最后，通过Canvas下的Empty对象绑定子Image，完成触发事件的功能。

右键UI -> image，一个是背景，一个是背景框，如图：


接下来就做toggle的部分了，toggle就是在多选框里单选一个，如图：


在这里我们要仿照toggle的效果来做一个升级版的toggle，做法如下：

新建立一个image命名为my，material看自己啦，然后add component加 toggle group

在my下建立三个子本，分别是one1，one2，one3，性质都是image，同样材质自己选，在这三个image的inspector中都要加toggle script，如图：


接下来就准备进行触发事件了，在canvas下create empty三个对象，位置都是一样的，直接Ctrl+D就OK


然后One2对于GameObject 1,one3对于GameObject2，绑定后就OK

链接为：http://download.youkuaiyun.com/my

【Unity3D-UGUI系列】（一）Canvas 画布组件详解
优快云博客专家，Unity3D高级软件工程师，《Unity 3D从入门到实战》作者。
08-26 1万+
推荐阅读 优快云主页 GitHub开源地址 Unity3D插件分享 简书地址 我的个人博客 QQ群：1040082875   大家好，我是佛系工程师☆恬静的小魔龙☆，不定时更新Unity开发技巧，觉得有用记得一键三连哦。 很早就想分享这个系列的文章，但是总是没有机会，最近就将这个系列整理一下，大家一起学习交流。 一、前言 首先，介绍一个UGUI，NGUI是UGUI的前身，Unity开发团队将NGUI的开发团队收到自己开发团队下，并且由此开发了UGUI。 UGUI系统是从Unity 4.6版本后才开.
UGUI源码之Toggle组件
weixin_40097554的博客
12-08 885
最近在像往常一样使用Toggle组件的时候，遇到一个问题：之前一直认为toggle组件是控制对象显示和隐藏从而实现单选的效果。然后那天一不小心将toggle组件控制的对象给手动隐藏掉了，然后发现改变toggle的IsOn属性无法达到单选的效果。接着就引发了思考，原来之前的理解是错误的。于是看了一下UGUI的源码是怎么实现的。 先来看下自己测试的结构： 然后说下其中的几个方法： 这个方法里面m_Group代表的就是我们测试的结构第二张图里面Toggle组件下绑定的Group，它是一个挂载了Tog
Unity中UGUI的Toggle控件
blanrey的博客
08-29 2万+
Toggle控件
UGUI组合控件之Toggle开关控件
最新发布
x032313的博客
10-16 837
Toggle;开关组件，是UGUI中用于处理玩家单选框多选框功能交互的组件，开关组件默认是多选框，可以通过配合ToggleGroup组件制作为单选框。
UGUI Butten按钮私有调用方法进行界面跳转，保存原有的场景事件，再跳转场景时，依旧可以使用。
m0_71624363的博客
03-07 244
UGUI
[UGUI基础]Toggle
鳄鱼泪的博客
11-13 4767
Toggle：单选框；开关可以将多个Toggle按钮加入一个组，则他们之间只能有一个处于选中状态（Toggle Group上Allow Switch Off设为false）。Toggle和Button类似，只是Toggle有一个开和关的状态。1.Toggle组件，面板上初始为：Interactable：是否可以点击交互 Transition：不同状态间的切换显示 IsOn：开关的开或关状态 G
ugui换装界面
u011644138的博客
08-12 287
Image Color颜色      Material 材质      Raycast Target 射线投靶 bool      Image Type 图片类型              simple 简单的                      preserve aspect 保持原有尺寸不变             sliced刨切的固定外边不变里边随意拉出       ...
UGUI 官方资源包
11-16
UGUI，全称为Unity Graphical User Interface，是Unity引擎中的一个图形用户界面系统，自Unity 4.6版本起被引入。它为开发者提供了一套高效、可扩展且灵活的工具，用于创建丰富的2D和3D交互界面。UGUI官方资源包是一...
Unity-Technologies-ui_Ugui_unity
09-11
Unity Technologies的UGUI（Unity Graphic User Interface）是Unity引擎中一套强大的UI系统，自Unity 4.6版本引入，为游戏开发者提供了构建丰富且交互性强的用户界面的能力。UGUI的出现极大地简化了游戏内界面的创建...
UGUI官方资源包：Unity新手免费入门指南
通过官方资源包的学习，新手开发者可以更加高效地掌握UGUI的基本概念和操作流程，从而更快地将创意转化为实际的项目内容。此外，官方资源包经常更新，以反映UGUI系统的最新特性和最佳实践。 ### 学习建议 对于希望...
深入理解Unity UGUI的事件系统与交互设计
在Unity游戏开发中，UGUI（Unity GUI）是一套用于构建用户界面的工具，它提供了丰富的交互组件和事件系统来实现用户与游戏对象之间的交互。UGUI事件系统通过注册和响应事件的方式，实现了用户输入的处理和游戏逻辑的...
Unity3D 11-SceneManager场景管理用法总结
Try My Best！
07-04 5万+
一、Unity关卡Unity 使用过程中关卡加载和卸载是大多数三维引擎都要提供的基本功能。 因为关卡切换在游戏中非常常用。 在之前的版本中Unity的关卡切换使用的是：Application.loadedLevel()；看看Application类，此时这个类的功能比较繁杂，比较多。只看与关卡相关的： [Obsolete("Use SceneManager.LoadScene")]
Unity开发之 UGUI手游界面返回上一层
qq_33657132的博客
04-15 4926
一谈到返回上一层，我们首先想到的自然是用栈来存放已经打开的所有Panel。（涉及到先进先出） 而在打开背包时，想要把某个Panel（比如背包层界面）放入栈中，自然会涉及到如何监测到这个界面的打开操作。 在手机上监测，那肯定是监测触摸，所以我是用了UGUI中的eventsystem。然后使用UGUI中自带的OnPointerDown方法监测所点击的物体。 但在这个过程中，出现一个重大问题。除了
Unity UI 窗口切换
weixin_43778515的博客
03-20 5482
Unity UI 窗口切换 ``` using UnityEngine; using System.Collections; public class PanelManager : MonoBehaviour { private GameObject oldPanel; // Use this for initialization void Start () { } ...
【Unity3D】场景切换、UGUI组件事件、开始游戏与关闭游戏
热门推荐
编程记录，亲测有效
04-15 5万+
在《【Unity3D】公告栏与开始界面的布置》（点击打开链接）我曾经简单地提到UGUI是怎么布置与使用的，但这根本不完整，就像单身狗缺个另一半永远只能被喂狗粮似的，组件也因为事件的存在才能够精彩。因此，UGUI的事件设置也是很重要的，下面举个例子来说明，Unity3D中如何进行场景切换、UGUI组件事件、开始游戏与关闭游戏的。如下图所示： 我们将设置2个场景，其中一个场景极其简单，只有“
Unity3D ugui 界面状态控制
把理性与逻辑灌入电光石火奔腾流淌的指令集……
06-19 2582
在UI界面制作过程中，一些复杂的界面功能，常常会有不同状态和结果的展现。比如，选项卡，物品道具的状态信息，不同的描述信息和图片等。通常的处理方法，是用代码在不同的状态下，控制不同元素的可见性。但具体到Unity里，利用GameObject的可视化编辑，可以把不同的界面状态通过编辑器的配置来完成，这样代码只需要一句话状态切换就可以完成繁琐的界面元素控制。 public class Game
【Unity3D】UGUI向导式界面和组件复用
编程记录，亲测有效
08-21 1763
如下图： 为了达到不设置这么多个输入框InputField和确定、取消按钮的目的，实现组件复用，并且指导用户完成一行行的输入。因此设置了这个所谓的向导式界面。 整个界面的布置非常简单，如下图所示。布置好之后，同时将各个组件命名，便于在脚本中控制。 至于向导的白色箭头1.png，是一张在Photoshop空白背景下，画的白色箭头。如下图所示，在Rawimage的Texture选
Unity--互动组件（Toggle）
爱编程的鱼的博客
11-14 4347
1.组件的可交互2.组件的过渡状态3.组件的导航4.Toggle的属性和参数设置Toggle 切换控制是一个复选框，允许用户打开或关闭的一个选项；”Toggle的属性和参数：“”Is on：（无”淡入淡出”Graphic:：（图形化）Group：（组）如果有 toggle,则属于toggle 组“”组件的过渡状态：“”组件的几种过渡效果：Target Graphic：（图形目标）Normal Color：（正常颜色）Highlighted Color：（高亮显示的颜色）
UGUI 整个界面的淡入淡出效果
weixin_30735391的博客
01-01 522
以前用NGUI做界面，想让整个界面淡入淡出，可以直接改UIPanel组件的Alpha属性即可更改整个界面的透明度。那在UGUI中呢？有些同学可能想到了，像Text，Image这些组件都有继承Graphic类，这个类提供了CrossFadeAlpha()方法，可以做透明度渐变。但如果界面东西多了，要获取每个Graphic是挺麻烦了。其实还有一个很简便的方法，用起来跟NGUI差不多。就是Canv...
unity ugui toggle
01-21
### Unity UGUI Toggle 组件使用教程 #### Toggle 基本概念 Toggle 是一种用户界面 (UI) 控件，允许用户通过点击来切换某个状态的开启或关闭。这种控件通常用于表示二元选项的选择情况，在图形界面上表现为一个带有标签的小方框，可以被选中或取消选中。 #### 创建 Toggle 控件 在 Unity 中可以通过拖拽预制体到场景视图快速创建 Toggle 或者直接右键单击 Hierarchy 面板中的空白处并选择 UI -> Toggle 来新建实例[^1]。 #### 主要属性解释 - **Transitions**: 定义当交互发生时如何改变视觉效果；支持颜色渐变、动画剪辑以及精灵交换三种方式。 - **Graphic**: 设置此字段可指定哪个图像元素应该响应过渡变化，默认情况下指向内部的 Checkmark 对象。 - **OnValueChanged**: 当切换状态发生变化触发事件列表，开发者可以在脚本里订阅这些回调函数以便执行自定义逻辑处理。 - **Is On**: 表明当前是否处于激活态(true/false)，可通过编程手段读取或修改这个布尔变量从而实现动态控制开关行为[^2]。 #### 编程操作示例 下面给出一段简单的 C# 脚本来展示怎样监听 Toggle 的值变更： ```csharp using UnityEngine; using UnityEngine.UI; public class Example : MonoBehaviour { public Toggle myToggle; // 将其连接至 Inspector 上对应的组件 void Start() { if(myToggle != null){ myToggle.onValueChanged.AddListener(OnChange); } } private void OnDestroy(){ if(myToggle != null){ myToggle.onValueChanged.RemoveListener(OnChange); } } void OnChange(bool isOn){ Debug.Log($"The toggle state has changed to {isOn}"); } } ```
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值