flutter 保存图片

Flutter生成长截图并保存在本地 xml中需要配置权限。yaml文件需要引入。 阅读详情

保存本地图片或生成的图片(例如生成的二维码)

1、通过GlobalKey获取currentContext
GlobalKey imgkey = GlobalKey()
2、

1)Widget RepaintBoundary的currentContext上有个findRenderObject方法
2)返回后再去调用toImage创建Image,
3)再通过Image转成ByteData,
4)ByteData再转buffer,
5)获取当前路径
6)创建和写入File
7)GallerySaver包去保存图片
web端需要特殊处理:
1)ByteData转base64后
2)用universal_html包创建a标签模拟点击事件去下载

import 'dart:convert';
import "package:universal_html/html.dart" as html;

static saveWebImg(byteData, fileName) {
    final base64data = base64Encode(byteData);
    final a = html.AnchorElement(href: 'data:image/jpeg;base64,$base64data');
    a.download = '${fileName ?? 'download'}.png';
    a.click();
    a.remove();
    EasyLoading.dismiss();
    $tips('保存成功');
  }
RepaintBoundary(
      key: imgkey ,
      child: Image,
    )
import 'package:flutter/foundation.dart';  // 用kIsWeb判断web端

final boundary = imgkey.currentContext!.findRenderObject() as RenderRepaintBoundary;

final image = await boundary.toImage(pixelRatio: 5.0);
final byteData = await (image.toByteData(format: ImageByteFormat.png));
if (byteData != null) {
 final pngBytes = byteData.buffer.asUint8List();
 if (kIsWeb) {
   return saveWebImg(pngBytes, 'fileName');  // 处理web端图片下载
 }
  final directory = (await getApplicationDocumentsDirectory()).path;
  String path = '$directory/${fileName ?? DateTime.now()}.png';
  final imgFile = File(path);
  imgFile.writeAsBytes(pngBytes);
  bool success = false;
  try {
    success = await GallerySaver.saveImage(imgFile.path)
        .then((_success) => _success ?? false);
  } catch (e) {
    print('err === $e');
  }
  EasyLoading.dismiss();
  if (success) return $tips('${tips ?? '保存成功'}!路径:$path');
}

代码:
需安装三个包
permission_handler // 确认权限
gallery_saver // 保存图片
path_provider // 获取路径
并根据包的说明去配置安卓和ios权限

import 'package:permission_handler/permission_handler.dart';
import 'package:gallery_saver/gallery_saver.dart';
import 'package:path_provider/path_provider.dart';

  static createImg({required key, required child}) {
    return RepaintBoundary(
      key: key,
      child: child,
    );
  }

  static saveImg({required key, fileName, tips}) async {
    _saveImage(isSave) async {
      if (isSave) {
        final boundary =
            key.currentContext!.findRenderObject() as RenderRepaintBoundary;
        // We can increse the size of QR using pixel ratio
        final image = await boundary.toImage(pixelRatio: 5.0);
        final byteData = await (image.toByteData(format: ImageByteFormat.png));
        if (byteData != null) {
          final pngBytes = byteData.buffer.asUint8List();
          // getting directory of our phone
          final directory = (await getApplicationDocumentsDirectory()).path;
          String path = '$directory/${fileName ?? DateTime.now()}.png';
          final imgFile = File(path);
          imgFile.writeAsBytes(pngBytes);
          bool success = false;
          try {
            success = await GallerySaver.saveImage(imgFile.path)
                .then((_success) => _success ?? false);
          } catch (e) {
            print('err === $e');
          }
          if (success) return $tips('${tips ?? '保存成功'}!路径:$path');
        }
      }
      $tips('保存失败!');
    }

    if (kIsWeb) {
      return _saveImage(true);
    }
    Permission.storage.request().then((res) async {
      _saveImage(res.isGranted);
    }, onError: (err) {
      print('err === $err');
      $tips('保存失败!无保存图片权限!');
    });
  }

保存网络图片

gallery_saver // 保存图片

import 'package:gallery_saver/gallery_saver.dart';

void _saveNetworkImage() async {
   String path =
       'https://image.shutterstock.com/image-photo/montreal-canada-july-11-2019-600w-1450023539.jpg';
   GallerySaver.saveImage(path).then((bool success) {
     setState(() {
       print('Image is saved');
     });
   });
 }
Flutter 将文字转换成图片(widget转换成图片)并下载 Flutter 将文字转换成图片(widget转换成图片)并下载 桌面端 阅读详情

相关推荐

flutter图片保存到应用沙盒目录中

3、将图片存在应用的沙盒目录中,再将图片路径存在shared_preferences中,一般用户不会访问更不会删除沙盒目录中的文件,所以相对来说是最优解。缺点:实际保存的是图片在设备中的地址,一旦用户将图片删除,该地址就无法读取出图片,那么头像就无法显示了。2、将图片转成base64编码字符串,存在shared_preferences中。缺点:base64字符串解码成图片的时间太长,UI切换时头像会闪烁,使用感差。需求是:去中心化APP实现用户头像修改功能。1、将图片的path存在。

m0_72010625的博客 1181

flutter开发实战-图片保存到相册

flutter开发实战-图片保存到相册。保存相册使用的是image_gallery_saver插件。

一名开发者 4500

flutter图片识别_Flutter 保存图片和文件

1.注册storage读写权限在AndroidManifest.xml注册文件中注册权限如下:2.使用的插件cached_network_image: ^2.0.0image_gallery_saver: ^1.2.2permission_handler: '^4.2.0+hotfix.2'cached_network_image是我用于缓存网络图片的插件(也可以不使用这个插件,则下面获取图片文件...

weixin_31748605的博客 1651

Flutter之下载网络图片保存到本地文件夹

flutter中,下载图片到本地的自定义文件位置

weixin_43244083的博客 4771

flutter 保存图片到本地

f'lutter 图片保存 分为俩步: 1.开启存储图片权限开启权限需要用到permission_handler pubspec 添加 permission_handler: ^3.0.1下载包就可以了 添加开启权限配置 <uses-permission android:name="android.permission.INTERNET"/><us...

weixin_30426957的博客 5174

Flutter 图片保存到本地

引入image_gallery_saver插件 pubspec.yaml文件中引入: dependencies: image_gallery_saver: ^1.1.0 权限设置 Android配置 文件地址:android/app/src/profile/AndroidManifest.xml <manifest xmlns:android="http://schem...

isusjjyy的专栏 7166

Flutter图片添加水印功能,Flutter保存Widget为图片

题记 —— 执剑天涯,从你的点滴积累开始,所及之处,必精益求精,即是折腾每一天。 重要消息 网易云【玩转大前端】配套课程 EDU配套 教程 Flutter开发的点滴积累系列文章 在这里采用的实现思路是使用层叠布局Stack加载图片以及水印部分,水印部分可能是一个现成的图片也可能是一个文字等其他样式的组件,然后将这个Stack使用RepaintBoundary组件包裹起来,然后通过Widget生成图片的功能从而达到实现保存图片为水印效果。 如图下图所示,加载的本地资源目录下的一张图片

代码小疯子 5390

flutter 生成图片保存到手机相册

在pubspec.yaml文件添加插件 image_gallery_saver安装1.5.0版本就好了,我之前安装的1.6.6会报错 # 权限控制插件 permission_handler: 5.0.1 permission_handler_platform_interface: ^2.0.1 # 文件保存插件 image_gallery_saver: 1.5.0 记得安装一下 flutter pub get android和ios配置 ios 修改文件 在ios/Runn

wangweiscsdn的博客 4754

flutter base64图片保存到相册

因为’data:image/png;base64,’ is part of the data URL,不是base-64字符串的一部分。您需要首先从URL中提取base-64数据。首先base64转成uint8List,然后再用插件保存到相册(没有内置的方法处理)网站用图片转base64如下。

weixin_44911775的博客 8239

Flutter 关于图片保存以及权限申请及安卓配置

Flutter关于图片保存依赖包android配置页面中的使用 依赖包 permission_handler: ^3.0.1 image_gallery_saver: ‘^1.5.0’ android配置 // An highlighted block <uses-permission android:name="android.permission.INTERNET"/> <uses-permission android:name="android

前端颜小白 3234

flutter图片预览_flutter 图片查看浏览,保存到本地

这里介绍的是图片查看库photo_view的使用以及达到我们的效果我们使用了一下插件,效果还是很棒的图片浏览的插件是不支持保存到本地的,所以我们这边结合image_gallery_saver保存到相册。写入相册是需要申请权限的所以用到 permission_handler。Untitled.gif1。配置pubspec.yaml#图片浏览查看photo_view: ^0.9.2#图片保存到本地相册...

weixin_39760619的博客 1575

Flutter 学习 之 图片的选择、裁切、保存

这里我选择的是image_picker优点官方出品的插件可以直接调用相册和相机无需提前申请权限可以多选和单选选择丰富缺点多选需要长按没有明显的提示。

Dream It Possible 6221

flutter 生成图片保存到相册

1、在pubspec.yaml添加依赖 # 图片保存 image_gallery_saver: ^1.7.1 获取插件 flutter pub get 2、引入头文件 import 'dart:io'; import 'dart:typed_data'; import 'package:image_gallery_saver/image_gallery_saver.dart'; import 'package:permission_handler/permission_handler

lqw200931116的博客 6757

Flutter 学习之图片的选择、裁切、保存

Flutter中,我们可以通过调用系统的图片选择器来选择一张图片,也可以通过使用插件来实现图片的裁切和保存

weixin_43740011的博客 1807

flutter 保存图片或者视频到相册

非常好用的插件:image_gallery_saver 保存网络图像 _save() async { var response = await Dio().get("https://ss0.baidu.com/94o3dSag_xI4khGko9WTAnF6hhy/image/h%3D300/sign=a62e824376d98d1069d40a31113eb807/83...

仰望星空 6732

Flutter 绘制番外 | 将你的 Canvas 绘制保存图片

theme: cyanosis 前言 光阴似箭,《Flutter 绘制指南 - 妙笔生花》 转眼间已经发布两年半了,不知道各位练习得怎么样。有不少朋友问过如何将 Canvas 绘制的内容保存图片,最近在做的东西刚好涉及了这块,通过本文来分享一下。 提到保存图片,很多人可能会想到 RepaintBoundary, 但它使用起来有点繁琐,同时也存在一些局限性。而且 Canvas 有更灵活的...

张风捷特烈的博客 1456

Flutter】二维码生成,Widget转图片图片保存相册

文章目录1、生成二维码2、Widget转图片3、图片保存至相册 1、生成二维码 使用qr_flutter:https://pub.dev/packages/qr_flutter Container( padding: EdgeInsets.only( left: MediaQuery.of(context).size.width / 5, right: MediaQuery.of(context).size.width / 5), ch

这家伙很懒,博客简介都不写 1万+

Flutter 生成图片保存

概述 Flutter生成图片相当于是对某一个Widget进行截图保存 保存图片需要获取文件存储权限 引入插件permission_handler(权限控制插件)、image_gallery_saver(文件保存插件) 设置修改权限文件 引入插件后,需要对ios和安卓分别设置权限 安卓修改文件android/app/src/main/AndroidManifest.xml,添加如下代码 <uses-permission android:name="android.per...

qq2276031的博客 2771
上一篇: sass-loader node-sass 对应版本
下一篇: webstorm license server
咸鱼与梦想
博客等级 码龄9年 24粉丝 · 63原创
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值