How to Convert Asset Image to File In Flutter ??

· 3 min read
How to Convert Asset Image to File In Flutter
How to Convert Asset Image to File In Flutter

You can access the byte data via rootBundle. Then, you can save it to the device’s temporary directory which is obtained by path_provider. So, in this article, we will go through how to convert Asset Image to File In Flutter.

How to Convert Asset Image to File In Flutter ??

import 'dart:async';
import 'dart:io';

import 'package:flutter/services.dart' show rootBundle;
import 'package:path_provider/path_provider.dart';

Future<File> getImageFileFromAssets(String path) async {
  final byteData = await rootBundle.load('assets/$path');

  final file = File('${(await getTemporaryDirectory()).path}/$path');
  await file.writeAsBytes(byteData.buffer.asUint8List(byteData.offsetInBytes, byteData.lengthInBytes));

  return file;
}

In your example, you would call this function like this:

File f = await getImageFileFromAssets('images/myImage.jpg');

For more information on writing the byte data,  check out this answer

You will need to await the Future and in order to do that, make the function async:

RaisedButton(
   onPressed: () async => showDialog(
     context: context,
     builder: (_) => Container(child: Image.file(await getImageFileFromAssets('images/myImage.jpg')))),
   child: Text('Show Image'));

Make use of the flutter_absolute_path package in pubsec.yaml

To convert file path from this format :

“content://media/external/images/media/5275”

To

"/storage/emulated/0/DCIM/Camera/IMG_00124.jpg”
List <File> fileImageArray = [];
assetArray.forEach((imageAsset) async {
final filePath = await FlutterAbsolutePath.getAbsolutePath(imageAsset.identifier);

File tempFile = File(filePath);
if (tempFile.existsSync()) {
    fileImageArray.add(tempFile);
}

Get a file from the asset without providing a path. So import package like a below:

Future<File> getImageFileFromAssets(Asset asset) async {
    final byteData = await asset.getByteData();

    final tempFile =
        File("${(await getTemporaryDirectory()).path}/${asset.name}");
    final file = await tempFile.writeAsBytes(
      byteData.buffer
          .asUint8List(byteData.offsetInBytes, byteData.lengthInBytes),
    );

    return file;
  }

Conclusion:

Thank you for being with us on this Flutter Journey!!! we hope you got what you were looking for!!

So in this article, we have been through how to convert asset images to file in flutter. Stay Connected for more amazing articles regarding Flutter Development and Dart!!

Keep Learning !!! Keep Fluttering !!!

Share the article with your friends and colleagues and help them grow their knowledge as well 🙂

Let us know in the comments below if you have doubts regarding Flutter Development, We’d love to help you 🙂

FlutterAgency.com is our portal Platform dedicated to Flutter Technology and Flutter Developers. The portal is full of cool resources from Flutter like Flutter Widget GuideFlutter ProjectsCode libs and etc.

FlutterAgency.com is one of the most popular online portals dedicated to Flutter Technology and daily thousands of unique visitors come to this portal to enhance their knowledge of Flutter.

Leave a Reply