본문 바로가기
유니티게임만들기

[유니티]초간단 버튼클릭으로 랜덤 이미지 바꾸기

by 택형. 2023. 12. 3.
반응형

버튼을 클릭하면 다른 이미지로 변경되는 방법을 간단하게 알려드리겠습니다.

일단 버튼을 하나 만들어주세요. 그리고 적당한 위치에 버튼을 놓아줍니다.

빈 오브젝트를 하나 만들어줍니다. 이름은 Images로 하겠습니다. 이 Images에 이미지들을 나타낼 겁니다.

나타낼 이미지들을 준비합시다. 간단하게 3개만 준비했는데, 이미지는 순서대로 숫자로 이름을 바꿔 줍시다.

그리고 이미지를 전부 선택해줍니다.

 

인스펙터창에 Texture Type를 Sprite(2D and UI)로 바꿔주고 인스펙터 맨 밑에 Apply버튼을 눌러 적용시켜줍니다.

Images 오브젝트를 클릭 ->인스펙터 창에 Add Component를 누르고 Sprite Renderer를 입력해서 Sprite Renderer 클릭해 줍니다.

sprite Renderer 메뉴가생겼는데, sprite 부분의 none에 1이미지를 넣어주세요.

이렇게하면 이미지가 나와야 하는데...플레이 화면엔 여전히 이미지가 뜨지 않다면, 이미지 위치가 카메라 밖에 있어서 그런겁니다. 이미지 위치를 바꿔주세요.

 
 

Images오브젝트의 인스펙터의 Transform의 Position을 0으로 해주면 보일 겁니다. (그래도 안보인다면 카메라 위치를 바꿔줘야 해요.)

이제 이미지를 바꾸는 기능을 스크립트로 만들어 줘야 합니다.

새 스크립트를 만들고 이름을 RandomImages로 바꿔준 후 스크립트편집기를 실행시켜 줍니다.

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

public class RandomImages : MonoBehaviour
{
    public Sprite[] sprites; // 랜덤 숫자에 해당하는 이미지를 저장할 배열

    public void RandomNumber()
    {
        int randomNumber = Random.Range(1, 4); // 랜덤 숫자 생성
        Debug.Log("랜덤 숫자: " + randomNumber);

        // 랜덤 숫자에 해당하는 이미지를 찾아서 출력
        GetComponent<SpriteRenderer>().sprite = sprites[randomNumber - 1];
    }
}

위에 코드처럼 작성해주시면 됩니다. 주의하실 점은 Random.Range(1, 4); // 랜덤 숫자 생성 이부분인데, 이미지갯수 +1를 해줘야 합니다.

이미지가 4개면 Random.Range(1, 5), 5개면 Random.Range(1, 6)..

스크립트 작성을 마쳤다면 저장하고 다시 유니티로 넘어갑니다.

이제 재료 준비는 다 끝났습니다.

Images오브젝트 인스펙터 끝부분 Add Component부분에 작성한 RandomImages 스크립트를 드래그 앤 드롭으로 추가시켜줍니다.

인스펙터에 Random Images 메뉴가추가 되었는데, Sprites 부분에 이미기 만큼 숫자를 써주고 Element부분에 숫자순으로 이미지들을 넣어줍니다.

이번엔 Button오브젝트를 선택해줍니다. Button오브젝트의 인스펙터 On Click부분의 +버튼을 클릭해줍니다.

Images오브젝트를 드래그 앤 드롭으로 None부분에 넣어줍니다.

no Function 클릭 ->RandomImages -> RandomNumber를 클릭해줍니다.

이렇게 하면 다 된겁니다. 플레이로 테스트를 해보세요,

버튼을 클릭하면 콘솔 부분에 랜던한 숫자가 표시되고, 표시된 숫자에 맞는 이미지가 플레이 화면에 출력이 됩니다.

↓ 영상도 있으니 한번 봐주세요.ㅎ

https://youtu.be/8CeiO83WhfY

 

 

반응형

댓글