image scale

This commit is contained in:
quantulr
2023-02-12 23:39:41 +08:00
parent b2e52d0539
commit 9261d482cf
7 changed files with 110 additions and 52 deletions

View File

@ -14,7 +14,7 @@ void main() async {
// Must add this line. // Must add this line.
await windowManager.ensureInitialized(); await windowManager.ensureInitialized();
WindowOptions windowOptions = const WindowOptions( WindowOptions windowOptions = const WindowOptions(
size: Size(800, 600), size: Size(880, 600),
center: true, center: true,
minimumSize: Size(300, 400), minimumSize: Size(300, 400),
// backgroundColor: Colors.transparent, // backgroundColor: Colors.transparent,

View File

@ -29,10 +29,13 @@ class _ImageDetailState extends ConsumerState<ImageDetail> {
return null; return null;
} }
double? dx; // double dx=0;
double? dy;
double _scale = 1; double _scale = 1;
Offset offsetBeforeDrag = const Offset(0, 0);
Offset origin = const Offset(0, 0);
double ox = 0;
@override @override
Widget build(BuildContext context) { Widget build(BuildContext context) {
String id = GoRouterState.of(context).queryParams["id"] ?? ""; String id = GoRouterState.of(context).queryParams["id"] ?? "";
@ -40,34 +43,80 @@ class _ImageDetailState extends ConsumerState<ImageDetail> {
width: double.infinity, width: double.infinity,
height: double.infinity, height: double.infinity,
color: Colors.white, color: Colors.white,
// TODO: 缩放组件溢出 // TODO: 拖动
child: Stack( child: Stack(
alignment: Alignment.center, alignment: Alignment.center,
children: [ children: [
Positioned( Positioned(
left: dx, // left: dx,
top: dy,
child: GestureDetector(
onTapDown: (TapDownDetails details) {
print("tap start");
print(details.globalPosition.dx);
offsetBeforeDrag = details.globalPosition;
},
child: Draggable( child: Draggable(
onDragUpdate: (drag) { onDragUpdate: (details) {
print(drag); print("on drag update");
// setState(() { print(details.globalPosition.dx - offsetBeforeDrag.dx);
// dx = drag.localPosition.dx; // print(details.localPosition - offsetBeforeDrag);
// dy = drag.localPosition.dy; // print(offsetBeforeDrag.dx - details.localPosition.dx);
// }); // print(offsetBeforeDrag.dy - details.localPosition.dy);
//
setState(() {
origin = (offsetBeforeDrag - details.localPosition);
// /
// (_scale - 1);
});
}, },
feedback: const SizedBox(), feedback: const SizedBox(),
child: FutureBuilder( child: FutureBuilder(
future: loadImage(id), future: loadImage(id),
builder: (BuildContext context, snapshot) { builder: (BuildContext context, snapshot) {
if (snapshot.hasData) { if (snapshot.hasData) {
// return ClipRect(
// child: SizedBox(
// width: double.infinity,
// height: double.infinity,
// child: Transform.scale(
// origin: Offset(0, 0),
// scale: _scale,
// child: Image.network(
// "${dio.options.baseUrl}/image/${snapshot.data?.file_path}",
// loadingBuilder: (BuildContext context, child,
// loadingProgress) {
// if (loadingProgress == null) {
// return child;
// }
// return Center(
// child: CircularProgressIndicator(
// value: loadingProgress.expectedTotalBytes !=
// null
// ? loadingProgress
// .cumulativeBytesLoaded /
// loadingProgress.expectedTotalBytes!
// : null,
// ),
// );
// }),
// ),
// ),
// );
return Image.network( return Image.network(
"${dio.options.baseUrl}/image/${snapshot.data?.file_path}", "${dio.options.baseUrl}/image/${snapshot.data?.file_path}",
loadingBuilder: loadingBuilder:
(BuildContext context, child, loadingProgress) { (BuildContext context, child, loadingProgress) {
if (loadingProgress == null) { if (loadingProgress == null) {
return Transform.scale( return ClipRect(
scale: _scale, child: SizedBox(
child: child, width: double.infinity,
height: double.infinity,
child: Transform.scale(
origin: Offset(166, 0),
scale: _scale,
child: child),
),
); );
} }
return Center( return Center(
@ -85,7 +134,9 @@ class _ImageDetailState extends ConsumerState<ImageDetail> {
} }
return CircularProgressIndicator(); return CircularProgressIndicator();
}), }),
)), ),
),
),
Positioned( Positioned(
bottom: 10, bottom: 10,
child: Card( child: Card(
@ -105,19 +156,31 @@ class _ImageDetailState extends ConsumerState<ImageDetail> {
}, },
icon: const Icon(Icons.delete)), icon: const Icon(Icons.delete)),
IconButton( IconButton(
onPressed: () { onPressed: _scale > 0.2
setState(() { ? () {
_scale -= 0.1; setState(() {
}); _scale -= 1;
}, });
}
: null,
icon: const Icon(Icons.remove_circle_outline)), icon: const Icon(Icons.remove_circle_outline)),
IconButton(
onPressed: _scale < 10
? () {
setState(() {
_scale += 1;
});
}
: null,
icon: const Icon(Icons.add_circle_outline)),
IconButton( IconButton(
onPressed: () { onPressed: () {
setState(() { setState(() {
_scale += 0.1; // _scale += 0.1;
ox += 100 / 2;
}); });
}, },
icon: const Icon(Icons.add_circle_outline)), icon: const Icon(Icons.chevron_left)),
], ],
), ),
), ),

View File

@ -12,8 +12,11 @@ class Gallery extends ConsumerWidget {
@override @override
Widget build(BuildContext context, WidgetRef ref) { Widget build(BuildContext context, WidgetRef ref) {
UniqueKey key = ref.watch(uniqueIdProvider); UniqueKey key = ref.watch(uniqueIdProvider);
return ImageGrid( return Container(
key: key, color: Colors.white,
child: ImageGrid(
key: key,
),
); );
} }
} }

View File

@ -7,12 +7,15 @@ class Profile extends ConsumerWidget {
@override @override
Widget build(BuildContext context, WidgetRef ref) { Widget build(BuildContext context, WidgetRef ref) {
return Center( return Container(
child: ElevatedButton( color: Colors.white,
onPressed: () { child: Center(
ref.watch(tokenProvider.notifier).removeToken(); child: ElevatedButton(
}, onPressed: () {
child: const Text('quit')), ref.watch(tokenProvider.notifier).removeToken();
},
child: const Text('quit')),
),
); );
} }
} }

View File

@ -27,10 +27,8 @@ class MyMaterialRouterConfig {
GoRoute( GoRoute(
path: "/", path: "/",
name: "相册", name: "相册",
pageBuilder: (BuildContext context, GoRouterState state) => builder: (BuildContext context, GoRouterState state) =>
const NoTransitionPage( const Gallery(),
child: Gallery(),
),
redirect: (BuildContext context, GoRouterState state) { redirect: (BuildContext context, GoRouterState state) {
if (token == null || token.isEmpty) { if (token == null || token.isEmpty) {
return '/login'; return '/login';
@ -47,8 +45,8 @@ class MyMaterialRouterConfig {
GoRoute( GoRoute(
path: "/profile", path: "/profile",
name: "个人资料", name: "个人资料",
pageBuilder: (BuildContext context, GoRouterState state) => builder: (BuildContext context, GoRouterState state) =>
const NoTransitionPage(child: Profile())), const Profile()),
], ],
), ),
GoRoute( GoRoute(

View File

@ -29,10 +29,10 @@ packages:
dependency: transitive dependency: transitive
description: description:
name: args name: args
sha256: "139d809800a412ebb26a3892da228b2d0ba36f0ef5d9a82166e5e52ec8d61611" sha256: "4cab82a83ffef80b262ddedf47a0a8e56ee6fbf7fe21e6e768b02792034dd440"
url: "https://mirrors.tuna.tsinghua.edu.cn/dart-pub/" url: "https://mirrors.tuna.tsinghua.edu.cn/dart-pub/"
source: hosted source: hosted
version: "2.3.2" version: "2.4.0"
async: async:
dependency: transitive dependency: transitive
description: description:
@ -365,14 +365,6 @@ packages:
url: "https://mirrors.tuna.tsinghua.edu.cn/dart-pub/" url: "https://mirrors.tuna.tsinghua.edu.cn/dart-pub/"
source: hosted source: hosted
version: "2.2.0" version: "2.2.0"
http:
dependency: "direct main"
description:
name: http
sha256: "6aa2946395183537c8b880962d935877325d6a09a2867c3970c05c0fed6ac482"
url: "https://mirrors.tuna.tsinghua.edu.cn/dart-pub/"
source: hosted
version: "0.13.5"
http_multi_server: http_multi_server:
dependency: transitive dependency: transitive
description: description:
@ -521,10 +513,10 @@ packages:
dependency: transitive dependency: transitive
description: description:
name: path_provider_linux name: path_provider_linux
sha256: ab0987bf95bc591da42dffb38c77398fc43309f0b9b894dcc5d6f40c4b26c379 sha256: "2e32f1640f07caef0d3cb993680f181c79e54a3827b997d5ee221490d131fbd9"
url: "https://mirrors.tuna.tsinghua.edu.cn/dart-pub/" url: "https://mirrors.tuna.tsinghua.edu.cn/dart-pub/"
source: hosted source: hosted
version: "2.1.7" version: "2.1.8"
path_provider_platform_interface: path_provider_platform_interface:
dependency: transitive dependency: transitive
description: description:
@ -934,10 +926,10 @@ packages:
dependency: transitive dependency: transitive
description: description:
name: xdg_directories name: xdg_directories
sha256: bd512f03919aac5f1313eb8249f223bacf4927031bf60b02601f81f687689e86 sha256: ee1505df1426458f7f60aac270645098d318a8b4766d85fde75f76f2e21807d1
url: "https://mirrors.tuna.tsinghua.edu.cn/dart-pub/" url: "https://mirrors.tuna.tsinghua.edu.cn/dart-pub/"
source: hosted source: hosted
version: "0.2.0+3" version: "1.0.0"
xml: xml:
dependency: transitive dependency: transitive
description: description:

View File

@ -39,7 +39,6 @@ dependencies:
go_router: ^6.0.1 go_router: ^6.0.1
fluentui_system_icons: ^1.1.190 fluentui_system_icons: ^1.1.190
json_annotation: ^4.8.0 json_annotation: ^4.8.0
http: ^0.13.5
fluent_ui: ^4.2.0 fluent_ui: ^4.2.0
flutter_launcher_icons: ^0.11.0 flutter_launcher_icons: ^0.11.0
shared_preferences: ^2.0.17 shared_preferences: ^2.0.17