首页 > 其他分享 >Flutter实现将base64解码为image格式,并展示到页面上

Flutter实现将base64解码为image格式,并展示到页面上

时间:2023-08-11 19:32:38浏览次数:424  
标签:Base64 解码 base64String base64 Flutter memory 页面 image Base64Image

在Flutter中,你可以使用Image.memory来将Base64解码为图像并将其显示在页面上。下面是一个将Base64解码为图像并展示的示例代码:

import 'dart:convert';
import 'package:flutter/material.dart';

class Base64Image extends StatelessWidget {
  final String base64String;

  Base64Image({required this.base64String});

  @override
  Widget build(BuildContext context) {
    Uint8List bytes = base64Decode(base64String);

    return Image.memory(bytes);
  }
}

void main() {
  String base64String = "your_base64_string_here";
  
  runApp(MaterialApp(
    home: Scaffold(
      body: Center(
        child: Base64Image(base64String: base64String),
      ),
    ),
  ));
}

在上述代码中,我们创建了一个名为Base64Image的自定义小部件。该小部件接收一个Base64编码的字符串作为参数,并将其解码为Uint8List类型的字节数组。然后,我们使用Image.memory构造函数将字节数组转换为图像并将其显示在页面上。

main函数中,我们创建了一个简单的Flutter应用程序,并将Base64Image小部件作为居中的子部件显示在页面上。你需要将base64String替换为你自己的Base64编码的字符串。

标签:Base64,解码,base64String,base64,Flutter,memory,页面,image,Base64Image
From: https://blog.51cto.com/u_15997490/7051490

相关文章

  • java使用hutool把服务器图片链接转为base64编码
    需求是把服务器的图片链接或者网上的图片链接地址转为base64位编码方便前端操作建议使用方法一base64编码转为图片在线网址https://imgtobase64.d777.com/方法一:使用hutool的HttpResponse方法1.1引入依赖<dependency><groupId>cn.hutool</groupId><artifactId>hutool-all</artif......
  • Flutter系列文章-Flutter UI进阶
    在本篇文章中,我们将深入学习FlutterUI的进阶技巧,涵盖了布局原理、动画实现、自定义绘图和效果、以及Material和Cupertino组件库的使用。通过实例演示,你将更加了解如何创建复杂、令人印象深刻的用户界面。第一部分:深入理解布局原理1.灵活运用Row和ColumnRow和Colu......
  • pyinstaller 打包labelImage
    有输出框pyinstaller--hidden-import=PyQt5--hidden-import=lxml-F-n"labelImg"-cmain.py-p./--distpath"C:/abc"--add-data"./data;data/"--distpath打包输出路径没有输出框pyinstaller--hidden-import=PyQt5--hidden-import=lxml-F-n......
  • AES加密 flutter java后台用的 AES/CBC/PKCS5Padding
     可测试AES是否正确的网址https://www.toolhelper.cn/SymmetricEncryption/AES java后台代码如下publicstaticStringencrypt(StringclearText,Stringkey,Stringiv){byte[]result=null;try{byte[]key_bytes=toByte(MD5Util......
  • ImageDraw.Draw(image).text()方法,想要在图像的中间添加 error,字体大小占据图像尺寸一
    要在图像的中间添加文本,并且确保文本大小占据图像尺寸的一半,你可以使用Python的PIL库(Pillow)中的ImageDraw和ImageFont模块来实现。以下是一个示例代码,演示了如何在图像中心添加文本并设置字体大小:fromPILimportImage,ImageDraw,ImageFont#创建一个空白图像width=400h......
  • codeblocks 配置SDL2、SDL2_image,找不到SDL2/SDL.h SDL.h SDL_image.h
    codeblocks配置SDL2、SDL2_image下载https://github.com/libsdl-org/SDL/releases/https://github.com/libsdl-org/SDL_image/releases1.解压将SDL2_image-devel-2.6.3-mingw.zip里面x86_64-w64-mingw32的lib、bin、include对应文件解压到SDL2-devel-2.28.2-mingw.zip\SDL2-......
  • Flutter中如何实现手机键盘右下角完成键搜索
    要实现在手机键盘右下角显示“完成”键作为搜索按钮,可以使用TextInputAction属性来控制键盘的行为。将textInputAction属性设置为TextInputAction.search即可将键盘右下角的按钮改为“完成”按钮,并且点击该按钮时会触发提交(搜索)操作。下面是一个示例代码:import'package:flutter/ma......
  • F1C100s支持从Nand启动了,顺便说下如何向 U-Boot SPL 添加一个Image Loader
    让F1C100s从SPINand启动Tableofcontents名词解释写在前面启动流程实现[内核][文件系统][打包烧录]优化思路更多参考资料名词解释名词解释SPL第二阶段程序加载器BootROM固化在芯片内部的程序,用来识别并加载固件写在前面本次实验平台基于......
  • Golang 绘图技术(image/draw包介绍)
     image/draw包仅仅定义了一个操作:通过可选的蒙版图(maskimage),把一个原始图片绘制到目标图片上,这个操作是出奇的灵活,可以优雅和高效的执行很多常见的图像处理任务。1://DrawcallsDrawMaskwithanilmask.2:funcDraw(dstImage,rimage.Rectangle,srcimage.Image......
  • Kubenrtes k8s Pod镜像拉取策略与pod重启策略,imagePullPolicy restartPolicy
    Pod镜像拉取策略我们在创建pod的时候,他都需要一个镜像,他需要这个镜像的时候我们呢怎么拉取这个镜像,有个策略#下载策略有三个[root@k8s-master1~]#kubectlexplainpod.spec.containers.imagePullPolicyKIND:PodVERSION:v1FIELD:imagePullPolicy<string>#这......