首先,我们要魔改后实现如下效果
![](https://i-blog.csdnimg.cn/blog_migrate/f3ab10d876302057dc8df8b9f06e414f.png)
image.png
默认的样式可能不适合正常的场景,
默认的toggle在层级视图中会包含如下组件,Background,Checkmark,Label
![](https://i-blog.csdnimg.cn/blog_migrate/2f6f083a07e0d14a46e806540f2372ba.png)
image.png
在检查器中可以看到多了一个Toggle,也就是说要自定义集成toggle则需要继承Toggle实现。
并且目标图形已经指定好了Background, 代表了未选中颜色
checkmark代表选中颜色,
![](https://i-blog.csdnimg.cn/blog_migrate/e42153a14174267308883877e465bf8a.png)
image.png
可以通过清除图形选择none,只设置颜色
![](https://i-blog.csdnimg.cn/blog_migrate/a0c34d9bbe2fbd0ebd888e27caca7bb3.png)
image.png
这里能实现上面的样子,但是文字颜色却无法修改,修改文字颜色方式也多种多样,这里采用干掉默认的toggle然后替换成自己的toggle,
using System.Collections;
using System.Collections.Generic;
using UnityEngine;
using UnityEngine.EventSystems;
using UnityEngine.UI;
namespace UnityEngine.UI
{
public class ToggleExtend : Toggle
{
/* public int colorInt2;
[Header("TextColor")]*/
[SerializeField]
[Tooltip("checkText")]
public Text text;
[SerializeField]
[Tooltip("textCheckColor")]
private Color textCheckColor;
[Tooltip("unCheckColor default use current color")]
public Color normalColor;
private void OnValueChange(bool isOn)
{
print("oncheck ison:" + isOn);
//这里根据isOn做修改
if (textCheckColor != null)
{
text.color = isOn ? textCheckColor : normalColor;// textCheckColor : normalColor;
}
}
protected override void Start()
{
base.Start();
if (this.text != null)
{
if (normalColor == null)
{
this.normalColor = text.color;
}
this.onValueChanged.AddListener(OnValueChange);
}
/* this.onValueChanged.AddListener(delegate {
});*/
//this.group.
//ToggleValueChanged(m_Toggle);
}
protected override void OnDestroy()
{
onValueChanged.RemoveListener(OnValueChange);
base.OnDestroy();
}
}
}
写完之后,替换之前的toggle,变成了如下
![](https://i-blog.csdnimg.cn/blog_migrate/e5dc2b49bd67ce78fc91d6c0be1214f0.png)
image.png
但是public和序列化并没有显示,原因是编辑器识别到并非继承Mono的情况下默认不会显示自定义的字段??
新建一个类
using UnityEditor;
using UnityEngine.UI;
[CustomEditor(typeof(ToggleExtend), false)]
public class MyToggleEditor : Editor
{
}
在注解这里指定ToggleExtend
就ok了,
然后再一次替换 , 其中源图像就是 checkmark对应,
目标图像,则是把Background拖动过去。
![](https://i-blog.csdnimg.cn/blog_migrate/1024cef72bbb2332f67f520bc0cfa89a.png)
image.png
另外补充一点,
normalColor 正常文本的颜色 默认选中项目必须设置,其他的可不用设置,会自动识别之前并没有设置好的,这和其它开发不一样,但是也只能这么理解。
我在写代码中发现一个问题,代码设置的红色,运行之前编辑器显示的并非红色,运行后就把编辑器变成红色了,无语的是退出编辑器依然是红色,这。。。