유니티 - 롱 클릭 progress bar 처리하기

Unity 전체 링크

 

참고

- 롱 클릭 구현하기

 

유니티 long click을 구현하였으니, 얼마나 오랫동안 클릭해야 하는지 progress bar로 보여주도록 하자.

 

먼저 Canvas를 만들고 Image에 적당한 원 이미지를 입힌다.

그리고 Image Type을 Filled로 Fill Method는 Radial 360으로 변경한다.

---

아래와 같이 카메라에 Image가 나온 것을 확인할 수 있다.

이미지의 Scale은 게임 오브젝트에 적당히 맞추면 된다.

 

Image를 사용하기 위해 UI를 선언한다.

using UnityEngine.UI;

 

progress bar가 게임 오브젝트를 따라다니게 하기 위해 GameObject로 선언하고,

Start를 할 때, Image를 progressBar에서 얻는다.

클릭 이벤트를 시작할 때는 progressBar의 fillAmount가 0이고 종료 후에도 원래대로 돌아가야 하므로 0이 된다.

    public GameObject progressBar;
    private Image barImage;

    public void OnMouseDown()
    {
        isClicked = true;
        barImage.fillAmount = 0.0f;
    }

    public void OnMouseUp()
    {
        isClicked = false;
        isLongClick = false;
        barImage.fillAmount = 0.0f;
        elapsedTime = 0.0f;
    }

    private void Start()
    {
        barImage = progressBar.GetComponent<Image>();
        barImage.fillAmount = 0.0f;
    }

 

클릭된 상태에서, progressBar를 오브젝트를 따라 움직이도록 한다.

progressBar는 UI이기 때문에 카메라 → 월드 좌표 전환이 필요하다.

 

그리고 isLongClick이 true로 판단되기 전까지, barImage를 계산한다.

 

(1.0f - (longClickTime - elapsedTime) / longClickTime)에 의해

경과시간이 0이면 0, longClickTime = elapsedTime 이면 1이 채워진다.

    void Update()
    {
        if (isClicked)
        {
            progressBar.transform.position = Camera.main.WorldToScreenPoint(transform.position);

            elapsedTime += Time.deltaTime;

            if (longClickTime < elapsedTime)
            {
                isLongClick = true;
            }

            if (isLongClick == false)
            {
                barImage.fillAmount = (1.0f - (longClickTime - elapsedTime) / longClickTime);
            }
        }

        if (isLongClick) Debug.Log("long click");
    }

 

스크립트를 실행하면 아래처럼 얼마나 오랫동안 클릭을 해야 하는지 알 수 있다.

 

전체 코드는 아래와 같다.

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

public class LongClickTest : MonoBehaviour
{
    private float elapsedTime = 0.0f;
    private float longClickTime = 2.0f;
    private bool isClicked = false;
    private bool isLongClick = false;

    public GameObject progressBar;
    private Image barImage;

    public void OnMouseDown()
    {
        isClicked = true;
        barImage.fillAmount = 0.0f;
    }

    public void OnMouseUp()
    {
        isClicked = false;
        isLongClick = false;
        barImage.fillAmount = 0.0f;
        elapsedTime = 0.0f;
    }

    private void Start()
    {
        barImage = progressBar.GetComponent<Image>();
        barImage.fillAmount = 0.0f;
    }

    void Update()
    {
        if (isClicked)
        {
            progressBar.transform.position = Camera.main.WorldToScreenPoint(transform.position);

            elapsedTime += Time.deltaTime;

            if (longClickTime < elapsedTime)
            {
                isLongClick = true;
            }

            if (isLongClick == false)
            {
                barImage.fillAmount = (1.0f - (longClickTime - elapsedTime) / longClickTime);
            }
        }

        if (isLongClick) Debug.Log("long click");
    }
}

 

Unity Plus:

Easy 2D, 3D, VR, & AR software for cross-platform development of games and mobile apps. - Unity Store

 

Unity Pro:

Unity Pro

 

Unity 프리미엄 학습:

Unity Learn