Toggle:选项组件(单选框,多选框),功能和button差不多,有时候我们会用Toggle组件代替Button组件;
Toggle组件与Toggle Group组件:经常成对出现;
toggle Group与Toggle属于父子关系,Toggle常作为Toggle Group组件的子物体,从来来实现单选和多选的效果 。
1、Toggle组件:首先我们在Panel下新建空物体GameObject,改名为Toggle Group;
选中Toggle Group,右击在UI里添加Toggle组件,如图:
2、展开Toggle组件,我们发现,他包含有两个image组件和一个Label(文本输入框)【Text】组件;
Background:背景图片,控制toggle组件的背景颜色改变,从而展示此物体是否被选中的效果;
Checkmark:就是我们界面看到的对号勾选框,对号图片可以替换,也可以删除不用。
Label:text组件:文本输出框,我们可以在这里输入文字,说明这个Toggle的作用或名称;
3、下面我们来看Toggle的菜单:
前面讲过的不再重复;
大多数菜单功能与Button类同;
Is On:用来表示Toggle当前开关状态,勾选为开;
Graphic:控制Toggle组件开关图片的显示隐藏,默认选取Checkmark;
Group:这里放Toggle属于的开关组,在下面的Toggle Group中详细讲。
4、Toggle:的添加事件:
using System.Collections;
using System.Collections.Generic;
using UnityEngine;
using UnityEngine.UI;
public class ToggleConllter : MonoBehaviour
{
private Toggle toggle;//注册toggle组件
// Start is called before the first frame update
void Start()
{
//获取Toggle组件
toggle = gameObject.GetComponent<Toggle>();
//绑定按钮点击事件
toggle.onValueChanged.AddListener(ison => print(ison?"开":"关")) ;
}
// Update is called once per frame
void Update()
{
}
}
5、Toggle Group
(1)在空物体上,如上图,添加Toggle Group组件;
(2)
下面我们来简单介绍一下Toggle Group组件;
非常的简单,可以看到只有一个选项框:
Allow Switch Off:如果Allow Switch Off处于选中状态,表示该物体所有带有Toggle组件的子物体可以有一个被选中,也可以都不被选中(即:零选择);
如果没有勾选Allow Switch off:则表示该物体所有带有Toggle组件的子物体,有切仅有一个处于选中状态。(3)那么具体要怎么做呢?
这时我们要结合上面Toggle的预留问题:Group
当我们的父物体上有Toggle Group组件且该物体的子物体上有Toggle组件时;
我们就可以建立一个按钮组,用来控制所有Toggle组件的选择;
具体操作:
选中所有含有Toggle组件的子物体,在子物体的Toggle菜单栏上找到Group栏,把父物体拖拽添加到个Group:如图所示:
这样便实现了按钮组的操作。
我简单写了一个Toggle Group类的控制方法:大家可以参考一下。
using System.Collections;
using System.Collections.Generic;
using System.Linq;
using UnityEngine;
using UnityEngine.UI;
public class ToggleGroupControl : MonoBehaviour
{
/// <summary>
/// 建立Toggle列表,存取所有的Toggle,便于调用操作
/// </summary>
[SerializeField] List<Toggle> ToggleList = new List<Toggle>();
// Start is called before the first frame update
void Start()
{
//给list赋值
ToggleList = transform.GetComponentsInChildren<Toggle>().ToList();
//遍历Toggle Group下的所有Toggle
for (int i = 0; i < ToggleList.Count; i++)
{
var toggle = ToggleList[i];
var a = i;
//绑定Toggle事件
toggle.onValueChanged.AddListener(delegate (bool ison)
{
this.OnValueChanged(ison, a);
});
}
}
// Update is called once per frame
void Update()
{
}
public void OnValueChanged(bool ison, int value)
{
if (ison)
{
print("执行你的选中方法");
}
}
}