当前位置: 首页 > news >正文

Flutter_学习记录_ ImagePicker拍照、录制视频、相册选择照片和视频、上传文件

插件地址:https://pub.dev/packages/image_picker

  1. 添加插件
    在这里插入图片描述
  2. 添加配置

android无需配置开箱即用,ios还需要配置info.plist

<key>NSPhotoLibraryUsageDescription</key> 
	<string>应用需要访问相册读取文件</string> 
<key>NSCameraUsageDescription</key> 
	<string>应用需要访问相机拍照</string> 
<key>NSMicrophoneUsageDescription</key> 
	<string>应用需要访问麦克风录制视频</string>
  1. 核心代码
import 'package:image_picker/image_picker.dart';


final ImagePicker picker = ImagePicker();
// 从相册选择相机
final XFile? image = await picker.pickImage(source: ImageSource.gallery);
// 拍照
final XFile? photo = await picker.pickImage(source: ImageSource.camera);
// 从相册选择视频
final XFile? galleryVideo =
    await picker.pickVideo(source: ImageSource.gallery);
// 录制视频
final XFile? cameraVideo = await picker.pickVideo(source: ImageSource.camera);
  1. 完整代码
import 'dart:io';

import 'package:flutter/material.dart';
import 'package:image_picker/image_picker.dart';
// 本地视频播放的逻辑
import 'package:video_player/video_player.dart';
import 'package:chewie/chewie.dart';

class ImagePickerDemo extends StatefulWidget {
  const ImagePickerDemo({super.key});

  
  State<ImagePickerDemo> createState() => _ImagePickerDemoState();
}

class _ImagePickerDemoState extends State<ImagePickerDemo> {

  final ImagePicker _imagePicker  = ImagePicker();
  XFile? _pickerImage;
  XFile? _pickerVideo;

  // 配置加载本地视频
  late VideoPlayerController _videoPlayerController;
  late ChewieController _chewieController;

  // 拍照
  void _imagePickerCamera() async {
    final XFile? image = await _imagePicker.pickImage(
      source: ImageSource.camera,
      // 可以不设置,设置上可以避免数据太大
      maxHeight: 800,
      maxWidth: 800
    );
    if (image != null) {
      print(image.path);
      setState(() {
        _pickerVideo = null;
        _pickerImage = image;
      });
    }
  }

  // 相册选择图片
  void _imagePickerGallery() async {
    final XFile? image = await _imagePicker.pickImage(
      source: ImageSource.gallery,
      // 可以不设置,设置上可以避免数据太大
      maxHeight: 800,
      maxWidth: 800
    );
    if (image != null) {
      print(image.path);
      setState(() {
        _pickerVideo = null;
        _pickerImage = image;
      });
    } 
  }

  // 视频-选择相机录制
  void _videoPickerCamera() async {
    final XFile? video = await _imagePicker.pickVideo(source: ImageSource.camera);
    if (video != null) {
      print(video.path);
      await _initVideo(File(video.path));
      setState(() {
        _pickerImage = null;
        _pickerVideo = video;
      });
    }
  }

  // 视频-选择相册
  void _videoPickerGallery() async {
    final XFile? video = await _imagePicker.pickVideo(source: ImageSource.gallery);
    if (video != null) {
      print(video.path);
      await _initVideo(File(video.path));
      setState(() {
        _pickerImage = null;
        _pickerVideo = video;
      });
    }
  }

  // 显示图片或者显示视频
  Widget _showImageOrVideoWidget() {
    if (_pickerImage != null) {
      return Image.file(File(_pickerImage!.path));
    } else if (_pickerVideo != null) {
      return AspectRatio(
        aspectRatio: _videoPlayerController.value.aspectRatio,
        child: Chewie(controller: _chewieController)
      );
    } else {
      return Text("请选择图片或者视频");
    }
  }

  // 初始化播放器--用于播放本地视频
  Future _initVideo(File fileDir) async {
    _videoPlayerController = VideoPlayerController.file(fileDir);
    await _videoPlayerController.initialize();

    _chewieController = ChewieController(
      videoPlayerController: _videoPlayerController,
      aspectRatio: _videoPlayerController.value.aspectRatio,
      autoPlay: true,
      looping: false
    );
  }

  
  void dispose() {
    try {
      _videoPlayerController.dispose();
      _chewieController.dispose();
    } catch (e) {
      print(e);
    }
   
    super.dispose();
  }

  
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text("图片选择器"),
      ),
      body: ListView(
        padding: EdgeInsets.all(10),
        children: [
          Center(child: ElevatedButton(
            onPressed: _imagePickerGallery, 
            child: Text("图片-选择相册")
          )),
          Center(child: ElevatedButton(
            onPressed: _imagePickerCamera, 
            child: Text("图片-选择相机")
          )),
          Center(child: ElevatedButton(
            onPressed: _videoPickerGallery, 
            child: Text("视频-选择相册")
          )),
          Center(child: ElevatedButton(
            onPressed: _videoPickerCamera, 
            child: Text("视频-选择相机")
          )),
          SizedBox(height: 20),
          // 展示图片或者视频
          _showImageOrVideoWidget()
        ],
      ),
    );
  }
}
  1. 效果图
    在这里插入图片描述
  2. 上传文件(未测试,先记录)
  _uploadFile(String imagePath) async {
    var formData = FormData.fromMap({
        'name': 'wendux', 
        'age': 25, 
        'file': await MultipartFile.fromFile(imagePath, filename: 'aaa.png')
    }); 
    
    var response = await Dio().post(
      'https://xxx/imgupload', 
      data: formData
    );
    print(response); 
  }
}

相关文章:

  • 无监督学习——降维问题:主成分分析(PCA)详解
  • 【原创】在宝塔面板中为反向代理添加Beare认证
  • 【Linux 指北】常用 Linux 指令汇总
  • C语言中的字符串处理
  • Python :数据模型
  • Windows 图形显示驱动开发-WDDM 3.0功能- IOMMU DMA 重新映射(一)
  • NLP常见任务专题介绍(4)-ConditionalGeneration和CasualLM区别
  • 移远通信联合德壹发布全球首款搭载端侧大模型的AI具身理疗机器人
  • Kubernetes学习笔记-移除Nacos迁移至K8s
  • 一键阐述“多线程、多进程、多任务”的场景需求
  • 【Unity】在项目中使用VisualScripting
  • E-foto:开源的摄影测量与遥感图像处理工具
  • 免费blender模型网站推荐
  • CTF杂项——[SWPUCTF 2024 秋季新生赛]ez-QR
  • IP层之分片包的整合处理---BUG修复
  • Calibre-Web-Automated:打造你的私人图书馆
  • PHP火山引擎API签名方法
  • websocket学习手册及python实现简单的聊天室
  • 卡特兰数专题
  • KCD 北京站丨Volcano 邀您畅聊云原生智能调度技术与应用
  • 对电子政务做技术支持的网站/快速提升关键词排名软件
  • 网站建设中的思想和算法/企业查询网
  • 武汉网站开发网站/百度网络推广怎么做
  • 怎么做类似豆瓣的网站/优化seo网站
  • 在搜狐快站上做网站怎么跳转/优化网站的方法
  • 建设网站的技术风险/网页模板