diff --git a/assets/icon/rail/rail_comment.png b/assets/icon/rail/rail_comment.png new file mode 100644 index 0000000..cc358c1 Binary files /dev/null and b/assets/icon/rail/rail_comment.png differ diff --git a/assets/icon/rail/rail_like.png b/assets/icon/rail/rail_like.png new file mode 100644 index 0000000..5873e98 Binary files /dev/null and b/assets/icon/rail/rail_like.png differ diff --git a/assets/icon/rail/rail_save.png b/assets/icon/rail/rail_save.png new file mode 100644 index 0000000..0d97486 Binary files /dev/null and b/assets/icon/rail/rail_save.png differ diff --git a/assets/icon/rail/rail_share.png b/assets/icon/rail/rail_share.png new file mode 100644 index 0000000..59c7921 Binary files /dev/null and b/assets/icon/rail/rail_share.png differ diff --git a/lib/pages/player/widgets/home_feed_overlay.dart b/lib/pages/player/widgets/home_feed_overlay.dart index 41a1a84..d841bce 100644 --- a/lib/pages/player/widgets/home_feed_overlay.dart +++ b/lib/pages/player/widgets/home_feed_overlay.dart @@ -173,8 +173,7 @@ class _HomeFeedOverlayState extends State { items: [ InteractionRailItem( key: const Key('rail-save'), - icon: Icons.star_rounded, - activeIcon: Icons.star_rounded, + asset: 'assets/icon/rail/rail_save.png', label: widget.l10n.favorite, count: widget.favoriteCount, countKey: const Key('rail-save-count'), @@ -183,8 +182,7 @@ class _HomeFeedOverlayState extends State { ), InteractionRailItem( key: const Key('rail-comments'), - icon: Icons.chat_bubble_outline_rounded, - activeIcon: Icons.chat_bubble_rounded, + asset: 'assets/icon/rail/rail_comment.png', label: widget.l10n.comments, count: widget.commentCount, countKey: const Key('rail-comments-count'), @@ -192,8 +190,7 @@ class _HomeFeedOverlayState extends State { ), InteractionRailItem( key: const Key('rail-like'), - icon: Icons.favorite_rounded, - activeIcon: Icons.favorite_rounded, + asset: 'assets/icon/rail/rail_like.png', label: widget.l10n.like, count: widget.likeCount, countKey: const Key('rail-like-count'), @@ -202,10 +199,8 @@ class _HomeFeedOverlayState extends State { ), InteractionRailItem( key: const Key('rail-share'), - icon: Icons.reply_rounded, - activeIcon: Icons.reply_rounded, + asset: 'assets/icon/rail/rail_share.png', label: widget.l10n.share, - mirrorIcon: true, onTap: widget.onShare, ), ], diff --git a/lib/pages/player/widgets/interaction_rail.dart b/lib/pages/player/widgets/interaction_rail.dart index dcd19e5..f3ff832 100644 --- a/lib/pages/player/widgets/interaction_rail.dart +++ b/lib/pages/player/widgets/interaction_rail.dart @@ -6,32 +6,28 @@ import '../../../core/formatting/count_format.dart'; import '../../../core/theme/app_colors.dart'; const double _buttonSize = 44; -const double _iconSize = 30; -const double _itemGap = 22; +const double _iconSize = 32; +const double _itemGap = 24; /// 互动栏单项：图标、计数与点击。 class InteractionRailItem { const InteractionRailItem({ required this.key, - required this.icon, - required this.activeIcon, + required this.asset, required this.label, required this.onTap, this.count, this.countKey, this.selected = false, - this.mirrorIcon = false, }); final Key key; - final IconData icon; - final IconData activeIcon; + final String asset; final String label; final VoidCallback onTap; final int? count; final Key? countKey; final bool selected; - final bool mirrorIcon; } /// 播放页与首页 feed 共用的右侧互动栏：收藏/评论/喜欢/分享。 @@ -61,10 +57,6 @@ class _RailButton extends StatelessWidget { @override Widget build(BuildContext context) { - final icon = Icon( - item.selected ? item.activeIcon : item.icon, - size: _iconSize, - ); return Column( key: item.key, mainAxisSize: MainAxisSize.min, @@ -74,10 +66,14 @@ class _RailButton extends StatelessWidget { child: IconButton( onPressed: item.onTap, padding: EdgeInsets.zero, - color: item.selected ? AppColors.blue : Colors.white, - icon: item.mirrorIcon - ? Transform.flip(flipX: true, child: icon) - : icon, + icon: Image.asset( + item.asset, + width: _iconSize, + height: _iconSize, + fit: BoxFit.contain, + color: item.selected ? AppColors.blue : Colors.white, + colorBlendMode: BlendMode.srcIn, + ), ), ), const SizedBox(height: 2), diff --git a/lib/pages/player/widgets/player_overlay.dart b/lib/pages/player/widgets/player_overlay.dart index f89e7ea..9896595 100644 --- a/lib/pages/player/widgets/player_overlay.dart +++ b/lib/pages/player/widgets/player_overlay.dart @@ -147,8 +147,7 @@ class PlayerPlaybackOverlay extends StatelessWidget { items: [ InteractionRailItem( key: const Key('player-rail-save'), - icon: Icons.star_rounded, - activeIcon: Icons.star_rounded, + asset: 'assets/icon/rail/rail_save.png', label: data.l10n.favorite, count: data.favoriteCount, countKey: const Key('player-rail-save-count'), @@ -157,8 +156,7 @@ class PlayerPlaybackOverlay extends StatelessWidget { ), InteractionRailItem( key: const Key('player-rail-comments'), - icon: Icons.chat_bubble_outline_rounded, - activeIcon: Icons.chat_bubble_rounded, + asset: 'assets/icon/rail/rail_comment.png', label: data.l10n.comments, count: data.commentCount, countKey: const Key('player-rail-comments-count'), @@ -166,8 +164,7 @@ class PlayerPlaybackOverlay extends StatelessWidget { ), InteractionRailItem( key: const Key('player-rail-like'), - icon: Icons.favorite_rounded, - activeIcon: Icons.favorite_rounded, + asset: 'assets/icon/rail/rail_like.png', label: data.l10n.like, count: data.likeCount, countKey: const Key('player-rail-like-count'), @@ -176,10 +173,8 @@ class PlayerPlaybackOverlay extends StatelessWidget { ), InteractionRailItem( key: const Key('player-rail-share'), - icon: Icons.reply_rounded, - activeIcon: Icons.reply_rounded, + asset: 'assets/icon/rail/rail_share.png', label: data.l10n.share, - mirrorIcon: true, onTap: actions.onShare, ), ], diff --git a/pubspec.yaml b/pubspec.yaml index 09d3088..5951cc5 100644 --- a/pubspec.yaml +++ b/pubspec.yaml @@ -83,6 +83,7 @@ flutter: assets: - assets/icon/splash_logo.png - assets/icon/splash_logo_android12.png + - assets/icon/rail/ # To add assets to your application, add an assets section, like this: # assets: diff --git a/test/home/home_preview_layout_test.dart b/test/home/home_preview_layout_test.dart index f01ab09..876b140 100644 --- a/test/home/home_preview_layout_test.dart +++ b/test/home/home_preview_layout_test.dart @@ -150,38 +150,33 @@ void main() { tester.widget(find.byKey(const Key('rail-comments-count'))).data, '12', ); + String railAsset(Key key) { + final image = tester.widget( + find.descendant(of: find.byKey(key), matching: find.byType(Image)), + ); + return (image.image as AssetImage).assetName; + } + + expect(railAsset(const Key('rail-save')), 'assets/icon/rail/rail_save.png'); expect( - find.descendant( - of: find.byKey(const Key('rail-save')), - matching: find.byIcon(Icons.star_rounded), - ), - findsOneWidget, + railAsset(const Key('rail-comments')), + 'assets/icon/rail/rail_comment.png', ); + expect(railAsset(const Key('rail-like')), 'assets/icon/rail/rail_like.png'); expect( - find.descendant( - of: find.byKey(const Key('rail-like')), - matching: find.byIcon(Icons.favorite_rounded), - ), - findsOneWidget, - ); - expect( - find.descendant( - of: find.byKey(const Key('rail-share')), - matching: find.byIcon(Icons.reply_rounded), - ), - findsOneWidget, + railAsset(const Key('rail-share')), + 'assets/icon/rail/rail_share.png', ); expect( tester - .widget( + .widget( find.descendant( of: find.byKey(const Key('rail-share')), - matching: find.byType(Transform), + matching: find.byType(Image), ), ) - .transform - .storage[0], - -1, + .colorBlendMode, + BlendMode.srcIn, ); expect(find.byKey(const Key('progress-loading')), findsOneWidget); expect(find.byKey(const Key('home-feed-progress-thumb')), findsNothing); diff --git a/test/player/player_fullscreen_test.dart b/test/player/player_fullscreen_test.dart index 14b6b1b..d47ee87 100644 --- a/test/player/player_fullscreen_test.dart +++ b/test/player/player_fullscreen_test.dart @@ -474,11 +474,11 @@ void main() { .getSize( find.descendant( of: find.byKey(const Key('player-rail-comments')), - matching: find.byIcon(Icons.chat_bubble_outline_rounded), + matching: find.byType(Image), ), ) .width, - 30, + 32, ); await tester.tap(find.byKey(const Key('player-synopsis-toggle'))); @@ -586,37 +586,31 @@ void main() { await _pumpApp(tester); await _openSeriesPlayer(tester); - Finder railIcon(Key key, IconData icon) => - find.descendant(of: find.byKey(key), matching: find.byIcon(icon)); expect( - railIcon(const Key('player-rail-save'), Icons.star_rounded), - findsOneWidget, + _railAssetName(tester, const Key('player-rail-save')), + 'assets/icon/rail/rail_save.png', ); expect( - railIcon(const Key('player-rail-like'), Icons.favorite_rounded), - findsOneWidget, + _railAssetName(tester, const Key('player-rail-comments')), + 'assets/icon/rail/rail_comment.png', ); expect( - railIcon( - const Key('player-rail-comments'), - Icons.chat_bubble_outline_rounded, - ), - findsOneWidget, + _railAssetName(tester, const Key('player-rail-like')), + 'assets/icon/rail/rail_like.png', ); - final shareIcon = railIcon( - const Key('player-rail-share'), - Icons.reply_rounded, + expect( + _railAssetName(tester, const Key('player-rail-share')), + 'assets/icon/rail/rail_share.png', ); - expect(shareIcon, findsOneWidget); - expect(tester.widget(shareIcon).size, 30); - - final mirror = tester.widget( + final shareImage = tester.widget( find.descendant( of: find.byKey(const Key('player-rail-share')), - matching: find.byType(Transform), + matching: find.byType(Image), ), ); - expect(mirror.transform.storage[0], -1); + expect(shareImage.width, 32); + expect(shareImage.height, 32); + expect(shareImage.colorBlendMode, BlendMode.srcIn); final saveButton = tester.widget( find.descendant( @@ -1132,6 +1126,13 @@ void main() { }); } +String _railAssetName(WidgetTester tester, Key itemKey) { + final image = tester.widget( + find.descendant(of: find.byKey(itemKey), matching: find.byType(Image)), + ); + return (image.image as AssetImage).assetName; +} + void _expectPlayerNavigationBar(WidgetTester tester) { final overlay = tester.widget>( find.byKey(const Key('player-system-overlay')).last,