Flutter 使用插件打开相册、相机「建议收藏」

Flutter 使用插件打开相册、相机「建议收藏」需求:image_picker的使用,点击按钮底部弹出相册、拍照选择框,实现具体功能1:引入插件pubspec.yaml增加image_picker:^0.7.5+22:android添加androidx兼容gradle.properties增加android.useAndroidX=trueandroid.enableJetifier=truebuild添加依赖androidTestImplementation’androidx.tes…

大家好,又见面了,我是你们的朋友全栈君。如果您正在找激活码,请点击查看最新教程,关注关注公众号 “全栈程序员社区” 获取激活教程,可能之前旧版本教程已经失效.最新Idea2022.1教程亲测有效,一键激活。

Jetbrains全系列IDE使用 1年只要46元 售后保障 童叟无欺

需求: image_picker的使用,点击按钮底部弹出 相册、拍照选择框,实现具体功能

 

1:引入插件
pubspec.yaml 增加
 

 image_picker: ^0.7.5+2

2:android 添加androidx兼容

gradle.properties 增加
 

android.useAndroidX=true
android.enableJetifier=true

build 添加依赖

androidTestImplementation 'androidx.test:runner:1.1.1'
    androidTestImplementation 'androidx.test.espresso:espresso-core:3.1.1'
    testImplementation 'androidx.test:core:1.2.0'

3: ios ->Runner->info.plist添加权限说明

 

<key>NSCameraUsageDescription</key>
    	<string>这是你的自拍照</string>
    	<key>NSMicrophoneUsageDescription</key>
    	<string>用于音频插件</string>
    	<key>NSPhotoLibraryUsageDescription</key>
    	<string>用于相册选择插件</string>
    	<key>UIBackgroundModes</key>
    	<array>
    		<string>remote-notification</string>
    	</array>

4:编写Ui
添加一个浮动按钮,增加点击事件弹出相册/拍照选择框具体如下:
 

floatingActionButton: FloatingActionButton(
        child: Center(
            child: Text(
          "点我",
          style: TextStyle(color: Colors.white),
        )),
        backgroundColor: Colors.blueAccent,
        elevation: 0.2,
        onPressed: () {
          //点击事件
          showPicker();
        },
      )

 

//弹出选择相册/拍照对话框
  showPicker() {
    //底部弹出
    showModalBottomSheet(
        context: context,
        builder: (BuildContext con) => Container(
              height: 160,
              padding: EdgeInsets.all(20),
              color: Colors.white,
              child: Expanded(
                child: ListView(
                  children: [createItem(true, "拍照"), createItem(false, "相册")],
                ),
              ),
            ));
  }
//创建item
  Widget createItem(bool state, String name) {
    return GestureDetector(
        onTap: () {
          //点击事件处理
          openPicker(state);
        },
        child: ListTile(
          leading: Icon(state ? Icons.camera : Icons.image),
          title: Text(name),
        ));
  }
//使用imagePicker异步打开拍照 、相册
  openPicker(bool state) async {
    //销毁底部弹出框
    Navigator.pop(context);
    var picker = ImagePicker();
    //根据状态标识决定打开相机还是相册
    var future = await picker.getImage(
        source: state ? ImageSource.camera : ImageSource.gallery);
    setState(() {
      //通过setstate 通知重绘更新
      file = File(future.path);
    });
  }
拿到了图片,那么就差左后一步了,实现body 添加Image 显示图片,代码如下:
 body: Container(
        alignment: Alignment.center,
        margin: EdgeInsets.all(20),
        //没有图片时候显示占位图
        child: file == null ? Icon(Icons.image,) : Image.file(file),
      )

 

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请联系我们举报,一经查实,本站将立刻删除。

发布者:全栈程序员-站长,转载请注明出处:https://javaforall.net/193177.html原文链接:https://javaforall.net

(0)
上一篇 2025年11月30日 下午4:43
下一篇 2025年11月30日 下午5:15


相关推荐

  • 别手动搭n8n了,n8n邪修出手,1个mcp工具让搭建部署全自动

    别手动搭n8n了,n8n邪修出手,1个mcp工具让搭建部署全自动

    2026年3月15日
    2
  • QStringList 的学习笔记

    QStringList 的学习笔记因公司项目,开始学习QT,这里做一些学习笔记,一遍以后忘记了可以翻阅。笔记内容写的简单,勿怪。参考博客:https://blog.csdn.net/u013360881/article/details/52170487QStringList初始化QStringListqstrList;qstrList&amp;lt;&amp;lt;&quot;Android&quot;&amp;lt;&amp;lt;&quot;Qt

    2022年6月9日
    40
  • mongodb和mysql应用场景区别_mongodb和mysql有哪些区别「建议收藏」

    mongodb和mysql应用场景区别_mongodb和mysql有哪些区别「建议收藏」mongodb和mysql有哪些区别发布时间:2020-09-0109:15:48来源:亿速云阅读:64作者:小新小编给大家分享一下mongodb和mysql有哪些区别,相信大部分人都还不怎么了解,因此分享这篇文章给大家参考一下,希望大家阅读完这篇文章后大有收获,下面让我们一起去了解一下吧!区别分析:)MySQL是关系型数据库。优势:在不同的引擎上有不同的存储方式。查询语句是使用传统的sql语…

    2025年7月10日
    4
  • springboot整合kafka配置_kafka怎么使用

    springboot整合kafka配置_kafka怎么使用本文是SpringBoot+Kafka的实战讲解,如果对kafka的架构原理还不了解的读者,建议先看一下《大白话kafka架构原理》、《秒懂kafkaHA(高可用)》两篇文章。一、生产者实践 普通生产者 带回调的生产者 自定义分区器 kafka事务提交 二、消费者实践 简单消费 指定topic、partition、offset消费 …

    2022年4月19日
    696
  • 安防监控系统的几个基础小知识

    安防监控系统的几个基础小知识  问题一:摄像机装多高?  我在和客户沟通的时,很多时候都建议客户室内不低于2.5米,室外不低于3.5米,这些数字虽然简单但考虑到了室内的高度及镜头下压的角度,也考虑到了室外安装时照射的长度及防人为破坏的因素。  问题二:支架安装有何建议?  在装摄像机的时候都会有壁装和吊装两种选择,超市等室内环境吊装比较多,室外一般选择壁装。一般轻巧些的机器比如中维世纪的JVS-N81-HY用04、05…

    2022年6月28日
    26
  • 1、Pycharm 常用配置及快捷键

    1、Pycharm 常用配置及快捷键1 主题 字体及代码分割线 RightMargin 配置 IDE amp amp amp amp Editor 主题配置字体 颜色 配置代码分割线的取消及设置 2 IDE 布局及全屏设置将项目移动到右侧边栏然后在菜单栏 Window amp gt StoreCurrent 还可以在菜单栏的 View amp gt Enter

    2026年3月27日
    3

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注

关注全栈程序员社区公众号