style: 调整搜索结果两列布局

2026-10-22 22:50:47 +08:00
1 parent 0319f8a6a8
commit 8637f5da21
@@ -0,0 +1,104 @@
+// 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/cover_play_count.dart';
+import '../../../core/widgets/remote_image.dart';
+
+class SearchResultCard extends StatelessWidget {
+  const SearchResultCard({super.key, required this.drama, required this.onTap});
+
+  final Drama drama;
+  final VoidCallback onTap;
+
+  @override
+  Widget build(BuildContext context) {
+    final tags = _tags();
+    return Material(
+      key: Key('search-result-card-${drama.id}'),
+      color: AppColors.transparent,
+      child: InkWell(
+        borderRadius: BorderRadius.circular(AppDimens.cardCoverRadius),
+        onTap: onTap,
+        child: Column(
+          crossAxisAlignment: CrossAxisAlignment.start,
+          children: [
+            ClipRRect(
+              borderRadius: BorderRadius.circular(AppDimens.cardCoverRadius),
+              child: AspectRatio(
+                key: Key('search-result-cover-${drama.id}'),
+                aspectRatio: AppDimens.cardCoverAspectRatio,
+                child: Stack(
+                  fit: StackFit.expand,
+                  children: [
+                    RemoteImage(
+                      drama.posterUrl,
+                      fit: BoxFit.cover,
+                      showFallbackIcon: true,
+                      fallbackColor: AppColors.contentSurface,
+                    ),
+                    const Positioned(
+                      left: 0,
+                      right: 0,
+                      bottom: 0,
+                      child: CoverBottomScrim(),
+                    ),
+                    Positioned(
+                      right: AppDimens.cardPlayCountRight,
+                      bottom: AppDimens.cardPlayCountBottom,
+                      child: CoverPlayCount(
+                        key: Key('search-result-views-${drama.id}'),
+                        count: drama.viewCount,
+                      ),
+                    ),
+                  ],
+                ),
+              ),
+            ),
+            const SizedBox(height: AppDimens.searchResultTitleGap),
+            Text(
+              drama.title,
+              key: Key('search-result-title-${drama.id}'),
+              maxLines: 2,
+              overflow: TextOverflow.ellipsis,
+              textAlign: TextAlign.left,
+              style: const TextStyle(
+                color: AppColors.textPrimary,
+                fontSize: AppDimens.cardTitleFont,
+                fontWeight: FontWeight.w500,
+                height: AppDimens.cardTitleLineHeight,
+              ),
+            ),
+            if (tags.isNotEmpty) ...[
+              const SizedBox(height: AppDimens.searchResultMetaGap),
+              Text(
+                tags.join(' | '),
+                key: Key('search-result-tags-${drama.id}'),
+                maxLines: 1,
+                overflow: TextOverflow.ellipsis,
+                textAlign: TextAlign.left,
+                style: const TextStyle(
+                  color: AppColors.searchResultMeta,
+                  fontSize: AppDimens.searchResultMetaFont,
+                ),
+              ),
+            ],
+          ],
+        ),
+      ),
+    );
+  }
+
+  List<String> _tags() {
+    final seen = <String>{};
+    return [drama.genre, drama.category]
+        .expand((value) => value.split(RegExp(r'[,/、·]')))
+        .map((value) => value.trim())
+        .where((value) => value.isNotEmpty && seen.add(value))
+        .take(3)
+        .toList(growable: false);
+  }
+}