第三百九十二回

news2024/10/2 16:22:45

文章目录

  • 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组件无法加载图片文件;
    看官们,与"如何通过相机获取图片文件"相关的内容就介绍到这里,欢迎大家在评论区交流与讨论!

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/1505229.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

NoSQL--3.MongoDB配置(Linux版)

目录 2.2 Linux环境下操作 2.2.1 传输MongoDB压缩包到虚拟机&#xff1a; 2.2.2 启动MongoDB服务&#xff1a; 2.2 Linux环境下操作 2.2.1 传输MongoDB压缩包到虚拟机&#xff1a; &#xff08;笔者使用XShell传输&#xff09; 如果不想放在如图的路径&#xff0c;删除操作…

【Python使用】python高级进阶知识md总结第2篇:HTTP 请求报文,HTTP响应报文【附代码文档】

python高级进阶全知识知识笔记总结完整教程&#xff08;附代码资料&#xff09;主要内容讲述&#xff1a;操作系统&#xff0c;虚拟机软件&#xff0c;Ubuntu操作系统&#xff0c;Linux内核及发行版&#xff0c;查看目录命令&#xff0c;切换目录命令&#xff0c;绝对路径和相对…

(001)UV 的使用以及导出

文章目录 UV窗口导出模型的主要事项导出时材质的兼容问题unity贴图导出导出FBX附录 UV窗口 1.uv主要的工作区域&#xff1a; 2.在做 uv 和贴图之前&#xff0c;最好先应用下物体的缩放、旋转。 导出模型的主要事项 1.将原点设置到物体模型的底部&#xff1a; 2.应用修改器的…

【SpringCloud】微服务重点解析

微服务重点解析 1. Spring Cloud 组件有哪些&#xff1f; 2. 服务注册和发现是什么意思&#xff1f;Spring Cloud 如何实现服务注册和发现的&#xff1f; 如果写过微服务项目&#xff0c;可以说做过的哪个微服务项目&#xff0c;使用了哪个注册中心&#xff0c;常见的有 eurek…

跨平台大小端判断与主机节序转网络字节序使用

1.macOS : 默认使用小端 ,高位使用高地址,转换为网络字节序成大端 #include <iostream> #include <arpa/inet.h> int main() {//大小端判断union{short s;char c[sizeof(short)];}un;un.s = 0x0102;printf("低地址:%d,高地址:%d\n",un.c[0],un.c[1]);if …

腾讯云8核16G服务器支持多少人同时访问?性能和价格测评

腾讯云8核16G轻量服务器CPU性能如何&#xff1f;18M带宽支持多少人在线&#xff1f;轻量应用服务器具有100%CPU性能&#xff0c;18M带宽下载速度2304KB/秒&#xff0c;折合2.25M/s&#xff0c;系统盘为270GB SSD盘&#xff0c;月流量3500GB&#xff0c;折合每天116.6GB流量&…

STM32---ADC

ADC 概念 众所周知&#xff0c;GPIO只能读入高电平或者低电平&#xff0c;那如果现有一个模拟量&#xff0c;该如何读取呢&#xff0c;比如电压的范围是0~3.3v&#xff0c;如何获取电压的值。就需要ADC&#xff08;Analog-Digital Converter&#xff09;了。ADC可以将引脚上连…

童装WP模板

童装WP模板 https://www.wpniu.com/moban/6359.html

学习和认知的四个阶段,以及学习方法分享

本文分享学习的四个不同的阶段&#xff0c;以及分享个人的一些学习方法。 一、学习认知的四个阶段 我们在学习的过程中&#xff0c;总会经历这几个阶段&#xff1a; 第一阶段&#xff1a;不知道自己不知道&#xff1b; 第二阶段&#xff1a;知道自己不知道&#xff1b; 第三…

在 Python 中加速卫星时间合成的生成️

基于 fastnanquantile 库计算基于分位数的时间复合的更快方法 简要背景 为了从卫星图像创建时间合成图像,我们通常只获取云量低于特定阈值(例如 40%)的图像,遮盖云和云阴影,并随时间聚合图像。例如,如果我们一年中有 50 张图像(在云层覆盖限制内以及云/阴影遮罩之后),…

【经管数据-更新】华证ESG评级得分数据(2009-2023年)

一、数据说明 参考《经济研究》中方先明&#xff08;2023&#xff09;的做法&#xff0c;将华证ESG评级进行赋值&#xff0c;指标包含C、CC、CCC、B、BB、BBB、A、AA、AAA共9个等级&#xff0c;将上市公司ESG 等级从低到高分别赋值为1至9 二、数据来源&#xff1a;世界银行&am…

Linux多线程之线程控制

(&#xff61;&#xff65;∀&#xff65;)&#xff89;&#xff9e;嗨&#xff01;你好这里是ky233的主页&#xff1a;这里是ky233的主页&#xff0c;欢迎光临~https://blog.csdn.net/ky233?typeblog 点个关注不迷路⌯▾⌯ 目录 一、pthread_crate 二、pthread_join 三、p…

diffusion model(十三):DiT技术小结

infopaperhttps://arxiv.org/abs/2212.09748githubhttps://github.com/facebookresearch/DiT/tree/main个人博客主页http://myhz0606.com/article/ditcreate date2024-03-08 阅读前需要具备以下前置知识&#xff1a; DDPM(扩散模型基本原理)&#xff1a;知乎地址 个人博客地址…

英伟达jetson nano第一次进入镜像配置

我所用产品为jetbot Ubuntu18.04LTS CtrlAltT启动终端 设置分辨率 xrandr –output HDMI-0 –mode “1920x1080” 最好在设置中重新配置下 不然重启又得调 联网-更新语言包 reboot重启

【Tauri】(5):本地运行candle和 qwen 大模型,并测试速度

1&#xff0c;本地运行candle 关于candle项目 https://github.com/huggingface/candle Hugging Face 使用rust开发的高性能推理框架。 语法简单&#xff0c; 风格与 PyTorch 相似。 CPU 和 Cuda Backend&#xff1a;m1、f16、bf16。 支持 Serverless&#xff08;CPU&#xff…

【二分】第十二届蓝桥杯省赛第一场C++ B组/C组《杨辉三角形》(c++)

【题目描述】 下面的图形是著名的杨辉三角形&#xff1a; 如果我们按从上到下、从左到右的顺序把所有数排成一列&#xff0c;可以得到如下数列&#xff1a; 1&#xff0c;1&#xff0c;1&#xff0c;1&#xff0c;2&#xff0c;1&#xff0c;1&#xff0c;3&#xff0c;3&…

Orange3数据预处理(转换器组件)

该组件接收数据&#xff0c;然后重新应用之前在模板数据上执行的转换。 这些转换包括选择变量的子集以及从数据中出现的其他变量计算新的变量&#xff0c; 例如&#xff0c;离散化、特征构建、主成分分析&#xff08;PCA&#xff09;等。 在Orange3中&#xff0c;描述的这个组件…

python爬虫(4)

#前期先说明一下为啥爬虫需要学习数组的存储和处理&#xff0c;只是说在你后期接触到最简单的爬虫后有一个地方可以存放你的数据# 下面为大家带来一个我在做excel表整理时的代码以及上次代码的结果 上次代码的结果&#xff1a; 新的代码&#xff1a; import numpy as np im…

使用python翻转图片

原图 代码 from PIL import Imagedef flip_image(image_path):# 打开图片with Image.open(image_path) as img:# 获取图片的模式&#xff08;RGB/RGBA/其他&#xff09;mode img.mode# 创建一个新图片&#xff0c;模式与原图一样&#xff0c;大小为原图的翻转大小flipped_img…

【网络原理】使用Java基于TCP搭建简单客户端与服务器通信

目录 &#x1f384;API介绍&#x1f338;ServerSocket API&#x1f338;Socket API &#x1f340;TCP中的长短连接&#x1f333;建立TCP回显客户端与服务器&#x1f338;TCP搭建服务器&#x1f338;TCP搭建客户端 ⭕总结 TCP服务器与客户端的搭建需要借助以下API &#x1f384;…