fix(flutter): 放大播放图标并加半透明底

This commit is contained in:
Zhou Weidong committed 2026-10-20 12:30:06 +08:00
1 parent 8013cc18ad
commit a72adcfc3f
2 files changed
+16 -9

No files matched your search

@@ -4,8 +4,9 @@ import 'package:flutter/material.dart';
import '../../../core/theme/app_colors.dart'; import '../../../core/theme/app_colors.dart';
const double _toggleSize = 72; const double _toggleSize = 84;
const double _iconSize = 40; const double _iconSize = 48;
const Color _toggleBackground = Colors.black26;
const List<Shadow> _iconShadows = [ const List<Shadow> _iconShadows = [
Shadow(color: Colors.black54, blurRadius: 12), Shadow(color: Colors.black54, blurRadius: 12),
]; ];
@@ -28,9 +29,13 @@ class PlayerCenterToggle extends StatelessWidget {
label: playing ? 'Pause' : 'Play', label: playing ? 'Pause' : 'Play',
child: GestureDetector( child: GestureDetector(
onTap: onTap, onTap: onTap,
child: SizedBox( child: Container(
width: _toggleSize, width: _toggleSize,
height: _toggleSize, height: _toggleSize,
decoration: const BoxDecoration(
color: _toggleBackground,
shape: BoxShape.circle,
),
child: Icon( child: Icon(
playing ? Icons.pause_rounded : Icons.play_arrow_rounded, playing ? Icons.pause_rounded : Icons.play_arrow_rounded,
color: AppColors.onPrimary, color: AppColors.onPrimary,
+8 -6
View File
@@ -6,7 +6,7 @@ import 'package:fruitshorts/core/theme/app_colors.dart';
import 'package:fruitshorts/pages/player/widgets/player_center_toggle.dart'; import 'package:fruitshorts/pages/player/widgets/player_center_toggle.dart';
void main() { void main() {
testWidgets('should_use_one_shared_72px_transparent_toggle_style', ( testWidgets('should_use_one_shared_84px_translucent_toggle_style', (
tester, tester,
) async { ) async {
await tester.pumpWidget( await tester.pumpWidget(
@@ -34,16 +34,18 @@ void main() {
Key('test-center-toggle-a'), Key('test-center-toggle-a'),
Key('player-play-toggle'), Key('player-play-toggle'),
]) { ]) {
expect(tester.getSize(find.byKey(key)), const Size(72, 72)); expect(tester.getSize(find.byKey(key)), const Size(84, 84));
// 暂停按钮改为透明背景,容器已不再绘制任何底色或装饰。 // 圆形底改为半透明黑色,不再是完全透明或蓝色实底。
expect( final container = tester.widget<Container>(
find.descendant(of: find.byKey(key), matching: find.byType(Container)), find.descendant(of: find.byKey(key), matching: find.byType(Container)),
findsNothing,
); );
final decoration = container.decoration! as BoxDecoration;
expect(decoration.color, Colors.black26);
expect(decoration.shape, BoxShape.circle);
final icon = tester.widget<Icon>( final icon = tester.widget<Icon>(
find.descendant(of: find.byKey(key), matching: find.byType(Icon)), find.descendant(of: find.byKey(key), matching: find.byType(Icon)),
); );
expect(icon.size, 40); expect(icon.size, 48);
expect(icon.color, AppColors.onPrimary); expect(icon.color, AppColors.onPrimary);
expect(icon.shadows, isNotNull); expect(icon.shadows, isNotNull);
expect(icon.shadows, isNotEmpty); expect(icon.shadows, isNotEmpty);