Flutter图片压缩插件flutter_img_compress的使用

Flutter图片压缩插件flutter_img_compress的使用

通过使用flutter_img_compress插件，你可以将图片压缩到预期的大小。

如何使用？

// 文件路径
String? filePath = await FlutterImageCompress.compressImage(
  path, // 原始图片路径
  maxSize: size, // 目标文件大小（字节）
  maxWidth: maxWidth, // 最大宽度
  maxHeight: maxHeight, // 最大高度
  quality: quality, // 质量 (0-100)
);

或者简化版：

String? filePath = await FlutterImageCompress.compressImage(
  path, // 原始图片路径
  quality: quality, // 质量 (0-100)
  maxWidth: maxWidth, // 最大宽度
  maxHeight: maxHeight, // 最大高度
);

保存路径

String? defaultPath = await FlutterImageCompress.getCompressDefaultPath();

完整示例Demo

以下是一个完整的示例代码，展示如何使用flutter_img_compress插件进行图片压缩。

import 'package:flutter_img_compress/flutter_img_compress.dart';
import 'package:flutter/services.dart';
import 'package:flutter/material.dart';
import 'dart:async';

void main() {
  runApp(MyApp());
}

class MyApp extends StatefulWidget {
  [@override](/user/override)
  _MyAppState createState() => _MyAppState();
}

class _MyAppState extends State<MyApp> {
  String _platformVersion = '未知';

  [@override](/user/override)
  void initState() {
    super.initState();
    initPlatformState();
  }

  // 平台消息异步处理，初始化状态
  Future<void> initPlatformState() async {
    String? platformVersion;
    // 可能会抛出平台异常，因此使用try/catch
    try {
      platformVersion = await FlutterImageCompress.getCompressDefaultPath();
    } on PlatformException {
      platformVersion = '获取平台版本失败。';
    }

    // 如果小部件从树中移除时异步平台消息仍在飞行中，则应丢弃回复而不是调用setState更新非存在的外观。
    if (!mounted) return;

    setState(() {
      _platformVersion = platformVersion ?? '';
    });
  }

  [@override](/user/override)
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(
          title: const Text('插件示例应用'),
        ),
        body: Center(
          child: Text('运行在: $_platformVersion\n'),
        ),
      ),
    );
  }
}

更多关于Flutter图片压缩插件flutter_img_compress的使用的实战教程也可以访问 https://www.itying.com/category-92-b0.html

1 回复

更多关于Flutter图片压缩插件flutter_img_compress的使用的实战系列教程也可以访问 https://www.itying.com/category-92-b0.html


flutter_img_compress 是一个用于在 Flutter 应用中压缩图片的插件。它可以帮助你减少图片文件的大小，从而节省存储空间和加快图片加载速度。以下是使用 flutter_img_compress 的基本步骤：

1. 添加依赖

首先，你需要在 pubspec.yaml 文件中添加 flutter_img_compress 的依赖：

dependencies:
  flutter:
    sdk: flutter
  flutter_img_compress: ^1.1.0  # 请检查最新版本

然后运行 flutter pub get 来安装依赖。

2. 导入包

在你的 Dart 文件中导入 flutter_img_compress 包：

import 'package:flutter_img_compress/flutter_img_compress.dart';

3. 压缩图片

使用 flutter_img_compress 压缩图片非常简单。以下是一个基本的示例：

Future<void> compressImage() async {
  // 选择图片文件
  final pickedFile = await ImagePicker().getImage(source: ImageSource.gallery);

  if (pickedFile != null) {
    // 获取图片文件路径
    final filePath = pickedFile.path;

    // 压缩图片
    final compressedFile = await FlutterImgCompress.compressAndGetFile(
      filePath,  // 原始图片路径
      filePath + '_compressed.jpg',  // 压缩后图片保存路径
      quality: 80,  // 压缩质量，0-100，数值越小压缩率越高
      minWidth: 1024,  // 压缩后的最小宽度
      minHeight: 1024,  // 压缩后的最小高度
    );

    // 打印压缩后的文件路径
    print('Compressed file path: ${compressedFile?.path}');
  }
}

4. 使用压缩后的图片

压缩后的图片文件路径可以通过 compressedFile?.path 获取，你可以将其用于显示、上传或其他操作。

5. 其他参数

FlutterImgCompress.compressAndGetFile 方法还支持其他参数，例如：

  • rotate: 旋转角度
  • format: 输出图片格式（如 CompressFormat.JPEG, CompressFormat.PNG 等）
  • inSampleSize: 采样率，减少图片分辨率

6. 处理权限

在使用图片选择器时，确保你已经处理了相关的权限问题。例如，在 Android 上需要 READ_EXTERNAL_STORAGE 权限，在 iOS 上需要访问相册的权限。

7. 错误处理

在实际使用中，建议添加错误处理逻辑，以应对可能出现的异常情况。

try {
  final compressedFile = await FlutterImgCompress.compressAndGetFile(
    filePath,
    filePath + '_compressed.jpg',
    quality: 80,
  );
  print('Compressed file path: ${compressedFile?.path}');
} catch (e) {
  print('Error compressing image: $e');
}

8. 完整示例

以下是一个完整的示例，展示如何选择图片并压缩：

import 'package:flutter/material.dart';
import 'package:flutter_img_compress/flutter_img_compress.dart';
import 'package:image_picker/image_picker.dart';

void main() {
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  [@override](/user/override)
  Widget build(BuildContext context) {
    return MaterialApp(
      home: ImageCompressExample(),
    );
  }
}

class ImageCompressExample extends StatefulWidget {
  [@override](/user/override)
  _ImageCompressExampleState createState() => _ImageCompressExampleState();
}

class _ImageCompressExampleState extends State<ImageCompressExample> {
  String? _compressedImagePath;

  Future<void> compressImage() async {
    final pickedFile = await ImagePicker().getImage(source: ImageSource.gallery);

    if (pickedFile != null) {
      final filePath = pickedFile.path;

      try {
        final compressedFile = await FlutterImgCompress.compressAndGetFile(
          filePath,
          filePath + '_compressed.jpg',
          quality: 80,
        );

        setState(() {
          _compressedImagePath = compressedFile?.path;
        });

        print('Compressed file path: $_compressedImagePath');
      } catch (e) {
        print('Error compressing image: $e');
      }
    }
  }

  [@override](/user/override)
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('Image Compress Example'),
      ),
      body: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: [
            if (_compressedImagePath != null)
              Image.file(File(_compressedImagePath!)),
            ElevatedButton(
              onPressed: compressImage,
              child: Text('Compress Image'),
            ),
          ],
        ),
      ),
    );
  }
}
回到顶部