mirror of
https://github.com/R0m1k3/xtremobile.git
synced 2026-10-11 17:29:26 +02:00
Porting the palette was not enough: the Warm Cinema charter only reached the widgets that read from AppColors. Nineteen screen and widget files still painted Apple TV values inline, so the app kept showing blue — most visibly on the selected navigation pill. Swept out: - 0xFF0A84FF (Apple blue) on the selected nav pill, category card icons and the "add playlist" button - 0xFF4FC3F7 and 0xFF1565C0 in the player overlays - Colors.blueAccent / Colors.blue in dialogs - Apple greys 1C1C1E / 2C2C2E / 3A3A3C / 8E8E93 -> warm charcoals - 128 Colors.white* -> the onSurfaceNN cream ladder (a pure white on a warm ground reads blue, which is the charter's whole point) - Colors.red / green / amber / yellow / grey* -> error, success, ratingGold, outlineVariant - pure black ink on light fills -> onPrimaryFixed, a warm near-black - the white focus glow -> an ember glow Deliberately left true black: the video surface backgrounds and the scrims over posters and video, where a warm tint would clash with the picture. Adds the onPrimaryFixed / primaryFixed / onSurface70 tokens the sweep needed. Verified: no Material or Apple colour literal remains outside lib/core/theme; flutter analyze reports no errors; 19/19 tests pass; release APK builds. Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
173 lines
5.2 KiB
Dart
173 lines
5.2 KiB
Dart
import 'package:flutter/material.dart';
|
|
import 'package:cached_network_image/cached_network_image.dart';
|
|
import 'package:xtremobile/core/theme/app_decorations.dart';
|
|
import 'package:xtremobile/mobile/widgets/tv_focusable.dart';
|
|
import 'package:xtremobile/core/utils/image_cache_config.dart';
|
|
import 'package:xtremobile/core/theme/app_colors.dart';
|
|
|
|
class MobilePosterCard extends StatelessWidget {
|
|
final String title;
|
|
final String? imageUrl;
|
|
final String? rating;
|
|
final VoidCallback onTap;
|
|
final VoidCallback? onLongPress;
|
|
final bool isWatched;
|
|
final IconData placeholderIcon;
|
|
|
|
const MobilePosterCard({
|
|
super.key,
|
|
required this.title,
|
|
required this.imageUrl,
|
|
this.rating,
|
|
required this.onTap,
|
|
this.onLongPress,
|
|
this.isWatched = false,
|
|
this.placeholderIcon = Icons.movie,
|
|
});
|
|
|
|
@override
|
|
Widget build(BuildContext context) {
|
|
return Column(
|
|
mainAxisSize: MainAxisSize.min,
|
|
crossAxisAlignment: CrossAxisAlignment.center,
|
|
children: [
|
|
// FIXED Aspect Ratio for the image part to avoid stretching
|
|
AspectRatio(
|
|
aspectRatio: 2 / 3,
|
|
child: Container(
|
|
decoration: AppDecorations.glossyCard(context, radius: 12),
|
|
child: TVFocusable(
|
|
onPressed: onTap,
|
|
onLongPress: onLongPress,
|
|
borderRadius: BorderRadius.circular(12),
|
|
child: Stack(
|
|
fit: StackFit.expand,
|
|
children: [
|
|
// Image / placeholder (clipped)
|
|
ClipRRect(
|
|
borderRadius: BorderRadius.circular(12),
|
|
child: imageUrl != null && imageUrl!.isNotEmpty
|
|
? CachedNetworkImage(
|
|
imageUrl: imageUrl!,
|
|
fit: BoxFit.cover,
|
|
alignment: Alignment.center,
|
|
memCacheWidth: 200, // Increased for better quality
|
|
memCacheHeight: 300,
|
|
maxWidthDiskCache: 400,
|
|
maxHeightDiskCache: 600,
|
|
cacheManager: AppCacheManager.instance,
|
|
errorWidget: (_, __, ___) => _buildPlaceholder(context),
|
|
placeholder: (_, __) => _buildPlaceholder(context),
|
|
)
|
|
: _buildPlaceholder(context),
|
|
),
|
|
|
|
// Rating badge
|
|
if (rating != null && rating!.isNotEmpty)
|
|
_buildRatingBadge(),
|
|
|
|
// Watched badge
|
|
if (isWatched)
|
|
_buildWatchedBadge(),
|
|
|
|
// Glossy highlight overlay (top shimmer)
|
|
Positioned(
|
|
top: 0,
|
|
left: 0,
|
|
right: 0,
|
|
height: 60,
|
|
child: IgnorePointer(
|
|
child: Container(
|
|
decoration: AppDecorations.glossShimmer(context, radius: 12),
|
|
),
|
|
),
|
|
),
|
|
],
|
|
),
|
|
),
|
|
),
|
|
),
|
|
|
|
const SizedBox(height: 4),
|
|
|
|
// Title with fixed height to avoid pushing the image
|
|
SizedBox(
|
|
height: 16,
|
|
child: Padding(
|
|
padding: const EdgeInsets.symmetric(horizontal: 4),
|
|
child: Text(
|
|
title,
|
|
textAlign: TextAlign.center,
|
|
maxLines: 1,
|
|
overflow: TextOverflow.ellipsis,
|
|
style: TextStyle(
|
|
color: AppDecorations.textPrimary(context),
|
|
fontSize: 11,
|
|
fontWeight: FontWeight.w500,
|
|
),
|
|
),
|
|
),
|
|
),
|
|
],
|
|
);
|
|
}
|
|
|
|
Widget _buildPlaceholder(BuildContext context) {
|
|
return Container(
|
|
decoration: AppDecorations.channelCardBase(context),
|
|
child: Icon(
|
|
placeholderIcon,
|
|
color: AppDecorations.iconMuted(context),
|
|
),
|
|
);
|
|
}
|
|
|
|
Widget _buildRatingBadge() {
|
|
return Positioned(
|
|
top: 6,
|
|
left: 6,
|
|
child: Container(
|
|
padding: const EdgeInsets.symmetric(horizontal: 4, vertical: 2),
|
|
decoration: BoxDecoration(
|
|
color: Colors.black87,
|
|
borderRadius: BorderRadius.circular(4),
|
|
),
|
|
child: Row(
|
|
mainAxisSize: MainAxisSize.min,
|
|
children: [
|
|
const Icon(Icons.star, color: AppColors.ratingGold, size: 10),
|
|
const SizedBox(width: 2),
|
|
Text(
|
|
rating!,
|
|
style: const TextStyle(
|
|
color: AppColors.onSurface,
|
|
fontSize: 10,
|
|
fontWeight: FontWeight.bold,
|
|
),
|
|
),
|
|
],
|
|
),
|
|
),
|
|
);
|
|
}
|
|
|
|
Widget _buildWatchedBadge() {
|
|
return Positioned(
|
|
top: 6,
|
|
right: 6,
|
|
child: Container(
|
|
padding: const EdgeInsets.all(4),
|
|
decoration: const BoxDecoration(
|
|
color: AppColors.success,
|
|
shape: BoxShape.circle,
|
|
),
|
|
child: const Icon(
|
|
Icons.check,
|
|
size: 10,
|
|
color: AppColors.onSurface,
|
|
),
|
|
),
|
|
);
|
|
}
|
|
}
|