opt: 首页推荐栏布局

This commit is contained in:
guozhigq
2024-04-23 23:40:40 +08:00
parent 926c99001e
commit 31125435b1
4 changed files with 160 additions and 231 deletions

View File

@ -62,6 +62,7 @@ class OverlayPop extends StatelessWidget {
Expanded( Expanded(
child: Text( child: Text(
videoItem.title! as String, videoItem.title! as String,
style: Theme.of(context).textTheme.titleSmall,
), ),
), ),
const SizedBox(width: 4), const SizedBox(width: 4),

View File

@ -2,6 +2,7 @@ import 'package:flutter/material.dart';
import 'package:flutter_smart_dialog/flutter_smart_dialog.dart'; import 'package:flutter_smart_dialog/flutter_smart_dialog.dart';
import 'package:get/get.dart'; import 'package:get/get.dart';
import '../../models/model_rec_video_item.dart'; import '../../models/model_rec_video_item.dart';
import 'overlay_pop.dart';
import 'stat/danmu.dart'; import 'stat/danmu.dart';
import 'stat/view.dart'; import 'stat/view.dart';
import '../../http/dynamics.dart'; import '../../http/dynamics.dart';
@ -19,15 +20,15 @@ import 'network_img_layer.dart';
class VideoCardV extends StatelessWidget { class VideoCardV extends StatelessWidget {
final dynamic videoItem; final dynamic videoItem;
final int crossAxisCount; final int crossAxisCount;
final Function()? longPress; // final Function()? longPress;
final Function()? longPressEnd; // final Function()? longPressEnd;
const VideoCardV({ const VideoCardV({
Key? key, Key? key,
required this.videoItem, required this.videoItem,
required this.crossAxisCount, required this.crossAxisCount,
this.longPress, // this.longPress,
this.longPressEnd, // this.longPressEnd,
}) : super(key: key); }) : super(key: key);
bool isStringNumeric(String str) { bool isStringNumeric(String str) {
@ -131,19 +132,16 @@ class VideoCardV extends StatelessWidget {
elevation: 0, elevation: 0,
clipBehavior: Clip.hardEdge, clipBehavior: Clip.hardEdge,
margin: EdgeInsets.zero, margin: EdgeInsets.zero,
child: GestureDetector(
onLongPress: () {
if (longPress != null) {
longPress!();
}
},
// onLongPressEnd: (details) {
// if (longPressEnd != null) {
// longPressEnd!();
// }
// },
child: InkWell( child: InkWell(
onTap: () async => onPushDetail(heroTag), onTap: () async => onPushDetail(heroTag),
onLongPress: () {
SmartDialog.show(
builder: (context) => OverlayPop(
videoItem: videoItem,
closeFn: () => SmartDialog.dismiss(),
),
);
},
child: Column( child: Column(
children: [ children: [
AspectRatio( AspectRatio(
@ -185,7 +183,6 @@ class VideoCardV extends StatelessWidget {
], ],
), ),
), ),
),
); );
} }
} }
@ -196,123 +193,74 @@ class VideoContent extends StatelessWidget {
const VideoContent( const VideoContent(
{Key? key, required this.videoItem, required this.crossAxisCount}) {Key? key, required this.videoItem, required this.crossAxisCount})
: super(key: key); : super(key: key);
Widget _buildBadge(String text, String type, [double fs = 12]) {
return PBadge(
text: text,
stack: 'normal',
size: 'small',
type: type,
fs: fs,
);
}
@override @override
Widget build(BuildContext context) { Widget build(BuildContext context) {
return Expanded( return Padding(
flex: crossAxisCount == 1 ? 0 : 1,
child: Padding(
padding: crossAxisCount == 1 padding: crossAxisCount == 1
? const EdgeInsets.fromLTRB(9, 9, 9, 4) ? const EdgeInsets.fromLTRB(9, 9, 9, 4)
: const EdgeInsets.fromLTRB(5, 8, 5, 4), : const EdgeInsets.fromLTRB(5, 8, 5, 4),
child: Column( child: Column(
crossAxisAlignment: CrossAxisAlignment.start, crossAxisAlignment: CrossAxisAlignment.start,
// mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [ children: [
Row( Text(
children: [
Expanded(
child: Text(
videoItem.title, videoItem.title,
maxLines: 2, maxLines: 2,
overflow: TextOverflow.ellipsis, overflow: TextOverflow.ellipsis,
), ),
),
if (videoItem.goto == 'av' && crossAxisCount == 1) ...[
const SizedBox(width: 10),
VideoPopupMenu(
size: 32,
iconSize: 18,
videoItem: videoItem,
),
],
],
),
if (crossAxisCount > 1) ...[ if (crossAxisCount > 1) ...[
const SizedBox(height: 2), const SizedBox(height: 2),
VideoStat( VideoStat(videoItem: videoItem, crossAxisCount: crossAxisCount),
videoItem: videoItem,
crossAxisCount: crossAxisCount,
),
], ],
if (crossAxisCount == 1) const SizedBox(height: 4), if (crossAxisCount == 1) const SizedBox(height: 4),
Row( Row(
children: [ children: [
if (videoItem.goto == 'bangumi') ...[ if (videoItem.goto == 'bangumi')
PBadge( _buildBadge(videoItem.bangumiBadge, 'line', 9),
text: videoItem.bangumiBadge, if (videoItem.rcmdReason?.content != null &&
stack: 'normal', videoItem.rcmdReason.content != '')
size: 'small', _buildBadge(videoItem.rcmdReason.content, 'color'),
type: 'line', if (videoItem.goto == 'picture') _buildBadge('动态', 'line', 9),
fs: 9, if (videoItem.isFollowed == 1) _buildBadge('已关注', 'color'),
)
],
if (videoItem.rcmdReason != null &&
videoItem.rcmdReason.content != '') ...[
PBadge(
text: videoItem.rcmdReason.content,
stack: 'normal',
size: 'small',
type: 'color',
)
],
if (videoItem.goto == 'picture') ...[
const PBadge(
text: '动态',
stack: 'normal',
size: 'small',
type: 'line',
fs: 9,
)
],
if (videoItem.isFollowed == 1) ...[
const PBadge(
text: '已关注',
stack: 'normal',
size: 'small',
type: 'color',
)
],
Expanded( Expanded(
flex: crossAxisCount == 1 ? 0 : 1, flex: crossAxisCount == 1 ? 0 : 1,
child: Text( child: Text(
videoItem.owner.name, videoItem.owner.name,
maxLines: 1, maxLines: 1,
style: TextStyle( style: TextStyle(
fontSize: fontSize: Theme.of(context).textTheme.labelMedium!.fontSize,
Theme.of(context).textTheme.labelMedium!.fontSize,
color: Theme.of(context).colorScheme.outline, color: Theme.of(context).colorScheme.outline,
), ),
), ),
), ),
if (crossAxisCount == 1) ...[ if (crossAxisCount == 1) ...[
Text( const SizedBox(width: 10),
'',
style: TextStyle(
fontSize:
Theme.of(context).textTheme.labelMedium!.fontSize,
color: Theme.of(context).colorScheme.outline,
),
),
VideoStat( VideoStat(
videoItem: videoItem, videoItem: videoItem,
crossAxisCount: crossAxisCount, crossAxisCount: crossAxisCount,
), ),
const Spacer(), const Spacer(),
], ],
if (videoItem.goto == 'av' && crossAxisCount != 1) ...[ if (videoItem.goto == 'av')
VideoPopupMenu( VideoPopupMenu(
size: 24, size: 24,
iconSize: 14, iconSize: 14,
videoItem: videoItem, videoItem: videoItem,
), ),
] else ...[
const SizedBox(height: 24)
]
], ],
), ),
], ],
), ),
),
); );
} }
} }
@ -383,7 +331,6 @@ class VideoPopupMenu extends StatelessWidget {
size: iconSize, size: iconSize,
), ),
position: PopupMenuPosition.under, position: PopupMenuPosition.under,
// constraints: const BoxConstraints(maxHeight: 35),
onSelected: (String type) {}, onSelected: (String type) {},
itemBuilder: (BuildContext context) => <PopupMenuEntry<String>>[ itemBuilder: (BuildContext context) => <PopupMenuEntry<String>>[
PopupMenuItem<String>( PopupMenuItem<String>(

View File

@ -214,24 +214,8 @@ class UserInfoWidget extends StatelessWidget {
final VoidCallback? callback; final VoidCallback? callback;
final HomeController? ctr; final HomeController? ctr;
@override Widget buildLoggedInWidget(context) {
Widget build(BuildContext context) { return Stack(
return Row(
children: [
SearchBar(ctr: ctr),
if (userLogin.value) ...[
const SizedBox(width: 4),
ClipRect(
child: IconButton(
onPressed: () => Get.toNamed('/whisper'),
icon: const Icon(Icons.notifications_none),
),
)
],
const SizedBox(width: 8),
Obx(
() => userLogin.value
? Stack(
children: [ children: [
NetworkImgLayer( NetworkImgLayer(
type: 'avatar', type: 'avatar',
@ -255,7 +239,27 @@ class UserInfoWidget extends StatelessWidget {
), ),
) )
], ],
);
}
@override
Widget build(BuildContext context) {
return Row(
children: [
SearchBar(ctr: ctr),
if (userLogin.value) ...[
const SizedBox(width: 4),
ClipRect(
child: IconButton(
onPressed: () => Get.toNamed('/whisper'),
icon: const Icon(Icons.notifications_none),
),
) )
],
const SizedBox(width: 8),
Obx(
() => userLogin.value
? buildLoggedInWidget(context)
: DefaultUser(callback: () => callback!()), : DefaultUser(callback: () => callback!()),
), ),
], ],
@ -402,34 +406,31 @@ class SearchBar extends StatelessWidget {
color: colorScheme.onSecondaryContainer.withOpacity(0.05), color: colorScheme.onSecondaryContainer.withOpacity(0.05),
child: InkWell( child: InkWell(
splashColor: colorScheme.primaryContainer.withOpacity(0.3), splashColor: colorScheme.primaryContainer.withOpacity(0.3),
onTap: () => Get.toNamed( onTap: () => Get.toNamed('/search',
'/search', parameters: {'hintText': ctr!.defaultSearch.value}),
parameters: {'hintText': ctr!.defaultSearch.value}, child: Padding(
), padding: const EdgeInsets.symmetric(horizontal: 14),
child: Row( child: Row(
children: [ children: [
const SizedBox(width: 14),
Icon( Icon(
Icons.search_outlined, Icons.search_outlined,
color: colorScheme.onSecondaryContainer, color: colorScheme.onSecondaryContainer,
), ),
const SizedBox(width: 10), const SizedBox(width: 10),
Obx( Obx(
() => Expanded( () => Text(
child: Text(
ctr!.defaultSearch.value, ctr!.defaultSearch.value,
maxLines: 1, maxLines: 1,
overflow: TextOverflow.ellipsis, overflow: TextOverflow.ellipsis,
style: TextStyle(color: colorScheme.outline), style: TextStyle(color: colorScheme.outline),
), ),
), ),
),
const SizedBox(width: 15),
], ],
), ),
), ),
), ),
), ),
),
); );
} }
} }

View File

@ -5,9 +5,7 @@ import 'package:flutter/material.dart';
import 'package:get/get.dart'; import 'package:get/get.dart';
import 'package:pilipala/common/constants.dart'; import 'package:pilipala/common/constants.dart';
import 'package:pilipala/common/skeleton/video_card_v.dart'; import 'package:pilipala/common/skeleton/video_card_v.dart';
import 'package:pilipala/common/widgets/animated_dialog.dart';
import 'package:pilipala/common/widgets/http_error.dart'; import 'package:pilipala/common/widgets/http_error.dart';
import 'package:pilipala/common/widgets/overlay_pop.dart';
import 'package:pilipala/common/widgets/video_card_v.dart'; import 'package:pilipala/common/widgets/video_card_v.dart';
import 'package:pilipala/utils/main_stream.dart'; import 'package:pilipala/utils/main_stream.dart';
@ -118,16 +116,6 @@ class _RcmdPageState extends State<RcmdPage>
); );
} }
OverlayEntry _createPopupDialog(videoItem) {
return OverlayEntry(
builder: (context) => AnimatedDialog(
closeFn: _rcmdController.popupDialog?.remove,
child: OverlayPop(
videoItem: videoItem, closeFn: _rcmdController.popupDialog?.remove),
),
);
}
Widget contentGrid(ctr, videoList) { Widget contentGrid(ctr, videoList) {
// double maxWidth = Get.size.width; // double maxWidth = Get.size.width;
// int baseWidth = 500; // int baseWidth = 500;
@ -158,14 +146,6 @@ class _RcmdPageState extends State<RcmdPage>
? VideoCardV( ? VideoCardV(
videoItem: videoList[index], videoItem: videoList[index],
crossAxisCount: crossAxisCount, crossAxisCount: crossAxisCount,
longPress: () {
_rcmdController.popupDialog =
_createPopupDialog(videoList[index]);
Overlay.of(context).insert(_rcmdController.popupDialog!);
},
longPressEnd: () {
_rcmdController.popupDialog?.remove();
},
) )
: const VideoCardVSkeleton(); : const VideoCardVSkeleton();
}, },