feat: 充值、划转、提现页面改用 Material Design 3 输入框

- deposit_page.dart: 金额输入框改用 MaterialInput
- transfer_page.dart: 金额输入框改用 MaterialInput
- withdraw_page.dart: 金额、地址、联系方式输入框改用 MaterialInput
- 保持所有业务逻辑和验证逻辑不变
- 统一视觉风格(圆角边框 + Focus 效果)
This commit is contained in:
2026-04-08 11:44:10 +08:00
parent e6f5dc1800
commit 4df1e56775
3 changed files with 62 additions and 214 deletions

View File

@@ -6,6 +6,7 @@ import '../../../core/theme/app_theme.dart';
import '../../../core/theme/app_spacing.dart'; import '../../../core/theme/app_spacing.dart';
import '../../../core/utils/toast_utils.dart'; import '../../../core/utils/toast_utils.dart';
import '../../../providers/asset_provider.dart'; import '../../../providers/asset_provider.dart';
import '../../components/material_input.dart';
/// 充值页面 /// 充值页面
class DepositPage extends StatefulWidget { class DepositPage extends StatefulWidget {
@@ -172,8 +173,6 @@ class _DepositPageState extends State<DepositPage> {
const SizedBox(height: AppSpacing.lg), const SizedBox(height: AppSpacing.lg),
// 金额输入 // 金额输入
_buildAmountLabel(colorScheme),
const SizedBox(height: AppSpacing.sm),
_buildAmountInput(colorScheme), _buildAmountInput(colorScheme),
const SizedBox(height: AppSpacing.sm), const SizedBox(height: AppSpacing.sm),
@@ -239,58 +238,24 @@ class _DepositPageState extends State<DepositPage> {
} }
Widget _buildAmountInput(ColorScheme colorScheme) { Widget _buildAmountInput(ColorScheme colorScheme) {
return Container( return MaterialInput(
width: double.infinity,
height: 52,
decoration: BoxDecoration(
color: colorScheme.surface,
borderRadius: BorderRadius.circular(14),
border: Border.all(
color: _amountFocus.hasFocus
? colorScheme.secondary
: colorScheme.outlineVariant.withValues(alpha: 0.5),
width: 1,
),
),
padding: const EdgeInsets.symmetric(horizontal: 16),
child: Row(
children: [
Expanded(
child: TextField(
controller: _amountController, controller: _amountController,
focusNode: _amountFocus, focusNode: _amountFocus,
keyboardType: labelText: '充值金額',
const TextInputType.numberWithOptions(decimal: true), hintText: '0.00',
keyboardType: const TextInputType.numberWithOptions(decimal: true),
inputFormatters: [ inputFormatters: [
FilteringTextInputFormatter.allow(RegExp(r'^\d*\.?\d{0,8}')), FilteringTextInputFormatter.allow(RegExp(r'^\d*\.?\d{0,8}')),
], ],
style: TextStyle( suffixIcon: Padding(
fontSize: 24, padding: const EdgeInsets.only(right: AppSpacing.md),
fontWeight: FontWeight.w600, child: Text(
color: colorScheme.onSurface,
),
decoration: InputDecoration(
hintText: '0.00',
hintStyle: TextStyle(
fontSize: 24,
fontWeight: FontWeight.w600,
color:
colorScheme.onSurfaceVariant.withValues(alpha: 0.3),
),
border: InputBorder.none,
contentPadding: EdgeInsets.zero,
isDense: true,
),
),
),
Text(
'USDT', 'USDT',
style: AppTextStyles.bodyMedium(context).copyWith( style: AppTextStyles.bodyMedium(context).copyWith(
color: colorScheme.onSurfaceVariant, color: colorScheme.onSurfaceVariant,
fontWeight: FontWeight.w500, fontWeight: FontWeight.w500,
), ),
), ),
],
), ),
); );
} }

View File

@@ -6,6 +6,7 @@ import '../../../core/theme/app_theme.dart';
import '../../../core/theme/app_spacing.dart'; import '../../../core/theme/app_spacing.dart';
import '../../../providers/asset_provider.dart'; import '../../../providers/asset_provider.dart';
import '../../../data/models/account_models.dart'; import '../../../data/models/account_models.dart';
import '../../components/material_input.dart';
/// 划转页面 /// 划转页面
class TransferPage extends StatefulWidget { class TransferPage extends StatefulWidget {
@@ -365,59 +366,24 @@ class _TransferPageState extends State<TransferPage> {
const SizedBox(height: 12), const SizedBox(height: 12),
// 金额输入框 // 金额输入框
Container( MaterialInput(
width: double.infinity,
height: 52,
decoration: BoxDecoration(
color: colorScheme.surface,
borderRadius: BorderRadius.circular(14),
border: Border.all(
color: _focusNode.hasFocus
? colorScheme.secondary
: colorScheme.outlineVariant.withValues(alpha: 0.5),
width: 1,
),
),
padding: const EdgeInsets.symmetric(horizontal: 16),
child: Row(
children: [
Expanded(
child: TextField(
controller: _amountController, controller: _amountController,
focusNode: _focusNode, focusNode: _focusNode,
keyboardType:
const TextInputType.numberWithOptions(decimal: true),
inputFormatters: [
FilteringTextInputFormatter.allow(
RegExp(r'^\d*\.?\d{0,8}')),
],
style: TextStyle(
fontSize: 24,
fontWeight: FontWeight.w600,
color: colorScheme.onSurface,
),
decoration: InputDecoration(
hintText: '0.00', hintText: '0.00',
hintStyle: TextStyle( keyboardType: const TextInputType.numberWithOptions(decimal: true),
fontSize: 24, inputFormatters: [
fontWeight: FontWeight.w600, FilteringTextInputFormatter.allow(RegExp(r'^\d*\.?\d{0,8}')),
color: colorScheme.onSurfaceVariant.withValues(alpha: 0.3), ],
),
border: InputBorder.none,
contentPadding: EdgeInsets.zero,
isDense: true,
),
onChanged: (_) => setState(() {}), onChanged: (_) => setState(() {}),
), suffixIcon: Padding(
), padding: const EdgeInsets.only(right: AppSpacing.md),
Text( child: Text(
'USDT', 'USDT',
style: AppTextStyles.bodyMedium(context).copyWith( style: AppTextStyles.bodyMedium(context).copyWith(
color: colorScheme.onSurfaceVariant, color: colorScheme.onSurfaceVariant,
fontWeight: FontWeight.w500, fontWeight: FontWeight.w500,
), ),
), ),
],
), ),
), ),
const SizedBox(height: 10), const SizedBox(height: 10),

View File

@@ -6,6 +6,7 @@ import '../../../core/theme/app_theme.dart';
import '../../../core/theme/app_spacing.dart'; import '../../../core/theme/app_spacing.dart';
import '../../../core/utils/toast_utils.dart'; import '../../../core/utils/toast_utils.dart';
import '../../../providers/asset_provider.dart'; import '../../../providers/asset_provider.dart';
import '../../components/material_input.dart';
/// 提现页面 /// 提现页面
class WithdrawPage extends StatefulWidget { class WithdrawPage extends StatefulWidget {
@@ -146,8 +147,6 @@ class _WithdrawPageState extends State<WithdrawPage> {
], ],
// 提现金额 // 提现金额
_buildSectionLabel(colorScheme, '提現金額'),
const SizedBox(height: AppSpacing.sm),
_buildAmountInput(colorScheme), _buildAmountInput(colorScheme),
const SizedBox(height: AppSpacing.sm), const SizedBox(height: AppSpacing.sm),
@@ -164,14 +163,10 @@ class _WithdrawPageState extends State<WithdrawPage> {
], ],
// 目标地址 // 目标地址
_buildSectionLabel(colorScheme, '目標地址'),
const SizedBox(height: AppSpacing.sm),
_buildAddressInput(colorScheme), _buildAddressInput(colorScheme),
const SizedBox(height: AppSpacing.lg), const SizedBox(height: AppSpacing.lg),
// 联系方式 // 联系方式
_buildSectionLabel(colorScheme, '聯繫方式(可選)'),
const SizedBox(height: AppSpacing.sm),
_buildContactInput(colorScheme), _buildContactInput(colorScheme),
const SizedBox(height: AppSpacing.xl), const SizedBox(height: AppSpacing.xl),
@@ -237,58 +232,24 @@ class _WithdrawPageState extends State<WithdrawPage> {
} }
Widget _buildAmountInput(ColorScheme colorScheme) { Widget _buildAmountInput(ColorScheme colorScheme) {
return Container( return MaterialInput(
width: double.infinity,
height: 52,
decoration: BoxDecoration(
color: colorScheme.surface,
borderRadius: BorderRadius.circular(14),
border: Border.all(
color: _amountFocus.hasFocus
? colorScheme.secondary
: colorScheme.outlineVariant.withValues(alpha: 0.5),
width: 1,
),
),
padding: const EdgeInsets.symmetric(horizontal: 16),
child: Row(
children: [
Expanded(
child: TextField(
controller: _amountController, controller: _amountController,
focusNode: _amountFocus, focusNode: _amountFocus,
keyboardType: labelText: '提現金額',
const TextInputType.numberWithOptions(decimal: true), hintText: '0.00',
keyboardType: const TextInputType.numberWithOptions(decimal: true),
inputFormatters: [ inputFormatters: [
FilteringTextInputFormatter.allow(RegExp(r'^\d*\.?\d{0,8}')), FilteringTextInputFormatter.allow(RegExp(r'^\d*\.?\d{0,8}')),
], ],
style: TextStyle( suffixIcon: Padding(
fontSize: 24, padding: const EdgeInsets.only(right: AppSpacing.md),
fontWeight: FontWeight.w600, child: Text(
color: colorScheme.onSurface,
),
decoration: InputDecoration(
hintText: '0.00',
hintStyle: TextStyle(
fontSize: 24,
fontWeight: FontWeight.w600,
color:
colorScheme.onSurfaceVariant.withValues(alpha: 0.3),
),
border: InputBorder.none,
contentPadding: EdgeInsets.zero,
isDense: true,
),
),
),
Text(
'USDT', 'USDT',
style: AppTextStyles.bodyMedium(context).copyWith( style: AppTextStyles.bodyMedium(context).copyWith(
color: colorScheme.onSurfaceVariant, color: colorScheme.onSurfaceVariant,
fontWeight: FontWeight.w500, fontWeight: FontWeight.w500,
), ),
), ),
],
), ),
); );
} }
@@ -352,62 +313,18 @@ class _WithdrawPageState extends State<WithdrawPage> {
} }
Widget _buildAddressInput(ColorScheme colorScheme) { Widget _buildAddressInput(ColorScheme colorScheme) {
return Container( return MaterialInput(
width: double.infinity,
height: 48,
decoration: BoxDecoration(
color: colorScheme.surface,
borderRadius: BorderRadius.circular(14),
border: Border.all(
color: colorScheme.outlineVariant.withValues(alpha: 0.5),
width: 1,
),
),
padding: const EdgeInsets.symmetric(horizontal: 16),
alignment: Alignment.center,
child: TextField(
controller: _addressController, controller: _addressController,
style: AppTextStyles.bodyMedium(context), labelText: '目標地址',
decoration: InputDecoration(
hintText: '請輸入提現地址', hintText: '請輸入提現地址',
hintStyle: AppTextStyles.bodyMedium(context).copyWith(
color: colorScheme.onSurfaceVariant.withValues(alpha: 0.5),
),
border: InputBorder.none,
contentPadding: EdgeInsets.zero,
isDense: true,
),
),
); );
} }
Widget _buildContactInput(ColorScheme colorScheme) { Widget _buildContactInput(ColorScheme colorScheme) {
return Container( return MaterialInput(
width: double.infinity,
height: 48,
decoration: BoxDecoration(
color: colorScheme.surface,
borderRadius: BorderRadius.circular(14),
border: Border.all(
color: colorScheme.outlineVariant.withValues(alpha: 0.5),
width: 1,
),
),
padding: const EdgeInsets.symmetric(horizontal: 16),
alignment: Alignment.center,
child: TextField(
controller: _contactController, controller: _contactController,
style: AppTextStyles.bodyMedium(context), labelText: '聯繫方式(可選)',
decoration: InputDecoration(
hintText: '方便客服與您聯繫', hintText: '方便客服與您聯繫',
hintStyle: AppTextStyles.bodyMedium(context).copyWith(
color: colorScheme.onSurfaceVariant.withValues(alpha: 0.5),
),
border: InputBorder.none,
contentPadding: EdgeInsets.zero,
isDense: true,
),
),
); );
} }