(유니티) UI스킬 쿨타임 표시 - 옵저버 패턴

티원·2025년 11월 1일

유니티 반투명 스킬 이미지 만드는법

0.5초마다 쿨타임정보를 UI에 코루틴으로 표시.
왼쪽은 3초 , 오른쪽은 5초 스킬
UI에서 흰색으로 쿨타임 점점 표시되는 것은 위의 링크 보면서 확인하기

구조

코드

  1. 옵저버(SkillClass)
public class SkillClass : MonoBehaviour
{
    [SerializeField] Image _skillBackgroundImage;
    [SerializeField] SkillCoolDown skillCoolDown;
    [SerializeField] private float _maxCoolDown = 3.0f;
    private float _currentCoolDown;
    public void NotifySkillCoolDown(float amount)
    {
        _skillBackgroundImage.fillAmount = amount;
    }
    private void Start()
    {
        Debug.Log(skillCoolDown);
        skillCoolDown.AddSkill(SetCurrentTime);
    }

    private void OnDestroy()
    {
        skillCoolDown.RemoveSkill(SetCurrentTime);
    }
    private void Update()
    {
        if (Input.GetKeyDown(KeyCode.A))
        {
            _currentCoolDown = _maxCoolDown;
        }
    }
    public void SetCurrentTime(float timeValue)
    {
        if(_currentCoolDown >= 0)
        {
            _currentCoolDown = Mathf.Max(0, _currentCoolDown - timeValue);
            _skillBackgroundImage.fillAmount = _currentCoolDown / _maxCoolDown;
        }
        else
        {
            _skillBackgroundImage.fillAmount = 0;
        }
    }
}
  1. 관찰대상(Subject) -> 이벤트 뿌림
public class SkillCoolDown : MonoBehaviour
{
    public event Action<float> OnUpdateCoolDown;
    public void AddSkill(Action<float> skill) => OnUpdateCoolDown += skill;
    public void RemoveSkill(Action<float> skill) => OnUpdateCoolDown -= skill;
    private float _skillCheckDelay = 0.5f;
    private WaitForSeconds _delay;
    private Coroutine _skillCheckCoroutine;
    private void Start()
    {
        _delay = new WaitForSeconds(_skillCheckDelay);
        _skillCheckCoroutine = StartCoroutine(CoolDownCheckInvoke());
    }
    private void Update()
    {
        //OnUpdateCoolDown?.Invoke(Time.deltaTime); //매 프레임마다 호출하면 부담이 커서 성능개선. 코루틴으로
    }
    IEnumerator CoolDownCheckInvoke()
    {
        while(true)
        {
            OnUpdateCoolDown?.Invoke(_skillCheckDelay);
            yield return _delay;
        }
    }
}

검색 키워드: 옵저버, 옵져버, Observer

0개의 댓글