✍️Today I Learned

📅 2025-09-17

• Buff/Debuff UI 시스템

---

Buff/Debuff UI 시스템

목표

게임에서 플레이어에게 적용된 버프/디버프 상태이펙트를 실시간으로 표시하는 UI 시스템 구현

구현한 UI

• 버프/디버프 아이콘들이 가로로 나열되는 컨테이너
• 각 아이콘별로 남은 시간 카운트다운 표시
• 버프는 초록 테두리, 디버프는 빨간 테두리로 구분
• 최대 표시 개수 제한 + 대기열 시스템

주요 구현 내용

1. 이중 구조 설계

• GGBuffContainerWidget: 여러 이펙트들을 관리하는 컨테이너
• GGBuffSlotWidget: 개별 이펙트를 표시하는 슬롯

2. GameplayEffect 시스템 연동

// 이펙트 추가/제거 이벤트 바인딩
ASC->OnActiveGameplayEffectAddedDelegateToSelf.AddUObject(this, &UGGBuffContainerWidget::OnGameplayEffectAdded);
ASC->OnAnyGameplayEffectRemovedDelegate().AddUObject(this, &UGGBuffContainerWidget::OnGameplayEffectRemoved);

3. 실시간 시간 업데이트

• 0.1초마다 GameplayEffect에서 실제 남은 시간을 가져와서 UI 동기화
• 시간 포맷: 60초 이상 → "2:35", 10초 이상 → "45s", 10초 미만 → "3.2s"

핵심 문제 해결

문제: 중복 이펙트 적용 시 UI 깜빡임

상황: 3초 버프를 1초 후에 다시 적용하면, 첫 번째 버프 만료 시 UI에서 완전히 사라짐

원인: 언리얼에서 같은 이펙트 재적용 시 기존 이펙트 제거 → 새 이펙트 추가 순서로 동작. 기존 코드는 제거 이벤트에서 태그만 보고 무조건 UI 제거.

해결: 핸들 기반 제거 로직 구현

// 제거된 핸들이 현재 추적 중인 핸들과 같을 때만 UI에서 제거
if (*TrackedHandle == RemovedEffect.Handle) {
    RemoveEffect(EffectTag);  // UI에서 제거
}

핵심 학습 내용

1. GameplayEffect의 Stacking Policy

• Stack Policy: None (기본) → 재적용 시 기존 것 제거 후 새 것 추가
• Stack Policy: Aggregate → 재적용 시 기존 것 갱신

2. Handle 기반 추적의 중요성

• 같은 태그라도 서로 다른 GameplayEffect 인스턴스는 다른 핸들을 가짐
• UI 제거 판단 시 태그가 아닌 핸들로 비교해야 정확함

3. 실시간 동기화 패턴

• 이벤트 기반: 이펙트 추가/제거 시 즉시 반응
• 폴링 기반: 주기적으로 실제 상태와 UI 동기화
• 두 방식을 조합하여 안정적이고 정확한 UI 구현

결과

• 중복 이펙트 적용 시에도 UI가 자연스럽게 시간만 갱신됨
• 실시간으로 정확한 남은 시간 표시
• 최대 슬롯 수 제한으로 UI 공간 효율성 확보
• 버프/디버프 시각적 구분으로 사용자 경험 향상

---

💡 느낀 점 (What I Felt)

처음에는 단순히 "갱신이 안된다"고 생각했지만, 실제로는 언리얼 엔진의 GameplayEffect 동작 방식(제거→추가)을 이해해야 하는 문제였다. 표면적 증상이 아닌 근본 원인을 찾는 것이 중요하다는 걸 배웠다.
태그만으로 판단하면 같은 종류의 여러 인스턴스를 구분할 수 없다. 각 객체의 고유한 핸들이나 ID를 통해 정확한 상태 관리를 해야 한다는 걸 깨달았다.

---