web-dev-qa-db-fra.com

Comment convertir une chaîne BASE64 en image avec Flutter?

Je convertis les images enregistrées dans ma base de données Firebase en Base64 et je voudrais décoder et encoder. J'ai fait des recherches sur des questions similaires, mais je reçois toujours des erreurs. Voici ce que j'ai jusqu'à présent?

var image1 = String;

var pic = event.snapshot.value['image'];
var photo = BASE64.decode(pic);
image1 = photo;

Je reçois l'erreur suivante ...

A value of type "List<int>" cannot be assigned to a variable of type "Type"

Si vous pouviez fournir un processus inverse pour encoder une image en Base64 afin qu'elle puisse être sauvegardée dans Firebase, ce serait apprécié.

*** MISE À JOUR

Voici mon code mis à jour qui génère toujours une erreur.

image1 = event.snapshot.value['image'];
var image = BASE64.decode(image1.toString());
new Image.memory(image),

L'erreur est ...

FormatException: Invalid Length must be a multiple of 4

15
Charles Jr

Vous pouvez convertir un Uint8List vers un widget Flutter Image à l'aide du Image.memory constructeur. (Utilisez le Uint8List.fromList constructeur pour convertir un List en Uint8List si nécessaire.) Vous pouvez utiliser BASE64.encode pour aller dans l'autre sens.

Voici un exemple de code.

screenshot

import 'Dart:async';
import 'Dart:convert';
import 'Dart:typed_data';
import 'package:flutter/material.Dart';
import 'package:http/http.Dart' as http;

void main() {
  runApp(new MyApp());
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return new MaterialApp(
      theme: new ThemeData.dark(),
      home: new MyHomePage(),
    );
  }
}

class MyHomePage extends StatefulWidget {
  @override
  State createState() => new MyHomePageState();
}

class MyHomePageState extends State<MyHomePage> {
  String _base64;

  @override
  void initState() {
    super.initState();
    (() async {
      http.Response response = await http.get(
        'https://flutter.io/images/flutter-mark-square-100.png',
      );
      if (mounted) {
        setState(() {
          _base64 = BASE64.encode(response.bodyBytes);
        });
      }
    })();
  }

  @override
  Widget build(BuildContext context) {
    if (_base64 == null)
      return new Container();
    Uint8List bytes = BASE64.decode(_base64);
    return new Scaffold(
      appBar: new AppBar(title: new Text('Example App')),
      body: new ListTile(
        leading: new Image.memory(bytes),
        title: new Text(_base64),
      ),
    );
  }
}

Cependant, c'est généralement une mauvaise idée de stocker de gros blobs de données binaires dans votre base de données. Cela ne joue pas avec les forces de la base de données en temps réel Firebase et vous finirez par gaspiller la bande passante en transmettant des données dont vous n'avez pas besoin ainsi qu'en encodage et décodage inutiles. Vous devez utiliser le firebase_storage plugin à la place, stockant le chemin ou l'URL de téléchargement de l'image dans la base de données.

12
Collin Jackson

Il existe un moyen plus simple d'utiliser 'Dart:convert' paquet

Image.memory(base64Decode(base64String));

Implémentation et quelques méthodes utiles:

import 'Dart:convert';
import 'Dart:typed_data';
import 'package:flutter/widgets.Dart';


Image imageFromBase64String(String base64String) {
  return Image.memory(base64Decode(base64String));
}

Uint8List dataFromBase64String(String base64String) {
  return base64Decode(base64String);
}

String base64String(Uint8List data) {
  return base64Encode(data);
}
3
Amir.n3t

Pour ouvrir une photo de l'appareil photo (dossier temporaire), modifier un fichier puis le transformer en Base64:

Code:

import 'Dart:convert';
import 'package:image/image.Dart' as ImageProcess;

File file = File(imagePath);
final _imageFile = ImageProcess.decodeImage(
  file.readAsBytesSync(),
);

...edit file...

String base64Image = base64Encode(ImageProcess.encodePng(_imageFile));

Décoder et afficher:

import 'Dart:convert';
import 'package:image/image.Dart' as ImageProcess;

final _byteImage = Base64Decoder().convert(base64Image);
Widget image = Image.memory(_byteImage)
1
Luís De Marchi
Uint8List _bytesImage;

String _imgString = 'iVBORw0KGgoAAAANSUhEUg.....';

_bytesImage = Base64Decoder().convert(_imgString);

Image.memory(_bytesImage)
1
Jeferson Rivera