32 lines
1.7 KiB
Markdown
32 lines
1.7 KiB
Markdown
# 52. 아이템 아이콘 이미지 적용 (Item Icon Image Implementation)
|
|
|
|
## 1. 목표 (Goal)
|
|
- 기존의 머티리얼 아이콘(`IconData`) 대신 `assets/data/icon/`에 추가된 PNG 이미지 아이콘을 UI에 적용합니다.
|
|
- `ItemUtils`를 수정하여 아이콘 경로를 반환하도록 변경하고, 주요 UI 화면(`BattleScreen`, `InventoryScreen`, `ShopUI`)에서 `Image.asset`을 사용하도록 리팩토링합니다.
|
|
|
|
## 2. 구현 상세 (Implementation Details)
|
|
|
|
### 에셋 등록
|
|
- `pubspec.yaml`에 `assets/data/icon/` 경로 추가.
|
|
|
|
### `ItemUtils` 수정
|
|
- `getIcon(EquipmentSlot)` 제거 (또는 사용처 변경).
|
|
- `getIconPath(EquipmentSlot)` 메서드 추가: 장비 슬롯별 이미지 파일 경로 반환.
|
|
- Weapon -> `icon_weapon.png`
|
|
- Shield -> `icon_shield.png`
|
|
- Armor -> `icon_armor.png`
|
|
- Accessory -> `icon_accessory.png`
|
|
|
|
### UI 수정 (Icon -> Image.asset)
|
|
- **`ShopUI` (`lib/widgets/stage/shop_ui.dart`):** 상점 아이템 카드의 아이콘 교체.
|
|
- **`InventoryScreen` (`lib/screens/inventory_screen.dart`):**
|
|
- 착용 중인 아이템 슬롯의 아이콘 교체.
|
|
- 인벤토리 그리드 내 아이템 아이콘 교체.
|
|
- **`BattleScreen` (`lib/screens/battle_screen.dart`):**
|
|
- 스테이지 클리어 보상 팝업의 아이템 아이콘 교체.
|
|
- **플로팅 액션 버튼(FAB):** ATK/DEF 버튼의 아이콘을 `icon_weapon.png`와 `icon_shield.png`로 교체하고 흰색 틴트 적용.
|
|
|
|
## 3. 결과 (Result)
|
|
- 게임 내 아이템 표현이 단순 기호에서 구체적인 이미지로 변경되어 시각적 몰입도가 향상되었습니다.
|
|
- `ItemUtils`를 통해 아이콘 자원 관리가 중앙화되었습니다.
|