一、Flutter image_picker 实现相机拍照和相册选择
  https://pub.dev/packages/image_picker
 
二、Flutter 上传图片到服务器
  https://pub.dev/packages/dio
 
上传2.0    dio: 2.1.7
//上传图片
_uploadImage(_imageDir) async{
FormData formData = new FormData.from({
"name": "zhangsna 6666666666",
"age": 20,
"sex":"男",
"file":new UploadFileInfo(_imageDir, "xxx.jpg"),
});
var response = await Dio().post("http://jd.itying.com/imgupload", data: formData); print(response);
}
案例代码   上传3.0
import 'dart:io';
import 'package:flutter/material.dart';
import 'package:image_picker/image_picker.dart';
import 'package:dio/dio.dart'; class CameraPage extends StatefulWidget{
CameraPage({Key key});
_CameraPage createState() => _CameraPage();
} class _CameraPage extends State {
var cameraImg;
var albumImg; // 相机
getCameraImg() async {
var camera = await ImagePicker.pickImage(source: ImageSource.camera, maxWidth: 100);
uploadImg(camera);
setState(() {
cameraImg = camera;
});
}
// 相册
getAlbumImg() async {
var album = await ImagePicker.pickImage(source: ImageSource.gallery, maxWidth: 100);
setState(() {
albumImg = album;
});
}
// 上传图片
uploadImg(File imgUrl) async {
var path = imgUrl.path;
var formData = FormData.fromMap({
"name": "wendux",
"age": 25,
"file": MultipartFile.fromFileSync(path, filename: "upload.img")
});
var response = await Dio().post("https://pub.dev/packages/dio", data: formData);
print(response);
}
@override
Widget build(BuildContext context) {
// TODO: implement build
return Scaffold(
appBar: AppBar(
title: Text('设备硬件')
),
body: ListView(
children: <Widget>[
RaisedButton(child: Text('相机 上传图片'), onPressed: () {
getCameraImg();
}),
cameraImg == null ? SizedBox(height: 0) : Container(
height: 100,
child: Image.file(cameraImg),
),
RaisedButton(child: Text('相册'), onPressed: getAlbumImg),
albumImg == null ? SizedBox(height: 0) : Container(
height: 100,
child: Image.file(albumImg),
)
],
)
);
}
}

调用原生硬件 Api 实现照相机 拍照和相册选择 以及拍照上传的更多相关文章

  1. Ionic4 Cordova 调用原生硬件 Api 实现扫码功能

    QR Scanner 速度快,样式随心所欲,默认只能扫二维码 https://ionicframework.com/docs/native/qr-scanner/ 安装插件 ionic cordova ...

  2. IOS研究院之打开照相机与本地相册选择图片(六)

    原创文章如需转载请注明:转载自雨松MOMO程序研究院本文链接地址:IOS研究院之打开照相机与本地相册选择图片(六) Hello 大家好 IOS的文章好久都木有更新了,今天更新一篇哈. 这篇文章主要学习 ...

  3. FastDFS的配置、部署与API使用解读(2)以字节方式上传文件的客户端代码(转)

    本文来自 诗商·柳惊鸿 Poechant CSDN博客,转载请注明源地址:FastDFS的配置.部署与API使用解读(2)上传文件到FastDFS分布式文件系统的客户端代码 在阅读本文之前,请您先通过 ...

  4. HTML5 Plus 拍照或者相册选择图片上传

    HBuilder+HTML5 Plus+MUI实现拍照或者相册选择图片上传,利用HTML5 Plus的Camera.Gallery.IO.Storage和Uploader来实现手机APP拍照或者从相册 ...

  5. 转:【微信小程序】 微信小程序-拍照或选择图片并上传文件

    调用拍照API:https://mp.weixin.qq.com/debug/wxadoc/dev/api/media-picture.html?t=20161222#wxchooseimageobj ...

  6. IOS研究院之打开照相机与本地相册选择图片

    如下图所示 在本地相册中选择一张图片后,我们将他拷贝至沙盒当中,在客户端中将它的缩略图放在按钮旁边,这个结构其实和新浪微薄中选择图片后的效果一样.最终点击发送将按钮将图片2进制图片上传服务器. 下面我 ...

  7. FastDFS的配置、部署与API使用解读(8)FastDFS多种文件上传接口详解(转)

    1.StorageClient与StorageClient1的区别 相信使用happy_fish的FastDFS的童鞋们,一定都熟悉StorageClient了,或者你熟悉的是StorageClien ...

  8. MUI 单个图片上传预览(拍照+系统相册):先选择->预览->上传提交

    1 html部分 <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> < ...

  9. HTML5 file API加canvas实现图片前端JS压缩并上传

    一.图片上传前端压缩的现实意义 对于大尺寸图片的上传,在前端进行压缩除了省流量外,最大的意义是极大的提高了用户体验. 这种体验包括两方面: 由于上传图片尺寸比较小,因此上传速度会比较快,交互会更加流畅 ...

随机推荐

  1. openlayers显示比例尺

    <!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title&g ...

  2. Game with string CodeForces - 1104B

    虽然只是B题,还是div2的 但感觉挺有意思,所以写一篇博客记录一下 最初的想法是利用DP去做,f[s]=true表示字符串s对应先手赢,否则对应后手赢,大致想了下发现是指数级别的算法,看了下范围直接 ...

  3. 按钮控制彩灯实验 CSU - 1770 树状数组 差分变单点修改

    #include<iostream> #include<algorithm> #include<cstring> using namespace std; ; in ...

  4. luogu P1736 创意吃鱼法

    #include<iostream> #include<cstring> #include<cstdio> #include<algorithm> #i ...

  5. 0级搭建类013-CentOS 8.x 安装

    CentOS 8 操作系统安装

  6. 根据指定id取出数组中指定对象

    // 需求:根据Id取出数组中指定的对象 let arr = [ { id: 1, rotationAngle: 330, target: '目标1' }, { id: 2, rotationAngl ...

  7. ECMAScript基本语法——⑤运算符 算数运算符

    +-*/%

  8. Unable to connect to Elasticsearch at http://elasticsearch:9200. statu red Kibana 安装

    解决方案 docker run -d -p 5601:5601 --link elasticsearch -e "elasticsearch_url=容器ip:9200" --na ...

  9. mycat linux上目录介绍

    1.本文引用来自mycat官方文档,具体可以浏览mycat官网 2.linux系统下面的目录 MyCAT 有提供编译好的安装包,支持 windows.Linux.Mac.Solaris 等系统上安装与 ...

  10. ROS2GO 与WIN10 双系统安装

    关于ROS2GO的一些心得: 我是一个ROS的探索者,在接触ROS一段时间后,意外发现了一个关于ROS2GO的信息,是天之博特的微信公众号发表的.简单来说ROS2GO就是一个装了ROS的Ubuntu系 ...