[Unity-12] 切换Button的图片

本文介绍如何使用Unity实现按钮图片的动态切换,通过编写C#脚本控制按钮在两种状态(开始与暂停)间的图片变化。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

我们来做一个按钮的图片切换。

功能,就像播放器的“开始”和“暂停”。


编写TestButton.cs脚本:

[csharp]  view plain copy 在CODE上查看代码片 派生到我的代码片
  1. using UnityEngine;  
  2. using System.Collections;  
  3.   
  4. public class TestButton : MonoBehaviour {  
  5.     protected bool switchFlag = true;  
  6.   
  7.     // Use this for initialization  
  8.     void Start () {  
  9.       
  10.     }  
  11.   
  12.     void OnClick () {  
  13.         if (this.switchFlag) {  
  14.             this.GetComponent<UISprite> ().spriteName = "pause";  
  15.             this.GetComponent<UIButton> ().normalSprite = "pause";  
  16.             this.switchFlag = false;  
  17.         }  
  18.         else{  
  19.             this.GetComponent<UISprite>().spriteName = "start";  
  20.             this.GetComponent<UIButton>().normalSprite = "start";  
  21.             this.switchFlag = true;  
  22.         }  
  23.     }  
  24. }  

将脚本挂在simple button上


然后,运行:运行效果如下:

点击后,出现暂停按钮。


body { padding: 0; margin: 0 } #unity-container { position: absolute } #unity-container.unity-desktop { left: 50%; top: 50%; transform: translate(-50%, -50%) } #unity-container.unity-mobile { position: fixed; width: 100%; height: 100% } #unity-canvas { background: {{{ BACKGROUND_COLOR }}} } .unity-mobile #unity-canvas { width: 100%; height: 100% } #unity-loading-bar { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); display: none } #unity-logo { width: 500px; height:600px; background: url(''logo.png'') no-repeat center } #unity-progress-bar-empty { width: 141px; height: 18px; margin-top: 10px; margin-left: 6.5px; background: url('progress-bar-empty-{{{ SPLASH_SCREEN_STYLE.toLowerCase() }}}.png') no-repeat center } #unity-progress-bar-full { width: 0%; height: 18px; margin-top: 10px; background: url('progress-bar-full-{{{ SPLASH_SCREEN_STYLE.toLowerCase() }}}.png') no-repeat center } #unity-footer { position: relative } .unity-mobile #unity-footer { display: none } #unity-webgl-logo { float:left; width: 500px; height: 100px; background: url('logo.png') no-repeat center } #unity-build-title { float: right; margin-right: 10px; line-height: 38px; font-family: arial; font-size: 18px } #unity-fullscreen-button { cursor:pointer; float: right; width: 38px; height: 38px; background: url('fullscreen-button.png') no-repeat center } #unity-warning { position: absolute; left: 50%; top: 5%; transform: translate(-50%); background: white; padding: 10px; display: none } 做自适应全屏显示 修改进度条长度和logo图片 进度条自适应 留个修改进度条图片和logo图片的地方
最新发布
08-08
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值