Unity Skill UI가 최적화되지 않은 문제 해결

현재 배경: 코드 리팩토링 중 해당 UI 메뉴 구현

기존에는 SelectSkillUI, InfoSkillUI, SkillUpgradeHandler 이 세 컴포넌트가 서로 강하게 엮여 있어 하나만 바꾸려고 해도 나머지까지 전부 손대야 할 만큼 상호 의존성이 높았다.

이를 개선하기 위해 각 역할을 분리하고 이벤트 기반으로 연결하여 유지보수가 쉬운 구조로 리팩토링을 시도했다.

그러나 이 과정에서 다양한 문제가 발생했고, 특히 새로 도입한 SkillButton 컴포넌트와 관련된 Inspector 설정 실수가 시스템 전반의 기능 장애로 이어졌다.

---

현재 구조

1. SkillButton.cs

• 개별 스킬 버튼 컴포넌트.
• 각 GameObject에 개별적으로 부착.
• skillIndex 값을 부여하여 해당 스킬을 구분.

[SerializeField] private int skillIndex;
public int SkillIndex => skillIndex;

2. SelectSkillUI.cs

• 여러 스킬 버튼을 연결해 핸들러에 이벤트를 전달.
• skillButtons[i].OnButtonClicked += OnSkillButtonClicked;

3. InfoSkillUI.cs

• 스킬 정보(이름, 설명, 데미지, 쿨타임, 마나 소모, 업그레이드 비용)를 표시.
• SelectSkillUI에서 전달받은 skillIndex를 기준으로 SkillManager로부터 데이터를 가져옴.

4. SkillUpgradeHandler.cs

• SelectSkillUI와 InfoSkillUI를 중재.
• 각 UI와 이벤트를 연결하고 데이터 흐름을 관리.

---

문제 상황: 버튼이 선택되지 않음

사용 상황

• 리팩토링 후, UI에서 어떤 스킬 버튼을 클릭해도 항상 버튼_0만 선택됨.
• 다른 스킬 버튼을 눌러도 정보가 갱신되지 않음.
• SkillButton.cs에서 모든 버튼의 skillIndex가 동일한 값(0)으로 설정되어 있었음.

---

해결 방법: Inspector 설정 문제

[ SkillButton ]
- 버튼_0 : skillIndex = 0 ✅
- 버튼_1 : skillIndex = 0 ❌
- 버튼_2 : skillIndex = 0 ❌

➡ 위와 같이 Inspector 설정이 잘못되어 모든 버튼이 동일한 인덱스로 동작하고 있었음.

간단한 조치만으로 해결 가능

• 각 SkillButton 오브젝트의 skillIndex 값을 각각 다르게 설정
• 버튼_1 = 1, 버튼_2 = 2로 수정
• 이후 버튼 선택/해제 및 스킬 데이터 연동이 정상 작동됨

---

플레이 예시

Inspector 오류 전 (버튼 클릭해도 변하지 않던 상황)

> 클릭해도 스킬 정보가 바뀌지 않음:
- 이미 button_0이 선택된 상태에서 계속 복잡한 동작 반복
- SkillData의 이미지, 이름, 설명 등이 갱신되지 않음

Inspector의 skillIndex 수정 후

> 버튼 선택에 따라 이미지, 이름, 설명, 데미지, 업그레이드 비용 등이 올바르게 갱신됨
> 예: button_1 클릭 시 skillIndex = 1 값을 기반으로 handler가 해당 데이터 로드

---

클릭 이벤트 흐름 요약

[SkillButton.cs] → 클릭 시 skillIndex 전달
       ↓
[SelectSkillUI.cs] → 기존 선택 해제 후, 새로운 선택 적용
       ↓
[SkillUpgradeHandler.cs] → 전달된 skillIndex로 SkillData 호출
       ↓
[InfoSkillUI.cs] → 정보 표시 및 업그레이드 버튼 처리

---

해결 후 가치 발견

전체 코드 구조가 안정됨

• 역할이 명확히 분리됨
• 이벤트 흐름이 체계적임
• 코드 자체는 견고했으나, 설정값 확인이 누락되면 동작하지 않음

---

배운 점 & 인사이트

1. 복잡할수록 가장 단순한 원인을 먼저 확인하자

• 코드보다 Inspector 설정이 원인일 가능성 높음
• 하이레벨 개발에서는 Scene 내 값이 로직보다 더 중요할 수 있음

2. Unity는 코드와 설정이 동시에 작동함

• UI, 이벤트, SerializedField 설정값이 함께 작동함
• 하나만 누락되어도 전체가 실패함

3. 디버깅 순서의 전략화

• 항상 Inspector → 코드 순으로 점검
• 특히 리팩토링 직후에는 OnValidate(), SerializedField 등 확인 필수

4. 버튼 활성화/비활성화, 선택/비선택 상태 확인

• interactable = false 혹은 SetSelectedState() 등 UI 상태 변화 체크 필수

---

결론

• 구조 분리 이후엔 각 Inspector 값 확인이 가장 중요하다
• Unity는 코드와 에디터 설정이 긴밀히 연동되므로, OnValidate()를 통한 자동 설정도 중요하다
• 코드 수정 전에 반드시 Inspector 설정을 다시 점검하자!