feat: 我的订阅

This commit is contained in:
guozhigq
2024-02-25 12:12:54 +08:00
parent 4da6667b81
commit 078e4716b4
18 changed files with 1032 additions and 7 deletions

View File

@ -0,0 +1,60 @@
import 'package:get/get.dart';
import 'package:pilipala/http/user.dart';
import '../../models/user/sub_detail.dart';
import '../../models/user/sub_folder.dart';
class SubDetailController extends GetxController {
late SubFolderItemData item;
late int seasonId;
late String heroTag;
int currentPage = 1;
bool isLoadingMore = false;
Rx<DetailInfo> subInfo = DetailInfo().obs;
RxList<SubDetailMediaItem> subList = <SubDetailMediaItem>[].obs;
RxString loadingText = '加载中...'.obs;
int mediaCount = 0;
@override
void onInit() {
item = Get.arguments;
if (Get.parameters.keys.isNotEmpty) {
seasonId = int.parse(Get.parameters['seasonId']!);
heroTag = Get.parameters['heroTag']!;
}
super.onInit();
}
Future<dynamic> queryUserSubFolderDetail({type = 'init'}) async {
if (type == 'onLoad' && subList.length >= mediaCount) {
loadingText.value = '没有更多了';
return;
}
isLoadingMore = true;
var res = await UserHttp.userSubFolderDetail(
seasonId: seasonId,
ps: 20,
pn: currentPage,
);
if (res['status']) {
subInfo.value = res['data'].info;
if (currentPage == 1 && type == 'init') {
subList.value = res['data'].medias;
mediaCount = res['data'].info.mediaCount;
} else if (type == 'onLoad') {
subList.addAll(res['data'].medias);
}
if (subList.length >= mediaCount) {
loadingText.value = '没有更多了';
}
}
currentPage += 1;
isLoadingMore = false;
return res;
}
onLoad() {
queryUserSubFolderDetail(type: 'onLoad');
}
}

View File

@ -0,0 +1,4 @@
library sub_detail;
export './controller.dart';
export './view.dart';

View File

@ -0,0 +1,257 @@
import 'dart:async';
import 'package:easy_debounce/easy_throttle.dart';
import 'package:flutter/material.dart';
import 'package:get/get.dart';
import 'package:pilipala/common/skeleton/video_card_h.dart';
import 'package:pilipala/common/widgets/http_error.dart';
import 'package:pilipala/common/widgets/network_img_layer.dart';
import 'package:pilipala/common/widgets/no_data.dart';
import '../../models/user/sub_folder.dart';
import '../../utils/utils.dart';
import 'controller.dart';
import 'widget/sub_video_card.dart';
class SubDetailPage extends StatefulWidget {
const SubDetailPage({super.key});
@override
State<SubDetailPage> createState() => _SubDetailPageState();
}
class _SubDetailPageState extends State<SubDetailPage> {
late final ScrollController _controller = ScrollController();
final SubDetailController _subDetailController =
Get.put(SubDetailController());
late StreamController<bool> titleStreamC; // a
late Future _futureBuilderFuture;
late String seasonId;
@override
void initState() {
super.initState();
seasonId = Get.parameters['seasonId']!;
_futureBuilderFuture = _subDetailController.queryUserSubFolderDetail();
titleStreamC = StreamController<bool>();
_controller.addListener(
() {
if (_controller.offset > 160) {
titleStreamC.add(true);
} else if (_controller.offset <= 160) {
titleStreamC.add(false);
}
if (_controller.position.pixels >=
_controller.position.maxScrollExtent - 200) {
EasyThrottle.throttle('subDetail', const Duration(seconds: 1), () {
_subDetailController.onLoad();
});
}
},
);
}
@override
void dispose() {
_controller.dispose();
super.dispose();
}
@override
Widget build(BuildContext context) {
return Scaffold(
body: CustomScrollView(
controller: _controller,
slivers: [
SliverAppBar(
expandedHeight: 260 - MediaQuery.of(context).padding.top,
pinned: true,
titleSpacing: 0,
title: StreamBuilder(
stream: titleStreamC.stream,
initialData: false,
builder: (context, AsyncSnapshot snapshot) {
return AnimatedOpacity(
opacity: snapshot.data ? 1 : 0,
curve: Curves.easeOut,
duration: const Duration(milliseconds: 500),
child: Row(
children: [
Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text(
_subDetailController.item.title!,
style: Theme.of(context).textTheme.titleMedium,
),
Text(
'${_subDetailController.item.mediaCount!}条视频',
style: Theme.of(context).textTheme.labelMedium,
)
],
)
],
),
);
},
),
flexibleSpace: FlexibleSpaceBar(
background: Container(
decoration: BoxDecoration(
border: Border(
bottom: BorderSide(
color: Theme.of(context).dividerColor.withOpacity(0.2),
),
),
),
padding: EdgeInsets.only(
top: kTextTabBarHeight +
MediaQuery.of(context).padding.top +
30,
left: 20,
right: 20),
child: SizedBox(
height: 200,
child: Row(
// mainAxisAlignment: MainAxisAlignment.center,
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Hero(
tag: _subDetailController.heroTag,
child: NetworkImgLayer(
width: 180,
height: 110,
src: _subDetailController.item.cover,
),
),
const SizedBox(width: 14),
Expanded(
child: Column(
mainAxisAlignment: MainAxisAlignment.start,
crossAxisAlignment: CrossAxisAlignment.start,
children: [
const SizedBox(height: 4),
Text(
_subDetailController.item.title!,
style: TextStyle(
fontSize: Theme.of(context)
.textTheme
.titleMedium!
.fontSize,
fontWeight: FontWeight.bold),
),
const SizedBox(height: 4),
GestureDetector(
onTap: () {
SubFolderItemData item =
_subDetailController.item;
Get.toNamed(
'/member?mid=${item.upper!.mid}',
arguments: {
'face': item.upper!.face,
},
);
},
child: Text(
_subDetailController.item.upper!.name!,
style: TextStyle(
color:
Theme.of(context).colorScheme.primary),
),
),
const SizedBox(height: 4),
Text(
'${Utils.numFormat(_subDetailController.item.viewCount)}次播放',
style: TextStyle(
fontSize: Theme.of(context)
.textTheme
.labelSmall!
.fontSize,
color: Theme.of(context).colorScheme.outline),
),
],
),
),
],
),
),
),
),
),
SliverToBoxAdapter(
child: Padding(
padding: const EdgeInsets.only(top: 15, bottom: 8, left: 14),
child: Obx(
() => Text(
'${_subDetailController.subList.length}条视频',
style: TextStyle(
fontSize:
Theme.of(context).textTheme.labelMedium!.fontSize,
color: Theme.of(context).colorScheme.outline,
letterSpacing: 1),
),
),
),
),
FutureBuilder(
future: _futureBuilderFuture,
builder: (context, snapshot) {
if (snapshot.connectionState == ConnectionState.done) {
Map data = snapshot.data;
if (data['status']) {
if (_subDetailController.item.mediaCount == 0) {
return const NoData();
} else {
List subList = _subDetailController.subList;
return Obx(
() => subList.isEmpty
? const SliverToBoxAdapter(child: SizedBox())
: SliverList(
delegate:
SliverChildBuilderDelegate((context, index) {
return SubVideoCardH(
videoItem: subList[index],
);
}, childCount: subList.length),
),
);
}
} else {
return HttpError(
errMsg: data['msg'],
fn: () => setState(() {}),
);
}
} else {
// 骨架屏
return SliverList(
delegate: SliverChildBuilderDelegate((context, index) {
return const VideoCardHSkeleton();
}, childCount: 10),
);
}
},
),
SliverToBoxAdapter(
child: Container(
height: MediaQuery.of(context).padding.bottom + 60,
padding: EdgeInsets.only(
bottom: MediaQuery.of(context).padding.bottom),
child: Center(
child: Obx(
() => Text(
_subDetailController.loadingText.value,
style: TextStyle(
color: Theme.of(context).colorScheme.outline,
fontSize: 13),
),
),
),
),
)
],
),
);
}
}

View File

@ -0,0 +1,168 @@
import 'package:get/get.dart';
import 'package:flutter/material.dart';
import 'package:pilipala/common/constants.dart';
import 'package:pilipala/common/widgets/stat/danmu.dart';
import 'package:pilipala/common/widgets/stat/view.dart';
import 'package:pilipala/http/search.dart';
import 'package:pilipala/models/common/search_type.dart';
import 'package:pilipala/utils/utils.dart';
import 'package:pilipala/common/widgets/network_img_layer.dart';
import '../../../common/widgets/badge.dart';
import '../../../models/user/sub_detail.dart';
// 收藏视频卡片 - 水平布局
class SubVideoCardH extends StatelessWidget {
final SubDetailMediaItem videoItem;
final int? searchType;
const SubVideoCardH({
Key? key,
required this.videoItem,
this.searchType,
}) : super(key: key);
@override
Widget build(BuildContext context) {
int id = videoItem.id!;
String bvid = videoItem.bvid!;
String heroTag = Utils.makeHeroTag(id);
return InkWell(
onTap: () async {
int cid = await SearchHttp.ab2c(bvid: bvid);
Map<String, String> parameters = {
'bvid': bvid,
'cid': cid.toString(),
};
Get.toNamed('/video', parameters: parameters, arguments: {
'videoItem': videoItem,
'heroTag': heroTag,
'videoType': SearchType.video,
});
},
child: Column(
children: [
Padding(
padding: const EdgeInsets.fromLTRB(
StyleString.safeSpace, 5, StyleString.safeSpace, 5),
child: LayoutBuilder(
builder: (context, boxConstraints) {
double width =
(boxConstraints.maxWidth - StyleString.cardSpace * 6) / 2;
return SizedBox(
height: width / StyleString.aspectRatio,
child: Row(
mainAxisAlignment: MainAxisAlignment.start,
crossAxisAlignment: CrossAxisAlignment.start,
children: [
AspectRatio(
aspectRatio: StyleString.aspectRatio,
child: LayoutBuilder(
builder: (context, boxConstraints) {
double maxWidth = boxConstraints.maxWidth;
double maxHeight = boxConstraints.maxHeight;
return Stack(
children: [
Hero(
tag: heroTag,
child: NetworkImgLayer(
src: videoItem.cover,
width: maxWidth,
height: maxHeight,
),
),
PBadge(
text: Utils.timeFormat(videoItem.duration!),
right: 6.0,
bottom: 6.0,
type: 'gray',
),
// if (videoItem.ogv != null) ...[
// PBadge(
// text: videoItem.ogv['type_name'],
// top: 6.0,
// right: 6.0,
// bottom: null,
// left: null,
// ),
// ],
],
);
},
),
),
VideoContent(
videoItem: videoItem,
searchType: searchType,
)
],
),
);
},
),
),
],
),
);
}
}
class VideoContent extends StatelessWidget {
final dynamic videoItem;
final int? searchType;
const VideoContent({
super.key,
required this.videoItem,
this.searchType,
});
@override
Widget build(BuildContext context) {
return Expanded(
child: Padding(
padding: const EdgeInsets.fromLTRB(10, 2, 6, 0),
child: Stack(
children: [
Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text(
videoItem.title,
textAlign: TextAlign.start,
style: const TextStyle(
fontWeight: FontWeight.w500,
letterSpacing: 0.3,
),
maxLines: 2,
overflow: TextOverflow.ellipsis,
),
const Spacer(),
Text(
Utils.dateFormat(videoItem.pubtime),
style: TextStyle(
fontSize: 11,
color: Theme.of(context).colorScheme.outline),
),
Padding(
padding: const EdgeInsets.only(top: 2),
child: Row(
children: [
StatView(
theme: 'gray',
view: videoItem.cntInfo['play'],
),
const SizedBox(width: 8),
StatDanMu(
theme: 'gray', danmu: videoItem.cntInfo['danmaku']),
const Spacer(),
],
),
),
],
),
],
),
),
);
}
}