197 lines
6.0 KiB
Dart
197 lines
6.0 KiB
Dart
// Author: fruit.com.cn
|
|
|
|
part of '../discover_view.dart';
|
|
|
|
class _HomeDramaGrid extends StatelessWidget {
|
|
const _HomeDramaGrid({
|
|
required this.l10n,
|
|
required this.categories,
|
|
required this.onOpen,
|
|
});
|
|
|
|
final AppLocalizations l10n;
|
|
final CategoryController categories;
|
|
final ValueChanged<Drama> onOpen;
|
|
|
|
@override
|
|
Widget build(BuildContext context) {
|
|
if (categories.loading && categories.feed.sections.isEmpty) {
|
|
return const SliverFillRemaining(
|
|
hasScrollBody: false,
|
|
child: Center(child: CircularProgressIndicator(strokeWidth: 2)),
|
|
);
|
|
}
|
|
if (categories.error != null) {
|
|
return _fill(
|
|
EmptyState(
|
|
key: const Key('home-categories-error'),
|
|
icon: Icons.cloud_off_rounded,
|
|
title: l10n.categoriesError,
|
|
subtitle: l10n.emptyHint,
|
|
actionLabel: l10n.retry,
|
|
onAction: categories.load,
|
|
),
|
|
);
|
|
}
|
|
|
|
final dramas = categories.visibleDramas;
|
|
if (dramas.isEmpty) {
|
|
final missingCategory = categories.selectedSectionMissing;
|
|
return _fill(
|
|
EmptyState(
|
|
key: const Key('home-all-dramas-empty'),
|
|
icon: missingCategory
|
|
? Icons.grid_view_rounded
|
|
: Icons.search_off_rounded,
|
|
title: missingCategory ? l10n.noCategoryDramas : l10n.noSearchResults,
|
|
subtitle: l10n.emptyHint,
|
|
),
|
|
);
|
|
}
|
|
|
|
return SliverMainAxisGroup(
|
|
slivers: [
|
|
_dramaGrid(dramas),
|
|
const SliverToBoxAdapter(child: SizedBox(height: 24)),
|
|
],
|
|
);
|
|
}
|
|
|
|
Widget _dramaGrid(List<Drama> dramas) => SliverPadding(
|
|
key: const Key('home-all-dramas-section'),
|
|
padding: const EdgeInsets.symmetric(horizontal: AppDimens.pageHorizontal),
|
|
sliver: SliverGrid(
|
|
key: const Key('home-all-dramas-grid'),
|
|
gridDelegate: const SliverGridDelegateWithFixedCrossAxisCount(
|
|
crossAxisCount: 3,
|
|
mainAxisSpacing: 14,
|
|
crossAxisSpacing: 10,
|
|
childAspectRatio: 2 / 3,
|
|
),
|
|
delegate: SliverChildBuilderDelegate(
|
|
(context, index) => _HomeDramaCard(
|
|
l10n: l10n,
|
|
drama: dramas[index],
|
|
onTap: () => onOpen(dramas[index]),
|
|
),
|
|
childCount: dramas.length,
|
|
),
|
|
),
|
|
);
|
|
|
|
Widget _fill(Widget child) {
|
|
return SliverFillRemaining(hasScrollBody: false, child: child);
|
|
}
|
|
}
|
|
|
|
class _HomeDramaCard extends StatelessWidget {
|
|
const _HomeDramaCard({
|
|
required this.l10n,
|
|
required this.drama,
|
|
required this.onTap,
|
|
});
|
|
|
|
final AppLocalizations l10n;
|
|
final Drama drama;
|
|
final VoidCallback onTap;
|
|
|
|
@override
|
|
Widget build(BuildContext context) {
|
|
final genre = drama.genre.isEmpty ? drama.category : drama.genre;
|
|
return InkWell(
|
|
key: Key('home-drama-card-${drama.id}'),
|
|
onTap: onTap,
|
|
borderRadius: BorderRadius.circular(AppDimens.cardRadius),
|
|
child: AspectRatio(
|
|
key: Key('home-drama-cover-${drama.id}'),
|
|
aspectRatio: 2 / 3,
|
|
child: ClipRRect(
|
|
borderRadius: BorderRadius.circular(AppDimens.cardRadius),
|
|
child: Stack(
|
|
fit: StackFit.expand,
|
|
children: [
|
|
RemoteImage(
|
|
drama.posterUrl,
|
|
fit: BoxFit.cover,
|
|
showFallbackIcon: true,
|
|
),
|
|
const DecoratedBox(
|
|
decoration: BoxDecoration(
|
|
gradient: LinearGradient(
|
|
begin: Alignment.topCenter,
|
|
end: Alignment.bottomCenter,
|
|
colors: [Color(0x00000000), Color(0xE6100C0A)],
|
|
stops: [0.42, 1],
|
|
),
|
|
),
|
|
),
|
|
if (drama.isHot)
|
|
Positioned(
|
|
top: 8,
|
|
left: 8,
|
|
child: DecoratedBox(
|
|
decoration: BoxDecoration(
|
|
color: AppColors.blue,
|
|
borderRadius: BorderRadius.circular(6),
|
|
),
|
|
child: Padding(
|
|
padding: const EdgeInsets.symmetric(
|
|
horizontal: 6,
|
|
vertical: 2,
|
|
),
|
|
child: Text(
|
|
l10n.hot,
|
|
style: const TextStyle(
|
|
color: AppColors.onPrimary,
|
|
fontSize: AppDimens.caption,
|
|
fontWeight: FontWeight.w800,
|
|
height: 1.1,
|
|
),
|
|
),
|
|
),
|
|
),
|
|
),
|
|
Positioned(
|
|
left: 10,
|
|
right: 10,
|
|
bottom: 10,
|
|
child: Column(
|
|
crossAxisAlignment: CrossAxisAlignment.start,
|
|
mainAxisSize: MainAxisSize.min,
|
|
children: [
|
|
Text(
|
|
drama.title,
|
|
key: Key('home-drama-title-${drama.id}'),
|
|
maxLines: 2,
|
|
overflow: TextOverflow.ellipsis,
|
|
style: const TextStyle(
|
|
color: AppColors.cream,
|
|
fontSize: AppDimens.body,
|
|
fontWeight: FontWeight.w800,
|
|
height: 1.15,
|
|
),
|
|
),
|
|
const SizedBox(height: 4),
|
|
Text(
|
|
genre.isEmpty ? l10n.videoPending : genre,
|
|
key: Key('home-drama-genre-${drama.id}'),
|
|
maxLines: 1,
|
|
overflow: TextOverflow.ellipsis,
|
|
style: const TextStyle(
|
|
color: AppColors.cream,
|
|
fontSize: AppDimens.caption,
|
|
fontWeight: FontWeight.w400,
|
|
height: 1.2,
|
|
),
|
|
),
|
|
],
|
|
),
|
|
),
|
|
],
|
|
),
|
|
),
|
|
),
|
|
);
|
|
}
|
|
}
|