style(reward): 优化奖励中心金币图标
This commit is contained in:
1 parent
bea08110c9
commit
9ef78ad670
3 files changed
+51
-18
No files matched your search
@@ -149,7 +149,7 @@ class _Balance extends StatelessWidget {
|
|||||||
),
|
),
|
||||||
),
|
),
|
||||||
const SizedBox(width: AppDimens.spaceSm),
|
const SizedBox(width: AppDimens.spaceSm),
|
||||||
const RewardCoinIcon(size: 32),
|
const RewardCoinIcon(key: Key('reward-balance-coin-icon'), size: 32),
|
||||||
],
|
],
|
||||||
);
|
);
|
||||||
if (onOpenWallet == null) return content;
|
if (onOpenWallet == null) return content;
|
||||||
|
|||||||
@@ -7,6 +7,10 @@ import '../../core/theme/app_colors.dart';
|
|||||||
|
|
||||||
const double _coinInnerInsetRatio = 0.1;
|
const double _coinInnerInsetRatio = 0.1;
|
||||||
const double _coinLetterRatio = 0.46;
|
const double _coinLetterRatio = 0.46;
|
||||||
|
const double _coinHighlightRatio = 0.18;
|
||||||
|
const double _coinHighlightOpacity = 0.54;
|
||||||
|
const double _coinLetterShadowBlur = 1.5;
|
||||||
|
const double _coinLetterShadowOffset = 0.8;
|
||||||
const double _taskIconSize = 46;
|
const double _taskIconSize = 46;
|
||||||
const double _taskIconRadius = 12;
|
const double _taskIconRadius = 12;
|
||||||
const double _taskGlyphSize = 24;
|
const double _taskGlyphSize = 24;
|
||||||
@@ -20,6 +24,8 @@ const Color _coinOuter = Color(0xFFF6B84E);
|
|||||||
const Color _coinInnerStart = Color(0xFFFFD98B);
|
const Color _coinInnerStart = Color(0xFFFFD98B);
|
||||||
const Color _coinInnerEnd = Color(0xFFE39B31);
|
const Color _coinInnerEnd = Color(0xFFE39B31);
|
||||||
const Color _coinBorder = Color(0xFFFFE0A1);
|
const Color _coinBorder = Color(0xFFFFE0A1);
|
||||||
|
const Color _coinHighlight = Color(0xFFFFF4CC);
|
||||||
|
const Color _coinLetterShadow = Color(0xFFB66A16);
|
||||||
const Color _taskIconStart = Color(0xFF4C171E);
|
const Color _taskIconStart = Color(0xFF4C171E);
|
||||||
const Color _taskIconEnd = Color(0xFF281014);
|
const Color _taskIconEnd = Color(0xFF281014);
|
||||||
const Color _taskIconSurface = Color(0xFF202022);
|
const Color _taskIconSurface = Color(0xFF202022);
|
||||||
@@ -42,26 +48,52 @@ class RewardCoinIcon extends StatelessWidget {
|
|||||||
color: _coinOuter,
|
color: _coinOuter,
|
||||||
boxShadow: [BoxShadow(color: Color(0x4DF6B84E), blurRadius: 6)],
|
boxShadow: [BoxShadow(color: Color(0x4DF6B84E), blurRadius: 6)],
|
||||||
),
|
),
|
||||||
child: Container(
|
child: Stack(
|
||||||
alignment: Alignment.center,
|
alignment: Alignment.center,
|
||||||
decoration: BoxDecoration(
|
children: [
|
||||||
shape: BoxShape.circle,
|
Container(
|
||||||
gradient: const LinearGradient(
|
decoration: BoxDecoration(
|
||||||
begin: Alignment.topLeft,
|
shape: BoxShape.circle,
|
||||||
end: Alignment.bottomRight,
|
gradient: const LinearGradient(
|
||||||
colors: [_coinInnerStart, _coinInnerEnd],
|
begin: Alignment.topLeft,
|
||||||
|
end: Alignment.bottomRight,
|
||||||
|
colors: [_coinInnerStart, _coinInnerEnd],
|
||||||
|
),
|
||||||
|
border: Border.all(color: _coinBorder),
|
||||||
|
),
|
||||||
),
|
),
|
||||||
border: Border.all(color: _coinBorder),
|
Positioned(
|
||||||
),
|
top: size * 0.12,
|
||||||
child: Text(
|
left: size * 0.18,
|
||||||
'N',
|
child: Container(
|
||||||
style: TextStyle(
|
width: size * _coinHighlightRatio,
|
||||||
color: AppColors.textPrimary,
|
height: size * _coinHighlightRatio,
|
||||||
fontSize: size * _coinLetterRatio,
|
decoration: BoxDecoration(
|
||||||
fontWeight: FontWeight.w900,
|
shape: BoxShape.circle,
|
||||||
height: 1,
|
color: _coinHighlight.withValues(alpha: _coinHighlightOpacity),
|
||||||
|
),
|
||||||
|
),
|
||||||
),
|
),
|
||||||
),
|
Text(
|
||||||
|
'N',
|
||||||
|
style: TextStyle(
|
||||||
|
color: AppColors.textPrimary,
|
||||||
|
fontSize: size * _coinLetterRatio,
|
||||||
|
fontWeight: FontWeight.w900,
|
||||||
|
height: 1,
|
||||||
|
shadows: const [
|
||||||
|
Shadow(
|
||||||
|
color: _coinLetterShadow,
|
||||||
|
blurRadius: _coinLetterShadowBlur,
|
||||||
|
offset: Offset(
|
||||||
|
_coinLetterShadowOffset,
|
||||||
|
_coinLetterShadowOffset,
|
||||||
|
),
|
||||||
|
),
|
||||||
|
],
|
||||||
|
),
|
||||||
|
),
|
||||||
|
],
|
||||||
),
|
),
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -48,6 +48,7 @@ void main() {
|
|||||||
expect(find.byKey(const Key('reward-back-button')), findsOneWidget);
|
expect(find.byKey(const Key('reward-back-button')), findsOneWidget);
|
||||||
expect(find.byKey(const Key('reward-help-button')), findsOneWidget);
|
expect(find.byKey(const Key('reward-help-button')), findsOneWidget);
|
||||||
expect(find.byKey(const Key('reward-balance')), findsOneWidget);
|
expect(find.byKey(const Key('reward-balance')), findsOneWidget);
|
||||||
|
expect(find.byKey(const Key('reward-balance-coin-icon')), findsOneWidget);
|
||||||
expect(find.byKey(const Key('reward-checkin-card')), findsOneWidget);
|
expect(find.byKey(const Key('reward-checkin-card')), findsOneWidget);
|
||||||
expect(find.byKey(const Key('reward-checkin-action')), findsOneWidget);
|
expect(find.byKey(const Key('reward-checkin-action')), findsOneWidget);
|
||||||
expect(find.byKey(const Key('reward-section-DAILY')), findsOneWidget);
|
expect(find.byKey(const Key('reward-section-DAILY')), findsOneWidget);
|
||||||
|
|||||||
Reference in new issue
Block a user