Unity 숫자가 증가하는 버튼 만들어보기

오늘 게시물은 유니티 기초 과정을 포함하고 있습니다

 

 

일단 유니티 버전은 아무거나 하세요

개인적으로 너무 새 버전은 추천하지 않습니다ㅋㅋ

2D, 3D 상관 없습니다

 

하지만 2D에서는 3D를 못 다루지만

3D에서는 2D를 다룰 수 있기에

많은 분들이 3D를 선택합니다

 

물론 전 2D로 만들어주겠습니다

 

 

프로젝트를 만들고 기다리는 동안

필요한 Module이 설치 되어있는지 확인해주세요

Unity Hub -> 설치에 들어가서

톱니바퀴 버튼을 누르면 됩니다

 

 

다른건 별로 필요 없는데

Android 빌드를 위해서는

Android Module은 꼭 필요합니다

 

 

프로젝트가 생성되면 이런 모습입니다

 

 

UI Tool 배치를 위해서는 Canvas가 필요합니다

Hierachy에서 우클릭 후 Canvas를 생성합니다

 

 

Canvas를 생성하면 뭔가 되게

비정상적으로 커보이는 뭔가가 나오는데

당황하지 마시고

 

 

Canvas의 Render Mode를

Screen Space - Camera로 변경해주시고

밑에 Main Camera를 드래그 해주세요

 

그럼 Canvas가 Camera Size에 맞게 줄어듭니다

 

 

Main Camera를 클릭하면

Background Color를 변경할 수 있습니다

 

전 저 파란색 너무 지겨워서

그냥 검은색으로 바꿔줬습니다

 

근데 분명 Background가 파란색인데

지금 보이는 화면은 회색 같죠??

 

 

그건 Game 화면의 Background Color이기 때문입니다

Scene에서는 주로 화면에 들어가는 요소들을 수정하고

Game에서는 실제 보이는 모습들을 확인할 수 있습니다

 

https://docs.unity3d.com/kr/560/Manual/CreatingScenes.html

씬(Scenes) - Unity 매뉴얼

 

 

이제 숫자를 표시해줄 Text를 추가해주겠습니다

2021 이전 버전은 왼쪽, 이후 버전은 오른쪽을 참고하세요

 

 

여기서 Text의 설정을 변경할 수 있습니다

Text가 너무 작은 것 같아서 크기를 키워줬습니다

 

근데 뭐지 사이즈 늘리니까 Text가 사라짐;;;;;;

 

 

그럴 때도 당황하지 말고

OverFlow 설정을 변경해주세요

 

현재 영역보다 글씨가 커서

삐져나가도 됨? 안됨?을 설정해준겁니다

 

https://docs.unity3d.com/kr/current/Manual/script-Text.html

텍스트 - Unity 매뉴얼

 

2021 이전 버전은 위 이미지를 참고하세요

 

같은 방법으로 버튼도 하나 생성해줍니다

 

 

체크한 부분을 우클릭 해서

C# 스크립트 하나 작성해주겠습니다

 

 

C# 스크립트를 작성하기 전에

위에 저렇게 작성해주세요(꼭)

 

저게 없으면 UI 요소 관련

코드를 작성할 수 없습니다

 

저는 UIManager라고 지어줬습니다

 

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

public class UIManager : MonoBehaviour
{
    [SerializeField] private Text countText; // UI 캔버스에 있던 숫자 Text 입니다
    [SerializeField] private Button countButton; // UI 캔버스에 있던 버튼입니다

    private int count;

    // Start is called before the first frame update
    void Start()
    {
        count = 0;  // 버튼을 누를 때마다 증가될 숫자입니다 0으로 초기화 했습니다
        countText.text = count.ToString(); // 초기 count 값을 UI에 반영합니다
        countButton.onClick.AddListener(CountNumber); // 버튼 클릭 이벤트에 CountNumber 메서드를 추가합니다
    }

    private void CountNumber()
    {
        count++;
        countText.text = count.ToString(); // count 값을 문자열로 변환하여 Text에 할당합니다
    }
}

 

주석에 설명을 달긴 했는데

방금 만든 Text와 Button을 선언해줍니다

 

여기서 countText와 countButton은 제가

지은 변수명입니다 마음대로 지으세요

 

https://docs.unity3d.com/ScriptReference/SerializeField.html

Unity - Scripting API: SerializeField

 

 

countButton.onClick.AddListener(CountNumber);

 

Start에 보면 이런 내용이 있는데요

onClick은 버튼을 클릭 했을 때

AddListener는 원하는 기능을 연결하는 역할을 합니다

 

https://docs.unity3d.com/kr/530/ScriptReference/UI.Button-onClick.html

UI.Button-onClick - Unity 스크립팅 API

 

countText.text = count.ToString();

 

count는 int(정수) text는 String형이기에

int형을 String으로 변환하기 위해

ToString()을 사용했습니다

 

https://docs.unity3d.com/ScriptReference/Object.ToString.html

Unity - Scripting API: Object.ToString

 

 

 

Script 저장 후 다시 유니티로 돌아와서

만든 Script를 클릭한 상태로

저렇게 Drag 해주거나

 

저기 보이는 Add Component를 눌러서

방금 만든 Component를 검색합니다

 

 

그럼 누가봐도 방금 만든 Text와

Button이 들어갈 공간이 보이는데요

이것도 클릭 후 드래그 해주거나

오른쪽 버튼을 눌러서 할당해주면 됩니다

 

 

 

위의 버튼을 눌러 실행시켜보겠습니다

 

버튼 클릭 횟수만큼 숫자가 잘 증가한걸 확인했습니다

 

 

이제 원하는 기능을 만들었으니

핸드폰으로도 실행해보겠습니다

(안드로이드만 가능합니다!!)

 

File -> Build Setting에 들어가주세요

 

 

그럼 왼쪽과 같은 화면이 나오게 되는데

저거는 PC 프로그램 빌드용이라

저 상태로 Build 버튼을 클릭하면

exe 파일이 나오게 됩니다

 

Android 버튼 클릭 후

Switch Platform 버튼 클릭해주세요

(Android Module 필요함)

 

 

Switch Platform이 완료되면

Build 버튼을 클릭해줍니다

 

그럼 Apk 파일이 나오게 되는데

파일이 무겁지 않으니

메일로 보내도 됩니다

 

 

Unity build 중에 잠깐 핸드폰을 켜주세요

삼성 개발자 설정이 되어있다면

넘어가도 됩니다

 

설정 -> 휴대전화 정보 -> 소프트웨어 정보로

들어가주세요

 

 

이미지처럼 빌드번호를 7번이었나..

3번 클릭하면 개발자 모드가 설정됩니다

 

한지 너무 오래돼서 잘 기억 안남ㅠㅠ

 

https://r1.community.samsung.com/t5/%EA%B0%A4%EB%9F%AD%EC%8B%9C-a-j-%EB%85%B8%ED%8A%B8/tip-%EC%95%8C%EC%95%84%EB%91%90%EB%A9%B4-%EC%93%B8%EB%AA%A8%EC%9E%88%EB%8A%94-%EA%B0%9C%EB%B0%9C%EC%9E%90-%EC%98%B5%EC%85%98-5%EA%B0%80%EC%A7%80-%EA%B8%B0%EB%8A%A5%EC%9D%84-%EC%86%8C%EA%B0%9C%ED%95%A9%EB%8B%88%EB%8B%A4/td-p/17135644

[Tip] 알아두면 쓸모있는 개발자 옵션 5가지 기능을 소개합니다~!

 

버튼이 너무 작네요 Canvas에서 키울걸ㅋㅋㅋ

 

개발자 모드 설정 후

설치한 Apk를 실행해봤습니다

 

버튼이 너무 작은 이슈가 있었지만

누르는데 크게 문제는 없었습니다

 

저는 내일도 출근해야돼서

질문은 퇴근 후 받겠습니다

 

 

 

 

욕은 오빠한테 하시길