feat: 充值/提现页面改为独立全屏页面,优化Toast提示
This commit is contained in:
@@ -1,95 +1,154 @@
|
||||
import 'package:flutter/material.dart';
|
||||
import 'package:bot_toast/bot_toast.dart';
|
||||
|
||||
/// Toast 工具類 - 提供統一的 toast 提示功能
|
||||
///
|
||||
/// 使用 bot_toast 實現,確保 toast 顯示在所有彈窗之上
|
||||
/// Toast 工具類 - 統一的正式風格提示
|
||||
///
|
||||
/// 仿支付寶/微信風格:圓角矩形 + 圖標 + 文字,純色背景,無漸變。
|
||||
/// 支持深色/淺色模式自動適配。
|
||||
class ToastUtils {
|
||||
ToastUtils._();
|
||||
|
||||
/// 顯示普通提示
|
||||
/// 顯示信息提示(藍色圖標)
|
||||
static void show(String message, {Duration? duration}) {
|
||||
BotToast.showCustomText(
|
||||
toastBuilder: (_) => _buildToastWidget(message),
|
||||
align: Alignment.center,
|
||||
duration: duration ?? const Duration(seconds: 2),
|
||||
onlyOne: true,
|
||||
crossPage: true,
|
||||
);
|
||||
_showToast(message, _ToastType.info, duration: duration);
|
||||
}
|
||||
|
||||
/// 顯示成功提示
|
||||
/// 顯示成功提示(綠色圖標)
|
||||
static void showSuccess(String message, {Duration? duration}) {
|
||||
BotToast.showCustomText(
|
||||
toastBuilder: (_) => _buildToastWidget(
|
||||
message,
|
||||
backgroundColor: Colors.green.shade700,
|
||||
),
|
||||
align: Alignment.center,
|
||||
duration: duration ?? const Duration(seconds: 2),
|
||||
onlyOne: true,
|
||||
crossPage: true,
|
||||
);
|
||||
_showToast(message, _ToastType.success, duration: duration);
|
||||
}
|
||||
|
||||
/// 顯示錯誤提示
|
||||
/// 顯示錯誤提示(紅色圖標)
|
||||
static void showError(String message, {Duration? duration}) {
|
||||
BotToast.showCustomText(
|
||||
toastBuilder: (_) => _buildToastWidget(
|
||||
message,
|
||||
backgroundColor: Colors.red.shade700,
|
||||
),
|
||||
align: Alignment.center,
|
||||
duration: duration ?? const Duration(seconds: 3),
|
||||
onlyOne: true,
|
||||
crossPage: true,
|
||||
);
|
||||
_showToast(message, _ToastType.error, duration: duration ?? const Duration(seconds: 3));
|
||||
}
|
||||
|
||||
/// 顯示警告提示
|
||||
/// 顯示警告提示(橙色圖標)
|
||||
static void showWarning(String message, {Duration? duration}) {
|
||||
_showToast(message, _ToastType.warning, duration: duration);
|
||||
}
|
||||
|
||||
static void _showToast(
|
||||
String message,
|
||||
_ToastType type, {
|
||||
Duration? duration,
|
||||
}) {
|
||||
BotToast.showCustomText(
|
||||
toastBuilder: (_) => _buildToastWidget(
|
||||
message,
|
||||
backgroundColor: Colors.orange.shade700,
|
||||
),
|
||||
toastBuilder: (_) => _ToastWidget(message: message, type: type),
|
||||
align: Alignment.center,
|
||||
duration: duration ?? const Duration(seconds: 2),
|
||||
onlyOne: true,
|
||||
crossPage: true,
|
||||
);
|
||||
}
|
||||
|
||||
/// 構建 toast widget
|
||||
static Widget _buildToastWidget(
|
||||
String message, {
|
||||
Color? backgroundColor,
|
||||
}) {
|
||||
return Container(
|
||||
padding: const EdgeInsets.symmetric(
|
||||
horizontal: 24,
|
||||
vertical: 12,
|
||||
),
|
||||
decoration: BoxDecoration(
|
||||
color: backgroundColor ?? Colors.black87,
|
||||
borderRadius: BorderRadius.circular(8),
|
||||
boxShadow: [
|
||||
BoxShadow(
|
||||
color: Colors.black.withOpacity(0.2),
|
||||
blurRadius: 8,
|
||||
offset: const Offset(0, 2),
|
||||
),
|
||||
],
|
||||
),
|
||||
child: Text(
|
||||
message,
|
||||
style: const TextStyle(
|
||||
color: Colors.white,
|
||||
fontSize: 14,
|
||||
fontWeight: FontWeight.w500,
|
||||
),
|
||||
textAlign: TextAlign.center,
|
||||
),
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
/// Toast 類型
|
||||
enum _ToastType {
|
||||
success,
|
||||
error,
|
||||
warning,
|
||||
info,
|
||||
}
|
||||
|
||||
/// Toast Widget - 支付寶/微信風格
|
||||
class _ToastWidget extends StatelessWidget {
|
||||
final String message;
|
||||
final _ToastType type;
|
||||
|
||||
const _ToastWidget({required this.message, required this.type});
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
final config = _typeConfig;
|
||||
final isDark = Theme.of(context).brightness == Brightness.dark;
|
||||
|
||||
return Container(
|
||||
constraints: const BoxConstraints(maxWidth: 280),
|
||||
padding: const EdgeInsets.symmetric(horizontal: 24, vertical: 20),
|
||||
decoration: BoxDecoration(
|
||||
color: isDark ? const Color(0xE6292D36) : const Color(0xE6FFFFFF),
|
||||
borderRadius: BorderRadius.circular(12),
|
||||
boxShadow: [
|
||||
BoxShadow(
|
||||
color: Colors.black.withValues(alpha: isDark ? 0.3 : 0.15),
|
||||
blurRadius: 16,
|
||||
offset: const Offset(0, 4),
|
||||
),
|
||||
],
|
||||
),
|
||||
child: Column(
|
||||
mainAxisSize: MainAxisSize.min,
|
||||
children: [
|
||||
// 圖標
|
||||
Container(
|
||||
width: 36,
|
||||
height: 36,
|
||||
decoration: BoxDecoration(
|
||||
color: config.backgroundColor,
|
||||
shape: BoxShape.circle,
|
||||
),
|
||||
child: Icon(
|
||||
config.icon,
|
||||
color: config.iconColor,
|
||||
size: 20,
|
||||
),
|
||||
),
|
||||
const SizedBox(height: 10),
|
||||
// 文字
|
||||
Text(
|
||||
message,
|
||||
style: TextStyle(
|
||||
color: isDark ? const Color(0xFFF8FAFC) : const Color(0xFF1F2937),
|
||||
fontSize: 14,
|
||||
fontWeight: FontWeight.w500,
|
||||
height: 1.4,
|
||||
),
|
||||
textAlign: TextAlign.center,
|
||||
),
|
||||
],
|
||||
),
|
||||
);
|
||||
}
|
||||
|
||||
_ToastConfig get _typeConfig {
|
||||
switch (type) {
|
||||
case _ToastType.success:
|
||||
return _ToastConfig(
|
||||
icon: Icons.check_circle_outline_rounded,
|
||||
iconColor: const Color(0xFFFFFFFF),
|
||||
backgroundColor: const Color(0xFF16A34A),
|
||||
);
|
||||
case _ToastType.error:
|
||||
return _ToastConfig(
|
||||
icon: Icons.cancel_outlined,
|
||||
iconColor: const Color(0xFFFFFFFF),
|
||||
backgroundColor: const Color(0xFFDC2626),
|
||||
);
|
||||
case _ToastType.warning:
|
||||
return _ToastConfig(
|
||||
icon: Icons.error_outline_rounded,
|
||||
iconColor: const Color(0xFFFFFFFF),
|
||||
backgroundColor: const Color(0xFFF59E0B),
|
||||
);
|
||||
case _ToastType.info:
|
||||
return _ToastConfig(
|
||||
icon: Icons.info_outline_rounded,
|
||||
iconColor: const Color(0xFFFFFFFF),
|
||||
backgroundColor: const Color(0xFF3B82F6),
|
||||
);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
class _ToastConfig {
|
||||
final IconData icon;
|
||||
final Color iconColor;
|
||||
final Color backgroundColor;
|
||||
|
||||
const _ToastConfig({
|
||||
required this.icon,
|
||||
required this.iconColor,
|
||||
required this.backgroundColor,
|
||||
});
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user