unity Button按钮点击时改变按钮图片样式

菌菌巧乐兹

已于 2024-07-24 15:07:49 修改

阅读量1.1w

点赞数 22

CC 4.0 BY-SA版权

分类专栏： # Unity项目常用知识文章标签： unity

于 2022-09-13 14:31:53 首次发布

本文链接：https://blog.csdn.net/weixin_49427945/article/details/126832786

Unity项目常用知识专栏收录该内容

27 篇文章

订阅专栏

本文详细介绍了在Unity中如何通过编程方式改变按钮的图片。包括点击时临时改变、点击后永久更改以及点击切换两种状态的实现方法，涉及SpriteSwap、脚本控制和按钮叠加隐藏等技巧。

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

一、前言

二、点击时改变图片（点击其他物体时会改回去）

三、点击后永久改变图片样式（永久指你不自己改回来）

1.先做一个按钮

2.准备一个你想换的图片，并把它改成精灵模式

一、前言

本篇文章有三种改变按钮图片的方法。

按钮原来是（如图1所示）

点击的时候，希望它变成（如图2所示）

这里也可以变成其他图片，不光是改变颜色

二、点击时改变图片（点击其他物体时会改回去）

添加Button后，改变设置（如图3所示）

我们要把这个红色的改成 SpriteSwap（如图4所示）

把自己喜欢的图片拖到红色箭头指的那一行，拖进去之后，你点击按钮的时候会直接改变按钮图片样式哦~~~

其他的地方，你们也可以自己拖图片试一下，总之就是不同情况下改变图片。

三、点击后永久改变图片样式（永久指你不自己改回来）

这个是评论区有问，所以加的。

1.先做一个按钮

按钮初始样式（如图5所示）

面板中按钮位置（如图6所示）

按钮的组件（如图7所示）

2.准备一个你想换的图片，并把它改成精灵模式

准备的图片（如图8所示）

3.开始写代码

先把刚刚准备好要替换的图片放到代码里。（如图9所示）

    [SerializeField] Sprite sprite;

把按钮也加在这个代码里。（如图10所示）

    [SerializeField] Sprite sprite;
    [SerializeField] Transform button0;

现在要添加代码，代码的功能是：当点击按钮的时候，把按钮的图片换成图片1。

using System.Collections;
using System.Collections.Generic;
using UnityEngine;
using UnityEngine.UI;

public class ChangeButton : MonoBehaviour
{
    [SerializeField] Sprite sprite;
    //注意这里我声明的是Transform
    [SerializeField] Transform button0;
    
    void Start()
    {
        //我需要在Button组件里面加，所以用GetComponent<Button>()
        //当点击时（onClick）
        //因为我一直要看着，有没有点击，所以加方法叫，监听时（AddListener）
        //最后加入方法ButtonDown
        button0.GetComponent<Button>().onClick.AddListener(ButtonDown);
    }

    void ButtonDown() {
        //我需要改的是图片，所以我需要先获取组件Image，所以用GetComponent<Image>()
        //我需要Image组件里的图片，所以用sprite
        //等号后面的sprite是我第一行加的图片1
        button0.GetComponent<Image>().sprite = sprite;
    }
}