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

第二百九十三回

文章目录

  • 1. 概念介绍
  • 2. 方法与细节
    • 2.1 实现方法
    • 2.2 具体细节
  • 3. 示例代码
  • 4. 内容总结

我们在上一章回中介绍了"如何混合选择多个图片和视频文件"相关的内容,本章回中将介绍如何通过相机获取图片文件.闲话休提,让我们一起Talk Flutter吧。

1. 概念介绍

我们在前面章回中介绍的选择图片或者视频文件的方式都是通过文件窗口进行的,本章回中将介绍如何通过相机获取图片文件,也就是说我们不再选择已经已经拍好的图片,
而是在选择图片时直接使用相机拍一张新图片。

2. 方法与细节

通过相机获取图片也是通过image_picke包来实现,这个包虽然叫image_picker,但是它可以选择视频,而且可以调用相机去拍照和录像。

2.1 实现方法

该包提供了pickImage()方法来从相机获取图片文件,接下来我们介绍详细的实现方法。

  • 创建文件选择器对象,也就是包中提供的ImagePicker类的实例;
  • 使用文件选择器的pickImage()方法获取图片文件,通过该方法的参数把图片源设置为相机;
  • 该方法会启动相机来拍照并且把拍照后图片的存储路径返回给方法调用者;
  • 获取到文件路径后就可以使用Image组件的file()方法加载图片文件。

2.2 具体细节

上面的步骤中使用了ImagePicker的pickImage()方法,该方法返回的是Future<XFile?>类型的对象,因此我们需要通过Future的then方法来获取文件路径。
此外,该方法需要异步运行,因为获取文件路径是比较耗时的操作。方法中的source参数用来控制图片源,包中一共支持两种图片源:gallery和camera。它们分别表
示通过相册和相机来获取图片。该方法还有一个命名参数:CameraDevice,该参数用来控制拍照时使用前置相机还是后置相机。

3. 示例代码

ImagePicker imagePicker = ImagePicker();XFile? _mediaFile;double imgWidth = 200;
double imgHeight = 400;///注意获取图片需要异步操作
Future<XFile?> getImageFileByCamera() async {var imgFile = await imagePicker.pickImage(source: ImageSource.camera,maxWidth: imgWidth,maxHeight: imgHeight,imageQuality: 10,);return imgFile;
}///通过按钮来发出指令
ElevatedButton(onPressed: () {getImageFileByCamera().then((value) {///因为是异步,所以需要通过setState更新数据源setState(() {///返回的路径是app下的缓冲目录:data/user/0/packagename/cache/scaled_1000000010.jpg// debugPrint("path: v${value[0].path}");_mediaFile = value;});});},child: const Text("Load Image"),
),///显示图片文件
_mediaFile == null? const Icon(Icons.image): (_mediaFile!.path.isEmpty? const Text("do not select image"): Image.file(File(_mediaFile!.path),width: imgWidth,height: imgHeight,errorBuilder: (context, error, trace) {return Text("load image error: $error");},))

上面的示例代码中演示了如何通过相机获取图片文件,代码把pickImage()方法封装成了异步方法,并且将它绑定到按钮上,这样就可以在点击按钮时发出获取文件的指
令,此时会打开相机,我们可以使用相机拍照,拍照完后有确认和放弃所拍图片的图标:对号和和错号。这种操作以可视化操作的方式选择图片文件,十分方便。代码中加
载图片前需要检查文件路径,文件路径在程序最开始运行时为null,在程序运行后,但是没有选择任何图片文件时的文件路径不为空,而是为empty,这点需要特别注意,
不然无法正确显示图片文件。此外,我们获取到的图片文件路径是一个相对路径,它并不是图片文件的绝对路径。

4. 内容总结

最后,我们对本章回的内容做一个全面的总结:

  • Flutter官方提供了image_picker包,该包以可视化操作的方式获取文件路径;
  • 使用包中的pickImage()方法可以通过相机拍照来获取图片文件的相对路径;
  • 包中的pickImage()方法提供了相关的参数来设置图片来源和前后相机;
  • 加载图片文件前需要检查文件路径的可靠性,不然可能导致Image组件无法加载图片文件;
    看官们,与"如何通过相机获取图片文件"相关的内容就介绍到这里,欢迎大家在评论区交流与讨论!

相关文章:

第二百九十三回

文章目录 1. 概念介绍2. 方法与细节2.1 实现方法2.2 具体细节 3. 示例代码4. 内容总结 我们在上一章回中介绍了"如何混合选择多个图片和视频文件"相关的内容&#xff0c;本章回中将介绍如何通过相机获取图片文件.闲话休提&#xff0c;让我们一起Talk Flutter吧。 1. …...

【网络协议分析】使用Wireshark分析UDP协议

一、实验目的 通过使用Wireshark抓取UDP流来分析学习UDP协议&#xff0c;比较TCP与UDP的不同。 二、实验过程 1、使用Wireshark抓取UDP报文流&#xff0c;常见的使用UDP协议的应用有DNS、QQ、在线游戏等。 2、分析抓取到的数据包&#xff0c;比较与TCP协议的异同。 我们选取DN…...

TensorFlow Lite中文本分类在Android上的实践

#1 Tensorflow Lite TensorFlow Lite(后续简称TFL) 是 Google 开发的一个用于移动设备和嵌入式设备的开源库,旨在为移动终端设备提供机器学习推断。它是 TensorFlow 框架的轻量级版本,专门优化了模型的大小和性能,以适应资源受限的移动设备和嵌入式系统。 TFL 提供了一种在移…...

使用vscode查bug

具体操作 修改CMakeList.txt # set(CMAKE_BUILD_TYPE "Release")//注释Release模式 set(CMAKE_BUILD_TYPE "Debug")//设置为Debug模式 # set(CMAKE_CXX_FLAGS_RELEASE "-O3 -Wall -g")//注释*这行代码是用来设置 CMake 构建系统中 Release 模式…...

LC 2846. 边权重均等查询

2846. 边权重均等查询 难度&#xff1a; 困难 题目大意&#xff1a; 现有一棵由 n 个节点组成的无向树&#xff0c;节点按从 0 到 n - 1 编号。给你一个整数 n 和一个长度为 n - 1 的二维整数数组 edges &#xff0c;其中 edges[i] [ui, vi, wi] 表示树中存在一条位于节点 …...

RabbitMQ简单模式和工作模式

RabbitMQ 是一个消息队列中间件&#xff0c;用于在分布式系统中进行消息传递。在 RabbitMQ 中&#xff0c;有几种工作模式&#xff0c;其中简单模式和工作模式是其中两种基本的模式之一。 简单模式&#xff08;Simple Mode&#xff09;&#xff1a; 在简单模式中&#xff0c;有…...

c语言实战之贪吃蛇

文章目录 前言效果展示游戏用到的图片游戏思路一览游戏前准备一、贪吃蛇、食物、障碍物节点坐标的结构体二、枚举游戏状态、和贪吃蛇的方向三、维护运行的结构体 游戏开始前的初始化一、学习图形库相关知识二、设置背景三、欢迎界面四、初始化贪吃蛇五、生成障碍物六、生成食物…...

Midjourney图片生成描述词记录(今天一天)

抄别人的描述词 /imagine prompt:https://&#xff08;你的图片地址&#xff09;.jpg Super handsome boy IP by pop mart , green suit, no hair, bald head, Scenes in spring , pastel color , mockup , fine luster , clean background ,3D render , Soft focus , oc , bl…...

类和对象 第五部分第四小节:赋值运算符重载

C编译器至少给一个类添加4个函数 1.默认构造函数无参&#xff0c;函数体为空 2.默认析构函数无参&#xff0c;函数体为空 3.默认拷贝沟早函数&#xff0c;对属性进行值拷贝 4.赋值运算符“operator”&#xff0c;对属性进行值拷贝 如果类中有属性指向堆区&#xff0c;做赋值操作…...

Django从入门到精通(一)

目录 一、Django环境搭建与命令 1.1、安装 1.2、命令行 创建项目 编写代码 运行 app概念 1.3、Pycharm创建项目 1.4、虚拟环境 创建虚拟环境 - 命令行 介绍 操作 基本问题 Pycharm 项目虚拟环境 django虚拟环境【安装django最新版本】 django虚拟环境【安装指…...

数据库分表分库的原则

什么是数据库分库分表 数据库分表&#xff08;Table Sharding&#xff09; 数据库分表是将一个大表按照某种规则拆分成多个小表存储在不同的物理表中的技术。通常&#xff0c;拆分规则是基于某个列的值进行拆分&#xff0c;例如根据用户ID或日期范围等进行拆分。每个小表只包…...

Java技术栈 —— Docker容器

Java技术栈 —— Docker容器 一、什么是Docker&#xff1f;二、如何安装Docker&#xff1f;三、如何使用Docker&#xff1f; 一、什么是Docker&#xff1f; docker的本意是码头工人。 Docker 是一个开源的应用容器引擎&#xff0c;让开发者可以打包他们的应用以及依赖包到一个…...

Mysql大数据量分页优化

前言 之前有看过到mysql大数据量分页情况下性能会很差&#xff0c;但是没有探究过它的原因&#xff0c;今天讲一讲mysql大数据量下偏移量很大&#xff0c;性能很差的问题&#xff0c;并附上解决方式。 原因 将原因前我们先做一个试验&#xff0c;我做试验使用的是mysql5.7.2…...

QT tcp与udp网络通信以及定时器的使用 (7)

QT tcp与udp网络通信以及定时器的使用 文章目录 QT tcp与udp网络通信以及定时器的使用1、QT网络与通信简单介绍2、QT TCP通信1、 服务器的流程2、 客户端的流程3、服务器的编写4、客户端的编写 3、QT UDP通信1、客户端流程2、客户端编写3、UDP广播4、UDP组播 4、定时器的用法1、…...

web架构师编辑器内容-添加自动保存的功能

对于频繁改动的应用&#xff0c;自动保存的功能是一个非常有用的功能&#xff0c;可以避免用户在没有保存的情况下丢失自己保存过的数据。 对于自动保存&#xff0c;一般有两种实现&#xff0c;参考语雀和石墨&#xff1a; 语雀采用的是定时保存的方式&#xff0c;大约在3分半…...

【Redis】关于它为什么快?使用场景?以及使用方式?为何引入多线程?

目录 1.既然redis那么快&#xff0c;为什么不用它做主数据库&#xff0c;只用它做缓存&#xff1f; 2.Redis 一般在什么场合下使用&#xff1f; 3.redis为什么这么快&#xff1f; 4.Redis为什么要引入了多线程&#xff1f; 1.既然redis那么快&#xff0c;为什么不用它做主数据…...

SpringBoot之JWT登录

JWT JSON Web Token&#xff08;JSON Web令牌&#xff09; 是一个开放标准(rfc7519)&#xff0c;它定义了一种紧凑的、自包含的方式&#xff0c;用于在各方之间以JSON对象安全地传输信息。此信息可以验证和信任&#xff0c;因为它是数字签名的。jwt可以使用秘密〈使用HNAC算法…...

【备战蓝桥杯】——循环结构

&#x1f308;个人主页: Aileen_0v0 &#x1f525;热门专栏: 华为鸿蒙系统学习|计算机网络|数据结构与算法 ​&#x1f4ab;个人格言:“没有罗马,那就自己创造罗马~” #mermaid-svg-bFHV3Dz5xMe6d3NB {font-family:"trebuchet ms",verdana,arial,sans-serif;font-siz…...

【数据分享】1929-2023年全球站点的逐年平均气温数据(Shp\Excel\免费获取)

气象数据是在各项研究中都经常使用的数据&#xff0c;气象指标包括气温、风速、降水、湿度等指标&#xff0c;其中又以气温指标最为常用&#xff01;说到气温数据&#xff0c;最详细的气温数据是具体到气象监测站点的气温数据&#xff01;本次我们为大家带来的就是具体到气象监…...

探索Pyecharts关系图绘制技巧:炫酷效果与创意呈现【第42篇—python:Pyecharts水球图】

文章目录 Pyecharts绘制多种炫酷关系网图引言准备工作代码实战1. 基本关系网图2. 自定义节点样式和边样式3. 关系网图的层级结构4. 添加标签和工具提示5. 动态关系网图6. 高级关系网图 - Les Miserables 示例7. 自定义关系网图布局8. 添加背景图9. 3D 关系网图10. 热力关系网图…...

蓝桥杯-循环节长度

两个整数做除法&#xff0c;有时会产生循环小数&#xff0c;其循环部分称为: 循环节。比如&#xff0c;11/136>0.8461553846153..... 其循环节为[846153] 共有 6 位。下面的方法&#xff0c;可以求出循环节的长度。请仔细阅读代码&#xff0c;并填写划线部分缺少的代码。 注…...

Jython调用openwire库连接activemq转发topic订阅消息到另一个activemq 服务器上 完整代码

以下是一个示例代码&#xff0c;演示如何在Jython中使用OpenWire库连接ActiveMQ&#xff0c;将一个主题&#xff08;topic&#xff09;上的订阅消息转发到另一个ActiveMQ服务器上&#xff1a; from org.apache.activemq import * from org.apache.activemq.transport import *…...

面试经典题---30.串联所有单词的子串

30.串联所有单词的子串 我的解法&#xff1a; 滑动窗口&#xff1a; 解法中用到了两个哈希表map1和map2&#xff0c;分别用于记录words中各个单词的出现频数和当前滑动窗口[left, right)中单词的出现频数&#xff1b;外部for循环i从0到len - 1&#xff0c;内部while循环每次会…...

字符串随机生成工具(开源)-Kimen(奇门)

由于最近笔者在开发数据脱敏相关功能&#xff0c;其中一类脱敏需求为能够按照指定的格式随机生成一个字符串来代替原有信息&#xff0c;数据看起来格式需要与原数据相同&#xff0c;如&#xff1a;电话号码&#xff0c;身份证号以及邮箱等。在网上搜索了下&#xff0c;发现没有…...

UE4 CustomDepthMobile流程小记

原生UE opaque材质中获取CustomDepth/CustomStencil会报错 在其Compile中调用的函数中没有看到报错逻辑 材质节点的逻辑都没有什么问题&#xff0c;所以看一下报错 在HLSLMaterialTranslator::Translate中 修改之后 mobile流程的不透明材质可以直接获取SceneTexture::customd…...

Docker 基础篇

目录 一、Docker 简介 1. Docker 2. Linux 容器 3. 传统虚拟机和容器的对比 4. Docker 的作用 5. Docker 的基本组成&#xff08;Docker 三要素&#xff09; 6. Docker 工作原理 7. Docker 架构 8. Docker 下载 二、Docker 安装 1. CentOS Docker 安装 2. CentOS8 …...

Idea上操作Git回退本地版本,怎么样保留已修改的文件,回退本地版本的四种方式代表什么?

Git的基本概念:Git是一个版本控制系统,用于管理代码的变更历史记录。核心概念包括仓库、分支、提交和合并。 1、可以帮助开发者合并开发的代码 2、如果出现冲突代码的合并,会提示后提交合并代码的开发者,让其解决冲突 3、代码文件版本管理 问题描述 当我们使用git提交代码…...

vue3封装el-pagination分页组件

1、效果如图&#xff1a; 2、分页组件代码&#xff1a; <template><div class"paging"><el-config-provider :locale"zhCn"><el-paginationv-model:current-page"page.currentPage"v-model:page-size"page.pageSize…...

负载均衡下Webshell连接思路及难点

君衍. 一、应用场景二、环境搭建三、思路以及难点1、查看内部结构2、查看webshell3、使用蚁剑进行连接4、难点1 shell文件上传问题5、难点2 命令执行时飘逸6、难点3 大工具上传失败7、难点4 脚本失效 四、解决方式1、关闭对方节点服务器2、基于IP地址判断是否执行3、脚本实现流…...

基于链表实现贪吃蛇游戏

本文中&#xff0c;我们将使用链表和一些Win32 API的知识来实现贪吃蛇小游戏 一、功能 &#xff08;1&#xff09;游戏载入界面 &#xff08;2&#xff09;地图的绘制 &#xff08;3&#xff09;蛇身的移动和变长 &#xff08;4&#xff09;食物的生成 &#xff08;5&…...