Toggle组件妙用--代替button点击切换图片，不用代码

最新推荐文章于 2024-05-14 20:32:49 发布
最新推荐文章于 2024-05-14 20:32:49 发布
阅读量1k 收藏 6
点赞数 1
分类专栏： Unity 文章标签： unity toggle button
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/fairen/article/details/112988704
版权

如果我们要实现一下功能呢：
在这里插入图片描述
在这里插入图片描述
正常情况下我们把它做成按钮，然后点击就切换背景图片就行

今天发现一个使用toggle直接可以达到目的
将toggle选中图片那个 √ 图片替换成你要的背景，就可以完全模拟，开关切换，并且可以达到醒目的效果，也避免了使用代码控制的冗余以及bug
在这里插入图片描述
其实就是将他的checkmark替换成你想要的背景就行

fairen
关注
  • 1
    点赞
  • 踩
  • 6
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
Android程序:使用ToggleButton，来切换图片
记点小笔记
03-26 3029
ToggleButton:有两种状态的Button（选中和未选中）,可显示为不同的文本或者状态属性： android:checked=”ture” 按钮是否被选中 android：textOff=“关” android：textOn=“开” 则ture显示的是开功能实现：使用ToggleButton，来切换图片layout <ToggleButton android:
初学ToggleButton 点击button，更换button背景图片；再次点击，恢复之前背景图
weixin_30823001的博客
05-26 823
上方的图标，R.drawable.register_checked 是选中图片 下方的图标, R.drawable.register_unchecked 是未选中图片 默认是上方的选中效果。点击button。取消选中；再次点击button。再次选中。 事实上这是两张图片。关键在于图片必须跟着button改变。 一開始想用Button实现...
Unity技术手册-UGUI零基础详细教程-Toggle切换_unity 代码控制shader的toggle值
最新发布
2401_84165953的博客
05-14 1011
重点在Toggle上，可以看到Toggle组件中的Transition和Button中的一样，有四个设置选项（下方有图，重点属性）无、颜色过度、精灵图切换过度、动画过度。将脚本挂载在Toggle Group中，然后给Toggle一和Toggle二添加事件，将Toogle Group拖拽进来，然后方法的传递参数是Toggle自身，如我们上图所示。**On Value Changed（Boolean）：**类似于Button中的On Click，在这里添加事件，可以使得开关被点击的同时触发一些事件。
toggle实现图片切换
{玖}单纯着，幸福着，思考着
09-03 1113
&lt;!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"&gt; &lt;html xmlns="http://www.w3.org/1999/xhtml"&gt; &lt;head&gt; &lt;
unity Toggle动画变换
weixin_44751165的博客
04-24 2704
<--记录一下在开发过程中遇到的一些问题--> 实现目标：想让玩家在三个技能图标中选择一个，魔力值达到相应的值自动释放选择的技能。 解决思路：用ToggleGroup将三个技能放在一起，保证一定有一个是被选中的且其他不会被选中，在被选中的Toggle上添加一个持续性的效果提示玩家选中的是哪一个技能。 出现问题：以下设置在使用的时候点击屏幕其他地方效果会消失，不能达到我想要的目的 解决办法： 添加Image到Toggle组件的子物体下作为isOn变化的图片，将Image拖到.
UGUI Toggle 实现图片切换
weixin_42301988的博客
03-30 787
用Toggle 来实现选中状态一张图片不选中状态另一张图片时，Transition 选择Sprite Swap 会出现IsOn状态下两张图片叠加。解决思路：背景图片IsOn状态时将其alpha值设为0。
用ToggleButton实现图片转换
翻滚吧蛋蛋的成长史
02-04 408
主要：java文件中 1.申明定义ToggleButton和ImageView 2.主类继承OnCheckedChangeListener接口，实现其中的方法 @Override public void onCheckedChanged(CompoundButton buttonView, boolean isChecked) { //实现接口，点击tb时实现的方法，图片的转换
vue-js-toggle-button：Vue.js 2切换开关按钮-简单，漂亮，可自定义
02-06
npm install vue-js-toggle-button --save 进口 导入插件： import ToggleButton from 'vue-js-toggle-button' Vue . use ( ToggleButton ) 要么 导入组件： import { ToggleButton } from 'vue-js-toggle-button...
react-native-button-toggle-group:React Native的动画按钮切换组
05-02
React本机按钮切换组安装npm i --save react-native-button-toggle-group或者yarn add react-native-button-toggle-group用法 import ButtonToggleGroup from 'react-native-button-toggle-group' ;// ...< ...
toggle-button：切换按钮ui组件
02-12
开启，关闭기능（toggle기능）을가지는리스트컴포넌트를。 기능요구사항 。이선택이되었는지안되었는지를다안되었는다。 버튼만切换버튼만다。 기능이미지 방법/방법제풀이방법 npm install运行npm install npm...
paper-toggle-button:材质设计切换按钮
05-08
<纸张切换按钮> 提供了一个ON / OFF开关，用户可以通过... import '@polymer/paper-toggle-button/paper-toggle-button.js' ; </ script > </ head > < body > < paper> < paper> </
Unity图片切换轮播功能
12-06
一个可以在Unity进行图片轮播的demo，只需要给一个texture 2d的图片数组就可以直接用，有多种切换特效
react-styled-toggle:可自定义的切换按钮
04-28
React风格的切换 演示版 安装 yarn add react-styled-toggle 用法 import Toggle from 'react-styled-toggle'; render(){ return <Toggle> } 发展 yarn storybook 建造 yarn build 道具 财产 propType 必需的 默认...
Unity3D UGUI — Toggle（开关/切换）
子不语的博客
12-27 2078
ZAN
Unity UI动效 - Toggle切换动画
当代野生程序猿
02-18 1382
通过代码实现Toggle组件的值切换动画
Unity UI时间交互 Button组件 Toggle组件 Slider组件 InputFiled组件
weixin_30596023的博客
06-19 870
UI的事件交互 Canvas添加 是否忽略Canvas反向的事件操作 遮挡事件的物体（2D物体[精灵片]，3D物体） 遮挡事件的物体所在的渲染层 ...
如何利用ToggleButton切换图片
weixin_34185512的博客
11-15 793
如何利用ToggleButton切换图片java文件 package com.example.administrator.app; import android.app.Activity; import android.os.Bundle; import android.widget.CompoundBut...
Unity之Editor-helpBox-Toggle、Button、Label-十一
lq
12-26 3742
使用Unity编辑器类编辑 helpBox、Toggle、Button、Label 在Editor文件夹下创建脚本 using UnityEngine; using System.Collections; using UnityEditor; [CanEditMultipleObjects] [CustomEditor(typeof(TestS
Unity学习日记（十四） UGUI Toggle长按和Button长按
Bě9oniǎ 的博客
08-01 582
使用延迟函数实现长按Toggle和Button触发事件,以及网上所有用的长按释放的时候触发按钮事件两个都被我整合到一起方便以后使用. LongPressToggle类 using System; using System.Collections; using System.Collections.Generic; using UnityEngine; using UnityEngine.Ev...
unity toggle点击切换图片
03-16
Unity中的Toggle组件可以用来实现点击切换图片的功能。具体步骤如下： 1. 在Unity中创建一个Toggle组件，并将需要切换的图片作为Toggle的背景图片。 2. 在Toggle组件的属性面板中，找到“Transition”选项，将其设置为“Sprite Swap”。 3. 在Toggle组件的属性面板中，找到“Sprites”选项，将其展开，并在“Normal Sprite”和“Pressed Sprite”中分别设置需要切换的图片。 4. 在代码中，可以通过监听Toggle组件的“onValueChanged”事件来实现图片的切换。当Toggle被选中时，显示“Pressed Sprite”中的图片；当Toggle未被选中时，显示“Normal Sprite”中的图片。 示例代码如下： ``` using UnityEngine; using UnityEngine.UI; public class ToggleImageSwitch : MonoBehaviour { public Toggle toggle; public Image image; private Sprite normalSprite; private Sprite pressedSprite; void Start() { normalSprite = toggle.spriteState.disabledSprite; pressedSprite = toggle.spriteState.pressedSprite; toggle.onValueChanged.AddListener(OnToggleValueChanged); } void OnToggleValueChanged(bool isOn) { if (isOn) { image.sprite = pressedSprite; } else { image.sprite = normalSprite; } } } ``` 在上述代码中，我们通过监听Toggle的“onValueChanged”事件来实现图片的切换。当Toggle被选中时，显示“pressedSprite”中的图片；当Toggle未被选中时，显示“normalSprite”中的图片。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值