feat: 充值、划转、提现页面改用 Material Design 3 输入框
- deposit_page.dart: 金额输入框改用 MaterialInput - transfer_page.dart: 金额输入框改用 MaterialInput - withdraw_page.dart: 金额、地址、联系方式输入框改用 MaterialInput - 保持所有业务逻辑和验证逻辑不变 - 统一视觉风格(圆角边框 + Focus 效果)
This commit is contained in:
@@ -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,59 +238,25 @@ class _DepositPageState extends State<DepositPage> {
|
|||||||
}
|
}
|
||||||
|
|
||||||
Widget _buildAmountInput(ColorScheme colorScheme) {
|
Widget _buildAmountInput(ColorScheme colorScheme) {
|
||||||
return Container(
|
return MaterialInput(
|
||||||
width: double.infinity,
|
controller: _amountController,
|
||||||
height: 52,
|
focusNode: _amountFocus,
|
||||||
decoration: BoxDecoration(
|
labelText: '充值金額',
|
||||||
color: colorScheme.surface,
|
hintText: '0.00',
|
||||||
borderRadius: BorderRadius.circular(14),
|
keyboardType: const TextInputType.numberWithOptions(decimal: true),
|
||||||
border: Border.all(
|
inputFormatters: [
|
||||||
color: _amountFocus.hasFocus
|
FilteringTextInputFormatter.allow(RegExp(r'^\d*\.?\d{0,8}')),
|
||||||
? colorScheme.secondary
|
],
|
||||||
: colorScheme.outlineVariant.withValues(alpha: 0.5),
|
suffixIcon: Padding(
|
||||||
width: 1,
|
padding: const EdgeInsets.only(right: AppSpacing.md),
|
||||||
|
child: Text(
|
||||||
|
'USDT',
|
||||||
|
style: AppTextStyles.bodyMedium(context).copyWith(
|
||||||
|
color: colorScheme.onSurfaceVariant,
|
||||||
|
fontWeight: FontWeight.w500,
|
||||||
|
),
|
||||||
),
|
),
|
||||||
),
|
),
|
||||||
padding: const EdgeInsets.symmetric(horizontal: 16),
|
|
||||||
child: Row(
|
|
||||||
children: [
|
|
||||||
Expanded(
|
|
||||||
child: TextField(
|
|
||||||
controller: _amountController,
|
|
||||||
focusNode: _amountFocus,
|
|
||||||
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',
|
|
||||||
hintStyle: TextStyle(
|
|
||||||
fontSize: 24,
|
|
||||||
fontWeight: FontWeight.w600,
|
|
||||||
color:
|
|
||||||
colorScheme.onSurfaceVariant.withValues(alpha: 0.3),
|
|
||||||
),
|
|
||||||
border: InputBorder.none,
|
|
||||||
contentPadding: EdgeInsets.zero,
|
|
||||||
isDense: true,
|
|
||||||
),
|
|
||||||
),
|
|
||||||
),
|
|
||||||
Text(
|
|
||||||
'USDT',
|
|
||||||
style: AppTextStyles.bodyMedium(context).copyWith(
|
|
||||||
color: colorScheme.onSurfaceVariant,
|
|
||||||
fontWeight: FontWeight.w500,
|
|
||||||
),
|
|
||||||
),
|
|
||||||
],
|
|
||||||
),
|
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
@@ -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,60 +366,25 @@ class _TransferPageState extends State<TransferPage> {
|
|||||||
const SizedBox(height: 12),
|
const SizedBox(height: 12),
|
||||||
|
|
||||||
// 金额输入框
|
// 金额输入框
|
||||||
Container(
|
MaterialInput(
|
||||||
width: double.infinity,
|
controller: _amountController,
|
||||||
height: 52,
|
focusNode: _focusNode,
|
||||||
decoration: BoxDecoration(
|
hintText: '0.00',
|
||||||
color: colorScheme.surface,
|
keyboardType: const TextInputType.numberWithOptions(decimal: true),
|
||||||
borderRadius: BorderRadius.circular(14),
|
inputFormatters: [
|
||||||
border: Border.all(
|
FilteringTextInputFormatter.allow(RegExp(r'^\d*\.?\d{0,8}')),
|
||||||
color: _focusNode.hasFocus
|
],
|
||||||
? colorScheme.secondary
|
onChanged: (_) => setState(() {}),
|
||||||
: colorScheme.outlineVariant.withValues(alpha: 0.5),
|
suffixIcon: Padding(
|
||||||
width: 1,
|
padding: const EdgeInsets.only(right: AppSpacing.md),
|
||||||
|
child: Text(
|
||||||
|
'USDT',
|
||||||
|
style: AppTextStyles.bodyMedium(context).copyWith(
|
||||||
|
color: colorScheme.onSurfaceVariant,
|
||||||
|
fontWeight: FontWeight.w500,
|
||||||
|
),
|
||||||
),
|
),
|
||||||
),
|
),
|
||||||
padding: const EdgeInsets.symmetric(horizontal: 16),
|
|
||||||
child: Row(
|
|
||||||
children: [
|
|
||||||
Expanded(
|
|
||||||
child: TextField(
|
|
||||||
controller: _amountController,
|
|
||||||
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',
|
|
||||||
hintStyle: TextStyle(
|
|
||||||
fontSize: 24,
|
|
||||||
fontWeight: FontWeight.w600,
|
|
||||||
color: colorScheme.onSurfaceVariant.withValues(alpha: 0.3),
|
|
||||||
),
|
|
||||||
border: InputBorder.none,
|
|
||||||
contentPadding: EdgeInsets.zero,
|
|
||||||
isDense: true,
|
|
||||||
),
|
|
||||||
onChanged: (_) => setState(() {}),
|
|
||||||
),
|
|
||||||
),
|
|
||||||
Text(
|
|
||||||
'USDT',
|
|
||||||
style: AppTextStyles.bodyMedium(context).copyWith(
|
|
||||||
color: colorScheme.onSurfaceVariant,
|
|
||||||
fontWeight: FontWeight.w500,
|
|
||||||
),
|
|
||||||
),
|
|
||||||
],
|
|
||||||
),
|
|
||||||
),
|
),
|
||||||
const SizedBox(height: 10),
|
const SizedBox(height: 10),
|
||||||
|
|
||||||
|
|||||||
@@ -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,59 +232,25 @@ class _WithdrawPageState extends State<WithdrawPage> {
|
|||||||
}
|
}
|
||||||
|
|
||||||
Widget _buildAmountInput(ColorScheme colorScheme) {
|
Widget _buildAmountInput(ColorScheme colorScheme) {
|
||||||
return Container(
|
return MaterialInput(
|
||||||
width: double.infinity,
|
controller: _amountController,
|
||||||
height: 52,
|
focusNode: _amountFocus,
|
||||||
decoration: BoxDecoration(
|
labelText: '提現金額',
|
||||||
color: colorScheme.surface,
|
hintText: '0.00',
|
||||||
borderRadius: BorderRadius.circular(14),
|
keyboardType: const TextInputType.numberWithOptions(decimal: true),
|
||||||
border: Border.all(
|
inputFormatters: [
|
||||||
color: _amountFocus.hasFocus
|
FilteringTextInputFormatter.allow(RegExp(r'^\d*\.?\d{0,8}')),
|
||||||
? colorScheme.secondary
|
],
|
||||||
: colorScheme.outlineVariant.withValues(alpha: 0.5),
|
suffixIcon: Padding(
|
||||||
width: 1,
|
padding: const EdgeInsets.only(right: AppSpacing.md),
|
||||||
|
child: Text(
|
||||||
|
'USDT',
|
||||||
|
style: AppTextStyles.bodyMedium(context).copyWith(
|
||||||
|
color: colorScheme.onSurfaceVariant,
|
||||||
|
fontWeight: FontWeight.w500,
|
||||||
|
),
|
||||||
),
|
),
|
||||||
),
|
),
|
||||||
padding: const EdgeInsets.symmetric(horizontal: 16),
|
|
||||||
child: Row(
|
|
||||||
children: [
|
|
||||||
Expanded(
|
|
||||||
child: TextField(
|
|
||||||
controller: _amountController,
|
|
||||||
focusNode: _amountFocus,
|
|
||||||
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',
|
|
||||||
hintStyle: TextStyle(
|
|
||||||
fontSize: 24,
|
|
||||||
fontWeight: FontWeight.w600,
|
|
||||||
color:
|
|
||||||
colorScheme.onSurfaceVariant.withValues(alpha: 0.3),
|
|
||||||
),
|
|
||||||
border: InputBorder.none,
|
|
||||||
contentPadding: EdgeInsets.zero,
|
|
||||||
isDense: true,
|
|
||||||
),
|
|
||||||
),
|
|
||||||
),
|
|
||||||
Text(
|
|
||||||
'USDT',
|
|
||||||
style: AppTextStyles.bodyMedium(context).copyWith(
|
|
||||||
color: colorScheme.onSurfaceVariant,
|
|
||||||
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,
|
controller: _addressController,
|
||||||
height: 48,
|
labelText: '目標地址',
|
||||||
decoration: BoxDecoration(
|
hintText: '請輸入提現地址',
|
||||||
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,
|
|
||||||
style: AppTextStyles.bodyMedium(context),
|
|
||||||
decoration: InputDecoration(
|
|
||||||
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,
|
controller: _contactController,
|
||||||
height: 48,
|
labelText: '聯繫方式(可選)',
|
||||||
decoration: BoxDecoration(
|
hintText: '方便客服與您聯繫',
|
||||||
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,
|
|
||||||
style: AppTextStyles.bodyMedium(context),
|
|
||||||
decoration: InputDecoration(
|
|
||||||
hintText: '方便客服與您聯繫',
|
|
||||||
hintStyle: AppTextStyles.bodyMedium(context).copyWith(
|
|
||||||
color: colorScheme.onSurfaceVariant.withValues(alpha: 0.5),
|
|
||||||
),
|
|
||||||
border: InputBorder.none,
|
|
||||||
contentPadding: EdgeInsets.zero,
|
|
||||||
isDense: true,
|
|
||||||
),
|
|
||||||
),
|
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
Reference in New Issue
Block a user