- adjust risky animation offset
 - show inventory in shop
This commit is contained in:
2025-12-09 11:47:37 +09:00
parent d544f46766
commit ac4df02654
8 changed files with 726 additions and 649 deletions
@@ -85,8 +85,11 @@ class BattleAnimationWidgetState extends State<BattleAnimationWidget>
if (!mounted) return;
// 2. Dash to Target (Impact)
_translateAnimation = Tween<Offset>(begin: Offset.zero, end: targetOffset)
.animate(
// Adjust offset to prevent complete overlap (stop slightly short) since both share the same layer stack
final adjustedOffset = targetOffset * 0.5;
_translateAnimation =
Tween<Offset>(begin: Offset.zero, end: adjustedOffset).animate(
CurvedAnimation(
parent: _translateController,
curve: Curves.easeInExpo, // Heavy impact curve
@@ -0,0 +1,88 @@
import 'package:flutter/material.dart';
import 'package:provider/provider.dart';
import '../../providers/battle_provider.dart';
import '../../game/config/theme_config.dart';
import '../../game/config/app_strings.dart';
class CharacterStatsWidget extends StatelessWidget {
const CharacterStatsWidget({super.key});
@override
Widget build(BuildContext context) {
return Consumer<BattleProvider>(
builder: (context, battleProvider, child) {
final player = battleProvider.player;
return Card(
margin: const EdgeInsets.all(16.0),
child: Padding(
padding: const EdgeInsets.all(16.0),
child: Column(
children: [
Text(
player.name,
style: Theme.of(context).textTheme.headlineSmall,
),
const SizedBox(height: 8),
Text("Stage: ${battleProvider.stage}"),
const Divider(),
Row(
mainAxisAlignment: MainAxisAlignment.spaceAround,
children: [
_buildStatItem(
AppStrings.hp,
"${player.hp}/${player.totalMaxHp}",
color: ThemeConfig.statHpColor,
),
_buildStatItem(
AppStrings.atk,
"${player.totalAtk}",
color: ThemeConfig.statAtkColor,
),
_buildStatItem(
AppStrings.def,
"${player.totalDefense}",
color: ThemeConfig.statDefColor,
),
_buildStatItem(AppStrings.armor, "${player.armor}"),
_buildStatItem(
AppStrings.luck,
"${player.totalLuck}",
color: ThemeConfig.statLuckColor,
),
_buildStatItem(
AppStrings.gold,
"${player.gold} G",
color: ThemeConfig.statGoldColor,
),
],
),
],
),
),
);
},
);
}
Widget _buildStatItem(String label, String value, {Color? color}) {
return Column(
children: [
Text(
label,
style: const TextStyle(
color: ThemeConfig.textColorGrey,
fontSize: 12,
),
),
Text(
value,
style: TextStyle(
fontWeight: ThemeConfig.fontWeightBold,
fontSize: 16,
color: color,
),
),
],
);
}
}
@@ -0,0 +1,424 @@
import 'package:flutter/material.dart';
import 'package:provider/provider.dart';
import '../../providers/battle_provider.dart';
import '../../game/model/item.dart';
import '../../game/enums.dart';
import '../../utils/item_utils.dart';
import '../../game/config/theme_config.dart';
import '../../game/config/app_strings.dart';
class InventoryGridWidget extends StatelessWidget {
const InventoryGridWidget({super.key});
@override
Widget build(BuildContext context) {
return Consumer<BattleProvider>(
builder: (context, battleProvider, child) {
final player = battleProvider.player;
return Column(
children: [
Padding(
padding: const EdgeInsets.symmetric(
horizontal: 16.0,
vertical: 8.0,
),
child: Align(
alignment: Alignment.centerLeft,
child: Text(
"${AppStrings.bag} (${player.inventory.length}/${player.maxInventorySize})",
style: const TextStyle(
fontSize: ThemeConfig.fontSizeHeader,
fontWeight: ThemeConfig.fontWeightBold,
),
),
),
),
Expanded(
child: GridView.builder(
padding: const EdgeInsets.all(16.0),
gridDelegate: const SliverGridDelegateWithFixedCrossAxisCount(
crossAxisCount: 4,
crossAxisSpacing: 8.0,
mainAxisSpacing: 8.0,
),
itemCount: player.maxInventorySize,
itemBuilder: (context, index) {
if (index < player.inventory.length) {
final item = player.inventory[index];
return InkWell(
onTap: () {
_showItemActionDialog(context, battleProvider, item);
},
child: Card(
color: ThemeConfig.inventoryCardBg,
shape: item.rarity != ItemRarity.magic
? RoundedRectangleBorder(
side: BorderSide(
color: ItemUtils.getRarityColor(item.rarity),
width: 2.0,
),
borderRadius: BorderRadius.circular(4.0),
)
: null,
child: Stack(
children: [
Positioned(
left: 4,
top: 4,
child: Opacity(
opacity: 0.5,
child: Image.asset(
ItemUtils.getIconPath(item.slot),
width: 40,
height: 40,
fit: BoxFit.contain,
filterQuality: FilterQuality.high,
),
),
),
Center(
child: Padding(
padding: const EdgeInsets.all(4.0),
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: [
FittedBox(
fit: BoxFit.scaleDown,
child: Text(
item.name,
textAlign: TextAlign.center,
style: TextStyle(
fontSize: ThemeConfig.fontSizeSmall,
fontWeight:
ThemeConfig.fontWeightBold,
color: ItemUtils.getRarityColor(
item.rarity,
),
),
maxLines: 2,
overflow: TextOverflow.ellipsis,
),
),
FittedBox(
fit: BoxFit.scaleDown,
child: _buildItemStatText(item),
),
],
),
),
),
],
),
),
);
} else {
return Container(
decoration: BoxDecoration(
border: Border.all(color: ThemeConfig.textColorGrey),
color: ThemeConfig.emptySlotBg,
),
child: const Center(
child: Icon(
Icons.add_box,
color: ThemeConfig.textColorGrey,
),
),
);
}
},
),
),
],
);
},
);
}
void _showItemActionDialog(
BuildContext context,
BattleProvider provider,
Item item,
) {
bool isShop = provider.currentStage.type == StageType.shop;
showDialog(
context: context,
builder: (ctx) => SimpleDialog(
title: Text("${item.name} Actions"),
children: [
SimpleDialogOption(
onPressed: () {
Navigator.pop(ctx);
_showEquipConfirmationDialog(context, provider, item);
},
child: const Padding(
padding: EdgeInsets.symmetric(vertical: 8.0),
child: Row(
children: [
Icon(Icons.shield, color: ThemeConfig.btnDefendActive),
SizedBox(width: 10),
Text(AppStrings.equip),
],
),
),
),
if (isShop)
SimpleDialogOption(
onPressed: () {
Navigator.pop(ctx);
_showSellConfirmationDialog(context, provider, item);
},
child: Padding(
padding: const EdgeInsets.symmetric(vertical: 8.0),
child: Row(
children: [
const Icon(
Icons.attach_money,
color: ThemeConfig.statGoldColor,
),
const SizedBox(width: 10),
Text("${AppStrings.sell} (${item.price} G)"),
],
),
),
),
SimpleDialogOption(
onPressed: () {
Navigator.pop(ctx);
_showDiscardConfirmationDialog(context, provider, item);
},
child: const Padding(
padding: EdgeInsets.symmetric(vertical: 8.0),
child: Row(
children: [
Icon(Icons.delete, color: ThemeConfig.btnActionActive),
SizedBox(width: 10),
Text(AppStrings.discard),
],
),
),
),
],
),
);
}
void _showSellConfirmationDialog(
BuildContext context,
BattleProvider provider,
Item item,
) {
showDialog(
context: context,
builder: (ctx) => AlertDialog(
title: const Text("Sell Item"),
content: Text("Sell ${item.name} for ${item.price} G?"),
actions: [
TextButton(
onPressed: () => Navigator.pop(ctx),
child: const Text(AppStrings.cancel),
),
ElevatedButton(
style: ElevatedButton.styleFrom(
backgroundColor: ThemeConfig.statGoldColor,
),
onPressed: () {
provider.sellItem(item);
Navigator.pop(ctx);
},
child: const Text(
AppStrings.sell,
style: TextStyle(color: Colors.black),
),
),
],
),
);
}
void _showDiscardConfirmationDialog(
BuildContext context,
BattleProvider provider,
Item item,
) {
showDialog(
context: context,
builder: (ctx) => AlertDialog(
title: const Text("Discard Item"),
content: Text("Are you sure you want to discard ${item.name}?"),
actions: [
TextButton(
onPressed: () => Navigator.pop(ctx),
child: const Text(AppStrings.cancel),
),
ElevatedButton(
style: ElevatedButton.styleFrom(
backgroundColor: ThemeConfig.btnActionActive,
),
onPressed: () {
provider.discardItem(item);
Navigator.pop(ctx);
},
child: const Text(AppStrings.discard),
),
],
),
);
}
void _showEquipConfirmationDialog(
BuildContext context,
BattleProvider provider,
Item newItem,
) {
final player = provider.player;
final oldItem = player.equipment[newItem.slot];
final currentMaxHp = player.totalMaxHp;
final currentAtk = player.totalAtk;
final currentDef = player.totalDefense;
final currentHp = player.hp;
int newMaxHp = currentMaxHp - (oldItem?.hpBonus ?? 0) + newItem.hpBonus;
int newAtk = currentAtk - (oldItem?.atkBonus ?? 0) + newItem.atkBonus;
int newDef = currentDef - (oldItem?.armorBonus ?? 0) + newItem.armorBonus;
double ratio = currentMaxHp > 0 ? currentHp / currentMaxHp : 0.0;
int newHp = (newMaxHp * ratio).toInt();
if (newHp < 0) newHp = 0;
if (newHp > newMaxHp) newHp = newMaxHp;
showDialog(
context: context,
builder: (ctx) => AlertDialog(
title: const Text("Change Equipment"),
content: Column(
mainAxisSize: MainAxisSize.min,
children: [
Text(
"${AppStrings.equip} ${newItem.name}?",
style: const TextStyle(fontWeight: ThemeConfig.fontWeightBold),
),
if (oldItem != null)
Text(
"Replaces ${oldItem.name}",
style: const TextStyle(
fontSize: 12,
color: ThemeConfig.textColorGrey,
),
),
const SizedBox(height: 16),
_buildStatChangeRow("Max HP", currentMaxHp, newMaxHp),
_buildStatChangeRow("Current HP", currentHp, newHp),
_buildStatChangeRow(AppStrings.atk, currentAtk, newAtk),
_buildStatChangeRow(AppStrings.def, currentDef, newDef),
_buildStatChangeRow(
"LUCK",
player.totalLuck,
player.totalLuck - (oldItem?.luck ?? 0) + newItem.luck,
),
],
),
actions: [
TextButton(
onPressed: () => Navigator.pop(ctx),
child: const Text(AppStrings.cancel),
),
ElevatedButton(
onPressed: () {
provider.equipItem(newItem);
Navigator.pop(ctx);
},
child: const Text(AppStrings.confirm),
),
],
),
);
}
Widget _buildStatChangeRow(String label, int oldVal, int newVal) {
int diff = newVal - oldVal;
Color color = diff > 0
? ThemeConfig.statDiffPositive
: (diff < 0
? ThemeConfig.statDiffNegative
: ThemeConfig.statDiffNeutral);
String diffText = diff > 0 ? "(+$diff)" : (diff < 0 ? "($diff)" : "");
return Padding(
padding: const EdgeInsets.symmetric(vertical: 4.0),
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
Text(label),
Row(
children: [
Text(
"$oldVal",
style: const TextStyle(color: ThemeConfig.textColorGrey),
),
const Icon(
Icons.arrow_right,
size: 16,
color: ThemeConfig.textColorGrey,
),
Text(
"$newVal",
style: const TextStyle(fontWeight: ThemeConfig.fontWeightBold),
),
const SizedBox(width: 4),
Text(
diffText,
style: TextStyle(
color: color,
fontSize: 12,
fontWeight: ThemeConfig.fontWeightBold,
),
),
],
),
],
),
);
}
Widget _buildItemStatText(Item item) {
List<String> stats = [];
if (item.atkBonus > 0) stats.add("+${item.atkBonus} ${AppStrings.atk}");
if (item.hpBonus > 0) stats.add("+${item.hpBonus} ${AppStrings.hp}");
if (item.armorBonus > 0) stats.add("+${item.armorBonus} ${AppStrings.def}");
if (item.luck > 0) stats.add("+${item.luck} ${AppStrings.luck}");
List<String> effectTexts = item.effects.map((e) => e.description).toList();
if (stats.isEmpty && effectTexts.isEmpty) return const SizedBox.shrink();
return Column(
children: [
if (stats.isNotEmpty)
Padding(
padding: const EdgeInsets.only(top: 2.0, bottom: 2.0),
child: Text(
stats.join(", "),
style: const TextStyle(
fontSize: ThemeConfig.fontSizeSmall,
color: ThemeConfig.statAtkColor,
),
textAlign: TextAlign.center,
),
),
if (effectTexts.isNotEmpty)
Padding(
padding: const EdgeInsets.only(bottom: 2.0),
child: Text(
effectTexts.join("\n"),
style: const TextStyle(
fontSize: ThemeConfig.fontSizeTiny,
color: ThemeConfig.rarityLegendary,
),
),
),
],
);
}
}
+115 -164
View File
@@ -8,6 +8,7 @@ import '../../../game/enums.dart';
import '../../../game/config/theme_config.dart';
import '../../../game/config/game_config.dart';
import '../../../game/model/entity.dart';
import '../inventory/inventory_grid_widget.dart';
class ShopUI extends StatelessWidget {
final BattleProvider battleProvider;
@@ -26,6 +27,7 @@ class ShopUI extends StatelessWidget {
padding: const EdgeInsets.all(16.0),
child: Column(
children: [
// Header
Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
@@ -67,132 +69,123 @@ class ShopUI extends StatelessWidget {
],
),
const Divider(color: ThemeConfig.textColorGrey),
const SizedBox(height: 16),
const SizedBox(height: 8),
// Shop Items Grid (Top Half)
Expanded(
child: shopItems.isEmpty
? const Center(
child: Text(
"Sold Out",
style: TextStyle(
color: ThemeConfig.textColorGrey,
fontSize: 24,
),
),
)
: GridView.builder(
gridDelegate:
const SliverGridDelegateWithFixedCrossAxisCount(
crossAxisCount: 2,
crossAxisSpacing: 16.0,
mainAxisSpacing: 16.0,
childAspectRatio: 0.8,
),
itemCount: shopItems.length,
itemBuilder: (context, index) {
final item = shopItems[index];
final canBuy = player.gold >= item.price;
return InkWell(
onTap: () => _showBuyConfirmation(
context,
item,
shopProvider,
player,
),
child: Card(
color: ThemeConfig.shopItemCardBg,
shape: item.rarity != ItemRarity.magic
? RoundedRectangleBorder(
side: BorderSide(
color: ItemUtils.getRarityColor(
item.rarity,
),
width: 2.0,
),
borderRadius: BorderRadius.circular(8.0),
)
: null,
child: Padding(
padding: const EdgeInsets.all(8.0),
child: Column(
crossAxisAlignment:
CrossAxisAlignment.stretch,
children: [
Expanded(
flex: 2,
child: Center(
child: Image.asset(
ItemUtils.getIconPath(item.slot),
width: 48,
height: 48,
fit: BoxFit.contain,
filterQuality: FilterQuality.high,
),
),
),
Expanded(
flex: 1,
child: Center(
child: Text(
item.name,
textAlign: TextAlign.center,
style: TextStyle(
fontWeight:
ThemeConfig.fontWeightBold,
color: ItemUtils.getRarityColor(
item.rarity,
),
fontSize:
ThemeConfig.fontSizeMedium,
),
maxLines: 2,
overflow: TextOverflow.ellipsis,
),
),
),
Expanded(
flex: 1,
child: _buildItemStatText(item),
),
SizedBox(
height: 32,
child: ElevatedButton(
style: ElevatedButton.styleFrom(
backgroundColor: canBuy
? ThemeConfig.statGoldColor
: ThemeConfig.btnDisabled,
foregroundColor: Colors.black,
padding: EdgeInsets.zero,
),
onPressed: canBuy
? () => _showBuyConfirmation(
context,
item,
shopProvider,
player,
)
: null,
child: Text(
"${item.price} G",
style: const TextStyle(
fontWeight:
ThemeConfig.fontWeightBold,
),
),
),
),
],
flex: 5,
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
const Text(
"Shop Items",
style: TextStyle(
fontSize: 18,
fontWeight: FontWeight.bold,
color: ThemeConfig.textColorWhite,
),
),
const SizedBox(height: 8),
Expanded(
child: shopItems.isEmpty
? const Center(
child: Text(
"Sold Out",
style: TextStyle(
color: ThemeConfig.textColorGrey,
fontSize: 24,
),
),
)
: GridView.builder(
gridDelegate:
const SliverGridDelegateWithFixedCrossAxisCount(
crossAxisCount: 4,
crossAxisSpacing: 8.0,
mainAxisSpacing: 8.0,
childAspectRatio: 0.8,
),
itemCount: shopItems.length,
itemBuilder: (context, index) {
final item = shopItems[index];
final canBuy = player.gold >= item.price;
return InkWell(
onTap: () => _showBuyConfirmation(
context,
item,
shopProvider,
player,
),
child: Card(
color: ThemeConfig.shopItemCardBg,
shape: item.rarity != ItemRarity.magic
? RoundedRectangleBorder(
side: BorderSide(
color: ItemUtils.getRarityColor(
item.rarity,
),
width: 2.0,
),
borderRadius: BorderRadius.circular(
8.0,
),
)
: null,
child: Padding(
padding: const EdgeInsets.all(4.0),
child: Column(
mainAxisAlignment:
MainAxisAlignment.center,
children: [
Expanded(
child: Image.asset(
ItemUtils.getIconPath(item.slot),
fit: BoxFit.contain,
),
),
Text(
item.name,
maxLines: 1,
overflow: TextOverflow.ellipsis,
style: TextStyle(
fontWeight: FontWeight.bold,
color: ItemUtils.getRarityColor(
item.rarity,
),
fontSize: 12,
),
),
Text(
"${item.price} G",
style: TextStyle(
color: canBuy
? ThemeConfig.statGoldColor
: ThemeConfig.textColorGrey,
fontWeight: FontWeight.bold,
fontSize: 12,
),
),
],
),
),
),
);
},
),
);
},
),
),
],
),
),
const SizedBox(height: 16),
const Divider(color: ThemeConfig.textColorGrey),
// Player Inventory (Bottom Half)
const Expanded(flex: 5, child: InventoryGridWidget()),
const SizedBox(height: 8),
// Action Buttons
Row(
mainAxisAlignment: MainAxisAlignment.spaceEvenly,
children: [
@@ -200,7 +193,7 @@ class ShopUI extends StatelessWidget {
style: ElevatedButton.styleFrom(
backgroundColor: ThemeConfig.btnRerollBg,
padding: const EdgeInsets.symmetric(
horizontal: 24,
horizontal: 16,
vertical: 12,
),
),
@@ -233,7 +226,7 @@ class ShopUI extends StatelessWidget {
style: ElevatedButton.styleFrom(
backgroundColor: ThemeConfig.btnLeaveBg,
padding: const EdgeInsets.symmetric(
horizontal: 24,
horizontal: 16,
vertical: 12,
),
),
@@ -288,18 +281,10 @@ class ShopUI extends StatelessWidget {
),
onPressed: () {
bool success = shopProvider.buyItem(item, player);
Navigator.pop(ctx); // Close dialog first
Navigator.pop(ctx);
if (success) {
// Refresh BattleProvider to update UI (Gold, Inventory) since player object is owned by BattleProvider
// and ShopProvider modifies it directly without BattleProvider knowing.
// Ideally, ShopProvider should notify, but since we don't have a direct link back or a shared PlayerProvider,
// we trigger it from the UI.
// Alternatively, we could add refreshUI to BattleProvider.
// Assuming BattleProvider has refreshUI or we can just use notifyListeners if we had access, but we don't.
// Wait, we have battleProvider instance passed to ShopUI.
battleProvider.refreshUI();
battleProvider.refreshUI(); // Update UI
ScaffoldMessenger.of(context).showSnackBar(
SnackBar(
content: Text("Bought ${item.name}"),
@@ -321,38 +306,4 @@ class ShopUI extends StatelessWidget {
),
);
}
Widget _buildItemStatText(Item item) {
List<String> stats = [];
if (item.atkBonus > 0) stats.add("ATK +${item.atkBonus}");
if (item.hpBonus > 0) stats.add("HP +${item.hpBonus}");
if (item.armorBonus > 0) stats.add("DEF +${item.armorBonus}");
if (item.luck > 0) stats.add("LUCK +${item.luck}");
return Column(
mainAxisAlignment: MainAxisAlignment.center,
children: [
if (stats.isNotEmpty)
Text(
stats.join(", "),
style: const TextStyle(
fontSize: ThemeConfig.fontSizeSmall,
color: Colors.white70,
),
textAlign: TextAlign.center,
maxLines: 2,
overflow: TextOverflow.ellipsis,
),
if (item.effects.isNotEmpty)
Text(
item.effects.first.type.name.toUpperCase(),
style: const TextStyle(
fontSize: ThemeConfig.fontSizeTiny,
color: ThemeConfig.rarityLegendary,
),
textAlign: TextAlign.center,
),
],
);
}
}