cxc/momo
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

infinite scroll

Browse Source
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
Download Patch File Download Diff File Expand all files Collapse all files

5
lib/material/app.dart
View File

@ -20,12 +20,13 @@ class MyMaterialApp extends ConsumerWidget {
MyMaterialRouterConfig myMaterialRouterConfig =
MyMaterialRouterConfig(token);
return MaterialApp.router(
return SafeArea(
child: MaterialApp.router(
routerConfig: myMaterialRouterConfig.router,
debugShowCheckedModeBanner: false,
theme:
ThemeData(useMaterial3: true, scaffoldBackgroundColor: Colors.white),
);
));
// return FutureBuilder(
// future: loadToken(),
// builder: (BuildContext context, AsyncSnapshot<String?> snapshot) {

169
lib/material/gallery.dart
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);
// }
// }

139
lib/material/home.dart
View File

@ -1,5 +1,6 @@
import 'package:dio/dio.dart';
import 'package:file_picker/file_picker.dart';
import 'package:flutter/foundation.dart';
import 'package:flutter/material.dart';
import 'package:flutter_riverpod/flutter_riverpod.dart';
import 'package:go_router/go_router.dart';
@ -47,82 +48,84 @@ class _HomePageState extends ConsumerState<HomePage> {
),
elevation: 10,
),
floatingActionButton:
selectedIndex == 0 && GoRouterState.of(context).fullpath == "/"
? (!uploading
? FloatingActionButton(
onPressed: () async {
FilePickerResult? result = await FilePicker.platform
.pickFiles(type: FileType.image);
floatingActionButton: selectedIndex == 0 &&
GoRouterState.of(context).fullpath == "/"
? (!uploading
? FloatingActionButton(
onPressed: () async {
FilePickerResult? result = await FilePicker.platform
.pickFiles(type: FileType.image);
if (result != null) {
String? filePath = result.files.first.path;
if (filePath == null) {
return;
}
String? mimeType = lookupMimeType(filePath);
FormData data = FormData.fromMap({
"pic": await MultipartFile.fromFile(filePath,
filename: result.files.first.name,
contentType: MediaType(
mimeType!.split("/").first,
mimeType.split("/").last))
});
setState(() {
uploading = true;
});
await dio.post("/image/upload", data: data,
onSendProgress: (sended, total) {
print("$sended / $total");
setState(() {
uploadProgress = sended / total;
});
}).then((value) {
setState(() {
uploading = false;
});
ref.read(uniqueIdProvider.notifier).updateId();
ScaffoldMessenger.of(context).showSnackBar(SnackBar(
content: Row(
crossAxisAlignment: CrossAxisAlignment.center,
children: const [
Icon(
Icons.check_circle,
color: Colors.white,
),
SizedBox(
width: 10,
),
Text("上传成功")
],
if (result != null) {
String fileName = result.files.first.name;
String? mimeType = lookupMimeType(fileName);
MultipartFile file;
if (kIsWeb) {
final fileBytes = result.files.first.bytes;
file = MultipartFile.fromBytes(fileBytes as List<int>,
filename: result.files.first.name,
contentType: MediaType(mimeType!.split("/").first,
mimeType.split("/").last));
} else {
String? filePath = result.files.first.path;
if (filePath == null) {
return;
}
file = await MultipartFile.fromFile(filePath,
filename: result.files.first.name,
contentType: MediaType(mimeType!.split("/").first,
mimeType.split("/").last));
}
FormData data = FormData.fromMap({"pic": file});
setState(() {
uploading = true;
});
await dio.post("/image/upload", data: data,
onSendProgress: (sended, total) {
print("$sended / $total");
setState(() {
uploadProgress = sended / total;
});
}).then((value) {
setState(() {
uploading = false;
});
ref.read(uniqueIdProvider.notifier).updateId();
ScaffoldMessenger.of(context)
.showSnackBar(const SnackBar(
content: Row(
crossAxisAlignment: CrossAxisAlignment.center,
children: [
Icon(
Icons.check_circle,
color: Colors.white,
),
backgroundColor: Colors.lightGreen,
));
});
} else {}
},
child: const Icon(Icons.add),
)
: FloatingActionButton(
onPressed: null,
child: CircularProgressIndicator(
value: uploadProgress,
),
))
: null,
SizedBox(
width: 10,
),
Text("上传成功")
],
),
backgroundColor: Colors.lightGreen,
));
});
} else {}
},
child: const Icon(Icons.add),
)
: FloatingActionButton(
onPressed: null,
child: CircularProgressIndicator(
value: uploadProgress,
),
))
: null,
body: Row(
children: [
MediaQuery.of(context).size.width > 640
? NavigationRail(
elevation: 10,
backgroundColor: const Color(0xffebf6f5),
leading: MediaQuery.of(context).size.width >= 1008
? const Text(
"Side Header",
style: TextStyle(
fontWeight: FontWeight.bold, fontSize: 36),
)
: null,
onDestinationSelected: (idx) {
setState(() {
selectedIndex = idx;

1
lib/material/login.dart
View File

@ -91,6 +91,7 @@ class _LoginFormState extends ConsumerState<LoginForm> {
}
} catch (e) {
if (e is DioError) {
print(e);
print(e.response);
ScaffoldMessenger.of(context).showSnackBar(SnackBar(
content: Text(e.response?.data["msg"] ?? "请求错误")));