Flutter图片管理插件fk_photos的使用
Flutter图片管理插件fk_photos的使用
安装
在 pubspec.yaml
文件中添加依赖:
dependencies:
fk_photos: <last_version>
使用
1. cameraPicker
拍照/拍摄视频 <- Future
参数说明
参数 | 描述 | 类型 | 默认值 |
---|---|---|---|
isAllowRecording | 是否允许录像 | bool | false |
enableAudio | 录像时是否需要录制声音 | bool | false |
maximumRecordingDuration | 录制视频最长时长 | Duration | 15s |
resolutionPreset | 相机的分辨率预设 | ResolutionPreset | high |
2. albumPicker
资源选择器(图片/视频) <- Future<List>
参数说明
参数 | 描述 | 类型 | 默认值 |
---|---|---|---|
selectedAssets | 默认选中的资源 | List | null |
requestType | 选择器选择资源的类型 | RequestType | image |
maxAssets | 最多选择的图片数量 | int | 1 |
3. deleteAsset
删除资源文件 <- Future
参数说明
参数 | 描述 | 类型 | 默认值 |
---|---|---|---|
id | 资源id | String | null |
4. saveToAlbum
保存图片到相册 <- Future
参数说明
参数 | 描述 | 类型 | 默认值 |
---|---|---|---|
url | 网络图片 | String | null |
asset | 资源文件 | AssetEntity | null |
base64Img | Base64 图片 | String | null |
uint8list | Uint8List | Uint8List | null |
path | 本地文件路径 | String | null |
5. 压缩图片
5.1 compressFile
压缩图片 <- Future
参数说明
参数 | 描述 | 类型 | 默认值 |
---|---|---|---|
file | 图片文件 | File | null |
minWidth | 最小宽度 | int | 1920 |
minHeight | 最小高度 | int | 1080 |
quality | 质量 | int | 85 |
5.2 compressAndGetFile
压缩图片 <- Future
参数说明
参数 | 描述 | 类型 | 默认值 |
---|---|---|---|
file | 图片文件 | File | null |
targetPath | 保存路径 | String | null |
minWidth | 最小宽度 | int | 1920 |
minHeight | 最小高度 | int | 1080 |
quality | 质量 | int | 85 |
5.3 compressAsset
压缩图片 <- Future
参数说明
参数 | 描述 | 类型 | 默认值 |
---|---|---|---|
assetName | 资源文件名称 | String | null |
minWidth | 最小宽度 | int | 1920 |
minHeight | 最小高度 | int | 1080 |
quality | 质量 | int | 85 |
5.4 compressList
压缩图片 <- Future
参数说明
参数 | 描述 | 类型 | 默认值 |
---|---|---|---|
list | Uint8List | Uint8List | null |
minWidth | 最小宽度 | int | 1920 |
minHeight | 最小高度 | int | 1080 |
quality | 质量 | int | 85 |
6. 扩展功能
6.1 AssetEntityExtension
on AssetEntity
saveToAlbum
: 保存到相册toBase64
: 转为base64compress
: 压缩文件, 压缩参数请参考FKPhotos.compressAndGetFile
6.2 Uint8ListExtension
on Uint8List
toBase64
: 转为base64
6.3 FileExtension
on File
toBase64
: 转为base64
7. 快捷方法
7.1 showPhotoViewerDialog
显示图片弹窗
showPhotoViewerDialog();
更多关于Flutter图片管理插件fk_photos的使用的实战教程也可以访问 https://www.itying.com/category-92-b0.html
1 回复
更多关于Flutter图片管理插件fk_photos的使用的实战系列教程也可以访问 https://www.itying.com/category-92-b0.html
当然,以下是如何在Flutter项目中使用fk_photos
插件来管理图片的示例代码。fk_photos
插件通常用于图片的选择、预览和管理等功能。请注意,实际使用时你需要确保在pubspec.yaml
文件中添加该插件的依赖,并且已经正确配置了你的Flutter开发环境。
1. 添加依赖
首先,在你的pubspec.yaml
文件中添加fk_photos
的依赖:
dependencies:
flutter:
sdk: flutter
fk_photos: ^最新版本号 # 替换为实际的最新版本号
然后运行flutter pub get
来安装依赖。
2. 导入插件
在你的Dart文件中导入fk_photos
插件:
import 'package:fk_photos/fk_photos.dart';
import 'package:flutter/material.dart';
3. 使用FKPhotos插件
下面是一个简单的示例,展示了如何使用fk_photos
插件来选择和预览图片:
void main() {
runApp(MyApp());
}
class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return MaterialApp(
title: 'Flutter fk_photos Demo',
theme: ThemeData(
primarySwatch: Colors.blue,
),
home: MyHomePage(),
);
}
}
class MyHomePage extends StatefulWidget {
@override
_MyHomePageState createState() => _MyHomePageState();
}
class _MyHomePageState extends State<MyHomePage> {
List<String> selectedImages = [];
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text('fk_photos Demo'),
),
body: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
ElevatedButton(
onPressed: () async {
// 打开图片选择器
List<String> result = await FKPhotos.pickImages(
maxCount: 10, // 最大选择图片数量
selectType: SelectType.album, // 选择类型:相册或相机
);
// 更新选择的图片列表
setState(() {
selectedImages = result;
});
},
child: Text('选择图片'),
),
SizedBox(height: 20),
Expanded(
child: GridView.builder(
gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
crossAxisCount: 3,
crossAxisSpacing: 4,
mainAxisSpacing: 4,
),
itemCount: selectedImages.length,
itemBuilder: (context, index) {
return Image.file(
File(selectedImages[index]),
fit: BoxFit.cover,
);
},
),
),
],
),
);
}
}
4. 注意事项
- 在实际使用中,你可能需要处理更多的错误和边缘情况,例如权限请求(读取存储权限)。
FKPhotos.pickImages
方法返回的是图片的路径列表,你需要使用File
类来加载这些图片。- 插件的API可能会随着版本更新而变化,请参考最新的官方文档来获取最新的使用方法和API。
这个示例展示了如何使用fk_photos
插件来选择图片并在界面上显示它们。你可以根据需要进一步扩展这个示例,例如添加图片预览、删除等功能。