jianghaifeng/ReelShort
1
0 Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat(flutter): 完成 K28-A1 四 Tab 首页

Browse Source
This commit is contained in:
Zhou Weidong committed 2026-10-20 09:57:10 +08:00
1 parent f981f88e0d
commit 49f3e63ed0
25 files changed
+606 -689
Download Patch File Download Diff File Expand all files Collapse all files

No files matched your search

lib/pages/home/home_browse_view.dart
+41 -34
View File
@@ -10,16 +10,15 @@ import '../../core/data/models/home_feed.dart';
import '../../core/data/models/watch_progress.dart';
import '../../core/data/repositories/watch_history_repository.dart';
import '../../core/data/services/catalog_controller.dart';
import '../../core/data/services/category_controller.dart';
import '../../core/theme/app_colors.dart';
import '../../core/theme/app_dimens.dart';
import '../../core/widgets/empty_state.dart';
import '../../l10n/app_localizations.dart';
import '../discover/widgets/drama_grid.dart';
import '../discover/widgets/feed_banner_carousel.dart';
import '../mine/widgets/continue_watching_card.dart';
import 'home_browse_logic.dart';
import 'widgets/home_browse_header.dart';
import 'widgets/home_continue_watching.dart';
import 'widgets/home_drama_grid.dart';
/// Browse-first home page with channels, hero, continuation, and catalogue.
class HomeBrowseView extends StatefulWidget {
@@ -77,11 +76,7 @@ class _HomeBrowseViewState extends State<HomeBrowseView> {
Widget _page(BuildContext context) {
final l10n = AppLocalizations.of(context)!;
final categories = context.watch<CategoryController>();
final catalog = context.watch<CatalogController>();
final source = categories.feed.dramas.isEmpty
? catalog.dramas
: categories.feed.dramas;
return SafeArea(
bottom: false,
child: Column(
@@ -90,57 +85,58 @@ class _HomeBrowseViewState extends State<HomeBrowseView> {
onSearch: widget.onSearch,
onProfile: widget.onProfile,
),
Expanded(child: _body(l10n, categories, catalog, source)),
Expanded(child: _body(l10n, catalog)),
],
),
);
}
Widget _body(
AppLocalizations l10n,
CategoryController categories,
CatalogController catalog,
List<Drama> source,
) {
Widget _body(AppLocalizations l10n, CatalogController catalog) {
return RefreshIndicator(
key: const Key('home-refresh'),
color: AppColors.blue,
backgroundColor: AppColors.card,
onRefresh: () async {
await Future.wait([categories.load(), logic.refreshRecent()]);
await Future.wait([catalog.load(), logic.refreshRecent()]);
},
child: ListView(
key: const Key('home-browse-page'),
physics: const AlwaysScrollableScrollPhysics(),
padding: const EdgeInsets.only(bottom: AppDimens.spaceXl),
children: _sections(l10n, catalog, source),
children: _sections(l10n, catalog),
),
);
}
List<Widget> _sections(
AppLocalizations l10n,
CatalogController catalog,
List<Drama> source,
) {
List<Widget> _sections(AppLocalizations l10n, CatalogController catalog) {
final source = catalog.dramas;
final dramas = _channelDramas(source, logic.channel);
final continueItems = _continueItems(logic.recent, catalog.dramas);
final continueItem = _continueItem(logic.recent, catalog.dramas);
final banners = catalog.banners.isEmpty
? _fallbackBanners(source)
: catalog.banners;
return [
_channels(l10n),
if (catalog.banners.isNotEmpty) _hero(catalog.banners, source),
if (continueItems.isNotEmpty) ...[
if (banners.isNotEmpty) _hero(banners, source),
if (continueItem != null) ...[
_continueHeader(l10n),
HomeContinueWatching(
items: continueItems,
onPlay: (drama, record) =>
unawaited(widget.onOpenContinue(drama, record)),
ContinueWatchingCard(
cardKey: const Key('home-continue-watching'),
playButtonKey: Key('home-continue-play-${continueItem.drama.id}'),
progressKey: Key('home-continue-progress-${continueItem.drama.id}'),
showRemaining: true,
drama: continueItem.drama,
record: continueItem.record,
onResume: () => unawaited(
widget.onOpenContinue(continueItem.drama, continueItem.record),
),
),
],
_channelHeader(l10n),
if (dramas.isEmpty)
_empty()
else
DramaGrid(
HomeDramaGrid(
l10n: l10n,
dramas: dramas,
onOpen: (drama) => unawaited(widget.onOpenDrama(drama)),
@@ -148,6 +144,19 @@ class _HomeBrowseViewState extends State<HomeBrowseView> {
];
}
List<FeedBanner> _fallbackBanners(List<Drama> dramas) {
if (dramas.isEmpty) return const [];
final drama = dramas.first;
return [
FeedBanner(
id: 'home-fallback-${drama.id}',
imageUrl: drama.posterUrl,
linkType: 'DRAMA',
linkValue: drama.id,
),
];
}
Widget _continueHeader(AppLocalizations l10n) => _sectionHeader(
l10n.continueWatching,
actionKey: const Key('home-continue-all'),
@@ -314,20 +323,18 @@ class _HomeBrowseViewState extends State<HomeBrowseView> {
return null;
}
List<HomeContinueItem> _continueItems(
({Drama drama, WatchProgress record})? _continueItem(
List<WatchProgress> records,
List<Drama> dramas,
) {
final items = <HomeContinueItem>[];
for (final record in records) {
if (record.finished || !record.hasPosition) continue;
for (final drama in dramas) {
if (drama.id == record.dramaId) {
items.add((drama: drama, record: record));
break;
return (drama: drama, record: record);
}
}
}
return items;
return null;
}
}
lib/pages/home/widgets/home_continue_watching.dart
-147
View File
@@ -1,147 +0,0 @@
// Author: fruit.com.cn
import 'package:flutter/material.dart';
import '../../../core/data/models/drama.dart';
import '../../../core/data/models/watch_progress.dart';
import '../../../core/theme/app_colors.dart';
import '../../../core/theme/app_dimens.dart';
import '../../../core/widgets/remote_image.dart';
import '../../../l10n/app_localizations.dart';
const double _railHeight = 96;
const double _cardWidth = 286;
const double _coverWidth = 64;
const double _playSize = 34;
/// One drama/record pair rendered by the continuation rail.
typedef HomeContinueItem = ({Drama drama, WatchProgress record});
/// Home continuation cards for records that still have unwatched time.
class HomeContinueWatching extends StatelessWidget {
const HomeContinueWatching({
super.key,
required this.items,
required this.onPlay,
});
final List<HomeContinueItem> items;
final void Function(Drama drama, WatchProgress record) onPlay;
@override
Widget build(BuildContext context) {
if (items.isEmpty) return const SizedBox.shrink();
return SizedBox(
key: const Key('home-continue-watching'),
height: _railHeight,
child: ListView.separated(
scrollDirection: Axis.horizontal,
padding: const EdgeInsets.symmetric(
horizontal: AppDimens.pageHorizontal,
),
itemCount: items.length,
separatorBuilder: (_, _) => const SizedBox(width: AppDimens.spaceSm),
itemBuilder: (context, index) {
final item = items[index];
return _ContinueCard(
item: item,
onPlay: () => onPlay(item.drama, item.record),
);
},
),
);
}
}
class _ContinueCard extends StatelessWidget {
const _ContinueCard({required this.item, required this.onPlay});
final HomeContinueItem item;
final VoidCallback onPlay;
@override
Widget build(BuildContext context) {
final l10n = AppLocalizations.of(context)!;
return Container(
width: _cardWidth,
padding: const EdgeInsets.all(AppDimens.spaceSm),
decoration: BoxDecoration(
color: AppColors.card,
borderRadius: BorderRadius.circular(AppDimens.cardRadius),
),
child: Row(
children: [
ClipRRect(
borderRadius: BorderRadius.circular(AppDimens.innerRadius),
child: RemoteImage(
item.drama.posterUrl,
width: _coverWidth,
height: _railHeight - AppDimens.spaceLg,
),
),
const SizedBox(width: AppDimens.spaceSm),
Expanded(
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text(
item.drama.title,
maxLines: 1,
overflow: TextOverflow.ellipsis,
style: const TextStyle(
color: AppColors.onSurface,
fontSize: AppDimens.previewCardTitle,
fontWeight: FontWeight.w700,
),
),
const SizedBox(height: AppDimens.spaceXs),
Text(
_progressText(l10n, item.drama, item.record),
key: Key('home-continue-progress-${item.drama.id}'),
maxLines: 1,
overflow: TextOverflow.ellipsis,
style: const TextStyle(
color: AppColors.muted,
fontSize: AppDimens.cardMeta,
),
),
],
),
),
const SizedBox(width: AppDimens.spaceSm),
IconButton(
key: Key('home-continue-play-${item.drama.id}'),
onPressed: onPlay,
style: IconButton.styleFrom(
backgroundColor: AppColors.blue,
foregroundColor: AppColors.onPrimary,
fixedSize: const Size.square(_playSize),
padding: EdgeInsets.zero,
),
icon: const Icon(
Icons.play_arrow_rounded,
size: AppDimens.accountIcon,
),
),
],
),
);
}
String _progressText(
AppLocalizations l10n,
Drama drama,
WatchProgress record,
) {
final episode = drama.episodes.where(
(value) => value.id == record.episodeId,
);
final number = episode.isEmpty ? 1 : episode.first.number;
final remaining = record.duration - record.position;
final minutes = remaining.inSeconds <= 0
? 0
: (remaining.inSeconds / Duration.secondsPerMinute).ceil();
return l10n.episodeRemaining(number, minutes);
}
}
lib/pages/home/widgets/home_drama_grid.dart
+188
View File
@@ -0,0 +1,188 @@
// Author: fruit.com.cn
import 'package:flutter/material.dart';
import '../../../core/data/models/drama.dart';
import '../../../core/theme/app_colors.dart';
import '../../../core/theme/app_dimens.dart';
import '../../../core/widgets/remote_image.dart';
import '../../../l10n/app_localizations.dart';
const int _columns = 2;
const double _columnGap = 10;
const double _cardGap = 10;
const double _coverAspectRatio = 3 / 4;
/// Two-column drama grid used by the browse-first home page.
class HomeDramaGrid extends StatelessWidget {
const HomeDramaGrid({
super.key,
required this.l10n,
required this.dramas,
required this.onOpen,
});
final AppLocalizations l10n;
final List<Drama> dramas;
final ValueChanged<Drama> onOpen;
@override
Widget build(BuildContext context) {
return Padding(
key: const Key('home-popular-grid'),
padding: const EdgeInsets.symmetric(horizontal: AppDimens.pageHorizontal),
child: Row(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Expanded(child: _column(0)),
const SizedBox(width: _columnGap),
Expanded(child: _column(1)),
],
),
);
}
Widget _column(int start) {
final children = <Widget>[];
for (var index = start; index < dramas.length; index += _columns) {
final drama = dramas[index];
children.add(
HomeDramaCard(l10n: l10n, drama: drama, onTap: () => onOpen(drama)),
);
if (index + _columns < dramas.length) {
children.add(const SizedBox(height: _cardGap));
}
}
return Column(children: children);
}
}
/// Home catalogue card with title, genre, free badge, episode count, and heat.
class HomeDramaCard extends StatelessWidget {
const HomeDramaCard({
super.key,
required this.l10n,
required this.drama,
required this.onTap,
});
final AppLocalizations l10n;
final Drama drama;
final VoidCallback onTap;
@override
Widget build(BuildContext context) {
return InkWell(
key: Key('home-drama-card-${drama.id}'),
onTap: onTap,
borderRadius: BorderRadius.circular(AppDimens.coverRadius),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
_cover(),
const SizedBox(height: AppDimens.spaceXs),
_title(),
const SizedBox(height: 2),
_genre(),
const SizedBox(height: AppDimens.spaceXs),
_metadata(),
],
),
);
}
Widget _cover() {
return ClipRRect(
key: Key('home-drama-cover-${drama.id}'),
borderRadius: BorderRadius.circular(AppDimens.coverRadius),
child: Stack(
children: [
RemoteImage(
drama.posterUrl,
width: double.infinity,
fit: BoxFit.fitWidth,
showFallbackIcon: true,
fallbackAspectRatio: _coverAspectRatio,
),
if (_isFree) Positioned(top: 6, left: 6, child: _freeBadge()),
],
),
);
}
bool get _isFree {
return drama.freeEpisodes > 0 ||
drama.episodes.any((episode) => episode.isFree);
}
Widget _freeBadge() {
return Container(
padding: const EdgeInsets.symmetric(horizontal: 6, vertical: 2),
decoration: BoxDecoration(
color: AppColors.blue,
borderRadius: BorderRadius.circular(6),
),
child: Text(
l10n.free,
style: const TextStyle(
color: AppColors.onPrimary,
fontSize: AppDimens.cardMeta,
fontWeight: FontWeight.w800,
),
),
);
}
Widget _title() {
return Text(
drama.title,
key: Key('home-drama-title-${drama.id}'),
maxLines: 1,
overflow: TextOverflow.ellipsis,
style: const TextStyle(
color: AppColors.onSurface,
fontSize: AppDimens.previewSectionTitle,
fontWeight: FontWeight.w800,
),
);
}
Widget _genre() {
final genre = drama.genre.isEmpty ? drama.category : drama.genre;
return Text(
genre.isEmpty ? l10n.videoPending : genre,
key: Key('home-drama-genre-${drama.id}'),
maxLines: 1,
overflow: TextOverflow.ellipsis,
style: const TextStyle(
color: AppColors.muted,
fontSize: AppDimens.cardMeta,
),
);
}
Widget _metadata() {
return Wrap(
spacing: AppDimens.spaceSm,
runSpacing: AppDimens.spaceXs,
children: [
Text(
l10n.episodeCount(drama.episodeCount),
key: Key('home-drama-episode-count-${drama.id}'),
style: const TextStyle(
color: AppColors.subtle,
fontSize: AppDimens.cardViews,
),
),
Text(
l10n.viewCountLabel(drama.viewCount),
key: Key('home-drama-views-${drama.id}'),
style: const TextStyle(
color: AppColors.subtle,
fontSize: AppDimens.cardViews,
),
),
],
);
}
}
lib/pages/home/widgets/home_menu_sheet.dart
+1 -1
View File
@@ -74,7 +74,7 @@ class HomeMenuSheet extends StatelessWidget {
_item(
key: const Key('drawer-discover'),
icon: Icons.explore_outlined,
label: l10n.theaterTab,
label: l10n.discoverTab,
onTap: () => closeThen(onDiscover),
),
_item(