文章目錄

• • 1、安裝依賴
  • 2、使用裁剪功能之前需要在AndroidManifest.xml文件中配置
  • 3、在頁面上引入插件
  • 4、定義方法
  • 5、在點擊上傳的按鈕調用 getImage
  • 注意：根據以上流程來的裁剪出來的圖片是矩形的，因為插件中提供默認截取方式是矩形的。如果我們想要截出來的圖片是圓形的，需要在ImageCropper.cropImage（）增加一個cropStyle參數： cropStyle:CropStyle.circle

問題：在使用flutter開發的時候，我們通常會遇到對圖片的處理，比如：從相冊中選取圖片（這篇文章不再敘述，如有疑問請點這里查看）
今天的問題將選取到的圖片進行裁剪

1、安裝依賴

# 本地圖片image_picker: ^0.6.0+4# 圖片裁切image_cropper: ^1.0.2

2、使用裁剪功能之前需要在AndroidManifest.xml文件中配置

<activityandroid:name="com.yalantis.ucrop.UCropActivity"android:screenOrientation="portrait"android:theme="@style/Theme.AppCompat.Light.NoActionBar"/>

3、在頁面上引入插件

import 'package:image_picker/image_picker.dart'; import 'dart:io'; import 'package:image_cropper/image_cropper.dart';

4、定義方法

File _image;Future getImage() async {var image = await picker.getImage(source: ImageSource.gallery);File croppedFile = await ImageCropper.cropImage(sourcePath: image.path,maxWidth: 512,maxHeight: 512,);setState(() {print('>>>>>>>>>> $croppedFile');_image = croppedFile;});}

5、在點擊上傳的按鈕調用 getImage

注意：根據以上流程來的裁剪出來的圖片是矩形的，因為插件中提供默認截取方式是矩形的。如果我們想要截出來的圖片是圓形的，需要在ImageCropper.cropImage（）增加一個cropStyle參數： cropStyle:CropStyle.circle

File _image;Future getImage() async {var image = await picker.getImage(source: ImageSource.gallery);File croppedFile = await ImageCropper.cropImage(sourcePath: image.path,maxWidth: 512,maxHeight: 512,cropStyle:CropStyle.circle);setState(() {print('>>>>>>>>>> $croppedFile');_image = croppedFile;});}

總結

以上是生活随笔為你收集整理的flutter 中对图片的处理（选取和裁剪）的插件的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。