image detail

This commit is contained in:
quantulr
2023-02-11 22:29:33 +08:00
parent 5f5f2554eb
commit b2e52d0539
6 changed files with 201 additions and 90 deletions

View File

@ -1,18 +1,129 @@
import 'package:dio/dio.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';
import 'package:momo/models/image_resp.dart';
import 'package:momo/provider/rerender.dart';
import 'package:momo/request/http_client.dart';
class ImageDetail extends StatefulWidget {
class ImageDetail extends ConsumerStatefulWidget {
const ImageDetail({Key? key}) : super(key: key);
@override
State<ImageDetail> createState() => _ImageDetailState();
ConsumerState<ImageDetail> createState() => _ImageDetailState();
}
class _ImageDetailState extends State<ImageDetail> {
class _ImageDetailState extends ConsumerState<ImageDetail> {
Future<ImageResp?> loadImage(id) async {
try {
var resp = await dio.get("/image/detail/$id");
return ImageResp.fromJson(resp.data);
} catch (e) {
if (e is DioError) {
if (kDebugMode) {
print(e.response?.data);
}
}
}
return null;
}
double? dx;
double? dy;
double _scale = 1;
@override
Widget build(BuildContext context) {
return Center(
child: Text(GoRouterState.of(context).queryParams["id"] ?? ""),
String id = GoRouterState.of(context).queryParams["id"] ?? "";
return Container(
width: double.infinity,
height: double.infinity,
color: Colors.white,
// TODO: 缩放组件溢出
child: Stack(
alignment: Alignment.center,
children: [
Positioned(
left: dx,
top: dy,
child: Draggable(
onDragUpdate: (drag) {
print(drag);
// setState(() {
// dx = drag.localPosition.dx;
// dy = drag.localPosition.dy;
// });
},
feedback: const SizedBox(),
child: FutureBuilder(
future: loadImage(id),
builder: (BuildContext context, snapshot) {
if (snapshot.hasData) {
return Image.network(
"${dio.options.baseUrl}/image/${snapshot.data?.file_path}",
loadingBuilder:
(BuildContext context, child, loadingProgress) {
if (loadingProgress == null) {
return Transform.scale(
scale: _scale,
child: child,
);
}
return Center(
child: CircularProgressIndicator(
value: loadingProgress.expectedTotalBytes != null
? loadingProgress.cumulativeBytesLoaded /
loadingProgress.expectedTotalBytes!
: null,
),
);
});
} else if (snapshot.hasError) {
print(snapshot.error);
return ErrorWidget("err");
}
return CircularProgressIndicator();
}),
)),
Positioned(
bottom: 10,
child: Card(
// decoration: BoxDecoration(),
elevation: 30,
// color: Colors.pinkAccent,
child: Padding(
padding: const EdgeInsets.fromLTRB(20, 5, 20, 5),
child: Row(
children: [
IconButton(
onPressed: () {
dio.delete("/image/delete/$id").then((resp) {
ref.read(uniqueIdProvider.notifier).updateId();
context.go("/");
});
},
icon: const Icon(Icons.delete)),
IconButton(
onPressed: () {
setState(() {
_scale -= 0.1;
});
},
icon: const Icon(Icons.remove_circle_outline)),
IconButton(
onPressed: () {
setState(() {
_scale += 0.1;
});
},
icon: const Icon(Icons.add_circle_outline)),
],
),
),
)),
],
),
);
}
}