fix(ui): 몬스터 HP 바 공간 제약 대응

- 아이콘/이름 제거하고 HP 바 + 퍼센트만 표시
- 좁은 공간에서도 오버플로우 발생하지 않음
This commit is contained in:
JiWoong Sul
2025-12-21 11:54:06 +09:00
parent 4e7db1d58a
commit eb71d2a199

View File

@@ -307,10 +307,8 @@ class _HpMpBarState extends State<HpMpBar> with TickerProviderStateMixin {
/// 몬스터 HP 바 /// 몬스터 HP 바
Widget _buildMonsterBar() { Widget _buildMonsterBar() {
final current = widget.monsterHpCurrent!;
final max = widget.monsterHpMax!; final max = widget.monsterHpMax!;
final ratio = max > 0 ? current / max : 0.0; final ratio = max > 0 ? widget.monsterHpCurrent! / max : 0.0;
final name = widget.monsterName ?? 'Enemy';
return AnimatedBuilder( return AnimatedBuilder(
animation: _monsterFlashAnimation, animation: _monsterFlashAnimation,
@@ -332,30 +330,9 @@ class _HpMpBarState extends State<HpMpBar> with TickerProviderStateMixin {
child: Stack( child: Stack(
clipBehavior: Clip.none, clipBehavior: Clip.none,
children: [ children: [
// HP 바만 표시 (공간 제약으로 아이콘/이름 생략)
Row( Row(
children: [ children: [
// 몬스터 아이콘
const Icon(Icons.pest_control, size: 14, color: Colors.orange),
const SizedBox(width: 4),
// 이름 (Flexible로 공간 부족 시 축소)
Flexible(
flex: 0,
child: ConstrainedBox(
constraints: const BoxConstraints(maxWidth: 50),
child: Text(
name.length > 8 ? '${name.substring(0, 6)}...' : name,
style: const TextStyle(
fontSize: 9,
fontWeight: FontWeight.bold,
color: Colors.orange,
),
overflow: TextOverflow.ellipsis,
),
),
),
const SizedBox(width: 4),
// HP 바 // HP 바
Expanded( Expanded(
child: ClipRRect( child: ClipRRect(
@@ -370,15 +347,10 @@ class _HpMpBarState extends State<HpMpBar> with TickerProviderStateMixin {
), ),
), ),
const SizedBox(width: 4), const SizedBox(width: 4),
// HP 퍼센트
// HP 숫자 (Flexible로 오버플로우 방지) Text(
Flexible( '${(ratio * 100).toInt()}%',
child: Text( style: const TextStyle(fontSize: 8, color: Colors.orange),
'$current/$max',
style: const TextStyle(fontSize: 8, color: Colors.orange),
textAlign: TextAlign.right,
overflow: TextOverflow.ellipsis,
),
), ),
], ],
), ),