flutter 顺逆时针旋转图片铺满比例区域
2023-12-13 04:10:12
最近遇到一个项目需求,这里记录下。将图片进行顺时针旋转90°和逆时针90°,保证图片都铺满矩形框区域
import 'dart:async';
import 'dart:io';
import 'dart:math';
import 'dart:ui' as ui;
import 'package:flutter/foundation.dart';
import 'package:flutter/material.dart';
class MyHomePage extends StatefulWidget {
const MyHomePage({super.key});
@override
State<MyHomePage> createState() => _MyHomePageState();
}
class _MyHomePageState extends State<MyHomePage> {
double rate = 4 / 6;
String imageUrl =
'https://ss0.baidu.com/94o3dSag_xI4khGko9WTAnF6hhy/zhidao/pic/item/b2de9c82d158ccbfb40a4fd81bd8bc3eb035419a.jpg';
double imageWidth = 0;
double imageHeight = 0;
double scale = 1;
double angle = 0;
Future? future;
@override
void initState() {
future = download();
super.initState();
}
@override
Widget build(BuildContext context) {
return Scaffold(
backgroundColor: const Color(0xFFF5F9FA),
appBar: AppBar(
title: const Text('图片旋转'),
),
body: FutureBuilder(
future: future,
builder: (BuildContext context, AsyncSnapshot<dynamic> snapshot) {
if (snapshot.data == null) {
return const SizedBox();
}
Uint8List bytes = snapshot.data;
return Column(
children: [
ElevatedButton(
onPressed: () {
changeAngle(false);
},
child: const Text('逆时针')),
ElevatedButton(
onPressed: () {
changeAngle(true);
},
child: const Text('顺时针')),
AspectRatio(
aspectRatio: rate,
child: Container(
width: double.infinity,
height: double.infinity,
color: Colors.blue,
padding: const EdgeInsets.all(6),
child: LayoutBuilder(
builder: (c, b) {
if (angle % pi != 0) {
scale = getMinMaxScaleSingle(b.maxWidth, b.maxHeight);
} else {
scale = 1;
}
return Transform.scale(
scale: scale,
child: Transform.rotate(
angle: angle,
child: Image.memory(bytes),
),
);
},
),
),
)
],
);
},
),
);
}
changeAngle(bool clockwise) {
if (clockwise) {
angle += pi / 2;
if (angle == pi * 2) angle = 0;
} else {
angle -= pi / 2;
if (angle == -pi * 2) angle = 0;
}
if (mounted) setState(() {});
}
//获得单个图片区域的最小最大缩放比例
double getMinMaxScaleSingle(double width, double height) {
final fittedSizes = getFittedSizes(width, height);
double imgWidth = fittedSizes.destination.width;
double imgHeight = fittedSizes.destination.height;
if (angle % pi != 0) {
imgWidth = fittedSizes.destination.height;
imgHeight = fittedSizes.destination.width;
}
double scaleX = width / imgWidth;
double scaleY = height / imgHeight;
double minScale = scaleX > scaleY ? scaleY : scaleX;
return minScale;
}
FittedSizes getFittedSizes(double width, double height) {
return applyBoxFit(
BoxFit.contain, Size(imageWidth, imageHeight), Size(width, height));
}
Future download() async {
var httpClient = HttpClient();
try {
var request = await httpClient.getUrl(Uri.parse(imageUrl));
var response = await request.close();
var imageByte = await consolidateHttpClientResponseBytes(response);
var codec = await ui.instantiateImageCodec(imageByte);
ui.FrameInfo fi = await codec.getNextFrame();
imageWidth = fi.image.width * 1.0;
imageHeight = fi.image.height * 1.0;
return imageByte;
} catch (error) {
return null;
}
}
}
文章来源:https://blog.csdn.net/u012401513/article/details/134880995
本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。 如若内容造成侵权/违法违规/事实不符,请联系我的编程经验分享网邮箱:veading@qq.com进行投诉反馈,一经查实,立即删除!
本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。 如若内容造成侵权/违法违规/事实不符,请联系我的编程经验分享网邮箱:veading@qq.com进行投诉反馈,一经查实,立即删除!