image detail
This commit is contained in:
@ -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)),
|
||||
],
|
||||
),
|
||||
),
|
||||
)),
|
||||
],
|
||||
),
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user