infinite scroll

This commit is contained in:
quantulr
2023-05-14 19:59:43 +08:00
parent e06dd8d9dd
commit c430ef1621
14 changed files with 404 additions and 304 deletions

View File

@ -1,7 +1,10 @@
import 'package:flutter/cupertino.dart';
import 'package:flutter/foundation.dart';
import 'package:flutter/material.dart';
import 'package:flutter/services.dart';
import 'package:flutter_riverpod/flutter_riverpod.dart';
import 'package:go_router/go_router.dart';
import 'package:infinite_scroll_pagination/infinite_scroll_pagination.dart';
import 'package:momo/models/image_list_resp.dart';
import 'package:momo/models/image_resp.dart';
import 'package:momo/provider/rerender.dart';
@ -42,6 +45,27 @@ class _ImageGridState extends State<ImageGrid> {
bool hasMore = true;
bool loading = false;
final PagingController<int, ImageResp> _pagingController =
PagingController(firstPageKey: 1);
Future<void> _fetchPage(int pageKey) async {
try {
final resp = await dio.get("/image/history",
queryParameters: {"page": pageKey, "size": pageSize});
ImageListResp imageListResp = ImageListResp.fromJson(resp.data);
final newItems = imageListResp.list;
final isLastPage = !imageListResp.hasNext;
if (isLastPage) {
_pagingController.appendLastPage(newItems);
} else {
final nextPageKey = pageKey + 1;
_pagingController.appendPage(newItems, nextPageKey);
}
} catch (error) {
_pagingController.error = error;
}
}
Future<dynamic> loadImages() async {
loading = true;
if (!hasMore) {
@ -65,33 +89,43 @@ class _ImageGridState extends State<ImageGrid> {
@override
void initState() {
// TODO: implement initState
_pagingController.addPageRequestListener((pageKey) {
_fetchPage(pageKey);
});
super.initState();
print("init");
_scrollController = ScrollController(initialScrollOffset: 5.0)
..addListener(() {
if (_scrollController.offset >=
_scrollController.position.maxScrollExtent &&
!_scrollController.position.outOfRange) {
print("到底了 controller $loading");
if (!loading) {
loadImages();
}
}
});
loadImages();
// print("init");
//
// _scrollController = ScrollController(initialScrollOffset: 5.0)
// ..addListener(() {
// if (_scrollController.offset >=
// _scrollController.position.maxScrollExtent &&
// !_scrollController.position.outOfRange) {
// print("到底了 controller $loading");
// if (!loading) {
// loadImages();
// }
// }
// });
// loadImages();
}
@override
Widget build(BuildContext context) {
return GridView.builder(
itemCount: imageList.length,
controller: _scrollController,
gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
crossAxisCount: MediaQuery.of(context).size.width > 640 ? 5 : 3),
itemBuilder: (BuildContext context, int index) {
return ImageItem(image: imageList[index]);
});
return PagedGridView(
pagingController: _pagingController,
builderDelegate: PagedChildBuilderDelegate<ImageResp>(
itemBuilder: (context, item, index) => ImageItem(image: item)),
gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
crossAxisCount: MediaQuery.of(context).size.width > 640 ? 5 : 3),
);
// return GridView.builder(
// itemCount: imageList.length,
// controller: _scrollController,
// gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
// crossAxisCount: MediaQuery.of(context).size.width > 640 ? 5 : 3),
// itemBuilder: (BuildContext context, int index) {
// return ImageItem(image: imageList[index]);
// });
}
}
@ -165,10 +199,10 @@ class _ImageItemState extends ConsumerState<ImageItem> {
Clipboard.setData(ClipboardData(
text:
"${dio.options.baseUrl}/image/${widget.image.file_path}"));
ScaffoldMessenger.of(context).showSnackBar(SnackBar(
ScaffoldMessenger.of(context).showSnackBar(const SnackBar(
content: Row(
crossAxisAlignment: CrossAxisAlignment.center,
children: const [
children: [
Icon(
Icons.check_circle,
color: Colors.white,
@ -199,36 +233,61 @@ class _ImageItemState extends ConsumerState<ImageItem> {
@override
Widget build(BuildContext context) {
return GestureDetector(
onSecondaryTapUp: (TapUpDetails details) {
print(details.globalPosition);
_showContextMenu(details.globalPosition);
},
onTap: () {
context.go(
Uri(path: "/detail", queryParameters: {"id": "${widget.image.id}"})
.toString());
},
child: Image.network(
"${dio.options.baseUrl}/image/thumbnail/${widget.image.file_path}",
fit: BoxFit.cover,
errorBuilder: (BuildContext context, o, err) {
return const Icon(Icons.error_outline);
},
),
);
return CupertinoContextMenu(
actions: [
CupertinoContextMenuAction(
trailingIcon: CupertinoIcons.delete,
child: const Text('删除'),
onPressed: () {
Navigator.pop(context);
// Navigator.pop(context);
// showDialog(
// context: context,
// builder: (BuildContext dialogContext) => AlertDialog(
// title: const Text('删除图片'),
// content: const Text("确认删除图片"),
// actions: [
// TextButton(
// onPressed: () =>
// Navigator.pop(dialogContext, 'Cancel'),
// child: const Text('Cancel'),
// ),
// TextButton(
// onPressed: () {
// Navigator.pop(dialogContext, 'OK');
// // Navigator.pop(context);
// dio
// .delete("/image/delete/${widget.image.id}")
// .then((resp) {
// ref.read(uniqueIdProvider.notifier).updateId();
// // context.go("/");
// });
// },
// child: const Text('OK'),
// ),
// ],
// ));
},
)
],
child: GestureDetector(
onSecondaryTapUp: (TapUpDetails details) {
_showContextMenu(details.globalPosition);
},
onTap: () {
context.go(Uri(
path: "/detail",
queryParameters: {"id": "${widget.image.id}"}).toString());
},
child: Image.network(
kIsWeb
? "/images-api/?url=${dio.options.baseUrl}/image/${widget.image.file_path}&w=512"
: 'https://raichi.hodokencho.com/images-api/?url=${dio.options.baseUrl}/image/${widget.image.file_path}&w=512',
fit: BoxFit.cover,
errorBuilder: (BuildContext context, o, err) {
return const Icon(Icons.error_outline);
},
),
));
}
}
// class Textt extends StatefulWidget {
// const Textt({Key? key}) : super(key: key);
//
// @override
// State<Textt> createState() => _TexttState();
// }
// class _TexttState extends State<Textt> {
// @override
// Widget build(BuildContext context) {
// // return const ContextMenuRegion(child: child, contextMenu: contextMenu);
// }
// }