Create a image File from a Image widget - flutter

I'm developing an application where the user of my App must upload images to Firebase Storage, and for that, they need to be in File format.
Part of the images come from the web, that is, they were obtained through the Image.network() method. Another part comes from the cell phone gallery, and was obtained by the ImagePicker package.
Even coming from different sources, all images are being grouped in a List<Image>. Now, I need to upload this list of images to Storage, but for that I need to convert them to File and I don't know how to do that, could anyone help?

First you should save image from network url to file, it is better like this
import 'dart:io';
import 'package:http/http.dart' as http;
import 'package:path/path.dart';
import 'package:path_provider/path_provider.dart';
Future<File> _fileFromImageUrl() async {
final response = await http.get('https://example.com/abc.jpg');
final documentDirectory = await getApplicationDocumentsDirectory();
final file = File(join(documentDirectory.path, 'imagetest.png'));
file.writeAsBytesSync(response.bodyBytes);
return file;
}
After that add this to you image list with the image taken from image picker.
https://pub.dev/packages/image_picker
import 'package:image_picker/image_picker.dart';
final ImagePicker _picker = ImagePicker();
final XFile? image = await _picker.pickImage(source:ImageSource.gallery);

You can download the image and save the file in the followwing way.
import 'dart:io';
import 'package:http/http.dart' as http;
import 'package:path/path.dart';
import 'package:path_provider/path_provider.dart';
Future<File> _fileFromImageUrl() async {
final response = await http.get('https://example.com/xyz.jpg');
final documentDirectory = await getApplicationDocumentsDirectory();
final file = File(join(documentDirectory.path, 'imagetest.png'));
file.writeAsBytesSync(response.bodyBytes);
return file;
}

Related

how to get XFile populated with images from flutter project assets?

how to get XFile populated with images from flutter project assets?
how to get XFile populated with images from flutter project assets?
You can use rootBundle from the services.dart package. Import the package like this:
import 'package:flutter/services.dart' show rootBundle;
And call the following function to get the image from asset and populate XFile:
Future<XFile> getImageFileFromAssets() async {
final byteData = await rootBundle.load('./assets/image.png');
final file = File('${(await getTemporaryDirectory()).path}/image.png');
await file.writeAsBytes(byteData.buffer
.asUint8List(byteData.offsetInBytes, byteData.lengthInBytes));
XFile xFile = XFile(file.path);
return xFile;
}

How to add local image to flutter_local_notifications

I am trying to create push notifications and would like to add an image to the notification. I am able to add images from the web as shown in the screenshot below.
How can I add a local image instead? I tried adding the file path as shown below, but it did not work:
The file path you are adding is a root path of your project but this method needs an android file path(e.g. /storage/emulated/0/Android/data/com.expampe.app/cache/bg.png), so you have to convert your asset image to a File and save it, then return its path:
import 'dart:async';
import 'dart:io';
import 'package:flutter/services.dart' show rootBundle;
import 'package:path_provider/path_provider.dart';
Future<String> getImageFilePathFromAssets(String asset) async {
final byteData = await rootBundle.load(asset);
final file =
File('${(await getTemporaryDirectory()).path}/${asset.split('/').last}');
await file.writeAsBytes(byteData.buffer
.asUint8List(byteData.offsetInBytes, byteData.lengthInBytes));
return file.path;
}
then just
final attachmentPicturePath = await getImageFilePathFromAssets('assets/image2.jpg');
The Easiest Way is--
static Future<String> getImageFilePathFromAssets(
String asset, String filename) async {
final byteData = await rootBundle.load(asset);
final temp_direactory = await getTemporaryDirectory();
final file = File('${temp_direactory.path}/$filename');
await file.writeAsBytes(byteData.buffer.asUint8List(byteData.offsetInBytes,
byteData.lengthInBytes));
return file.path;
}
final bigpicture = await Utils.getImageFilePathFromAssets(
'assets/images/largicon.png', 'bigpicture');
And For donwload Using URL---
add http and path_provider in pubspec.yml
static Future<String> downloadFile(String URL, String filename) async
{
final direactory = await getApplicationSupportDirectory();
final filepath = '${direactory.path}/$filename';
final response = await http.get(Uri.parse(URL));
print(response);
final file = File(filepath);
await file.writeAsBytes(response.bodyBytes);
return filepath;
}
check this demo github

I get a weird error when trying to initialize Hive

Error: Unhandled Exception: HiveError: You need to initialize Hive or provide a path to store the box.
Essentially I have these in my dependencies so everything should be good.
hive: ^1.4.4+1
hive_flutter: ^0.3.1
path_provider: ^1.6.27
I also have import 'package:hive/hive.dart';
and
import 'package:path_provider/path_provider.dart'; in the file
So I just have
void doSomething() async {
final documentDirectory = await getApplicationDocumentsDirectory();
Hive.init(documentDirectory.path);
}
called.
I do not understand. I think I've done everything correct. Let me know if you need something else.
Hive needs to be initialized when it runs on Android or iOS, therefore you can use a function like this:
Future<Box> openHiveBox(String boxName) async {
if (!kIsWeb && !Hive.isBoxOpen(boxName))
Hive.init((await getApplicationDocumentsDirectory()).path);
return await Hive.openBox(boxName);
}
You'll need to import path_provider in order to access getApplicationDocumentsDirectory()
Try the following code on the main function of your flutter application:
import 'package:path_provider/path_provider.dart';
import 'package:hive/hive.dart';
void main() async {
WidgetsFlutterBinding.ensureInitialized();
final appDocumentDirectory = await getApplicationDocumentsDirectory();
Hive.init(appDocumentDirectory.path);
}
Currently, path_provider doesn't support WEB. You can see it here: path_provider.
You have to use another directory for WEB. If you are using BLOC as a state management, you could do something like this:
if (!kIsWeb) {
// if android or tablet
HydratedBloc.storage = await HydratedStorage.build(
storageDirectory: await getApplicationDocumentsDirectory(),
);
} else {
// if web
HydratedBloc.storage = await HydratedStorage.build(
storageDirectory: HydratedStorage.webStorageDirectory,
);
}
I got this error because of a typo:
await Hive.initFlutter;
should've been
await Hive.initFlutter();
I guess you are getting this issue because you are not awaiting the initFlutter.
import 'package:get/get.dart';
import 'package:hive_flutter/hive_flutter.dart';
import 'package:path_provider/path_provider.dart' as path_provider;
Future<void> yourFunction() async {
final dbDir = await path_provider.getApplicationDocumentsDirectory();
// init hive
await Hive.initFlutter(dbDir.path);
await openYourBox();
}
I think you should await your init method.
Actually you don't need use HydratedStorage to initialize Hive on web:
import 'package:hive/src/hive_impl.dart';
import 'package:flutter/foundation.dart';
import 'package:path_provider/path_provider.dart';
initializeHive()async{
//Use HiveImpl() to ensure you don't have conflicting Hive boxes.
HiveInterface _hive = HiveImpl();
if (kIsWeb) {
await _hive.openBox('yourBoxName');
} else {
var dir = await getApplicationDocumentsDirectory();
_hive.init(dir.path);
await _hive.openBox('yourBoxName');
}
}
If you're using Flutter on web, you don't need to initialize Hive and neither provider a path to box, only if you're using it on mobile.

Flutter - Network Image to File

I have an Image URL like "https://example.com/xyz.jpg". Now I want to put the image in a File type variable;
Something along these lines:
File f = File("https://example.com/xyz.jpg");
The whole point is to get the image from the given URL and save it as a File variable. How can I do so?
I searched for many solutions on the internet but there was no straightforward way to do so.
PS: I could have missed something where the question was similarly answered so please let me know the link where I can find it.
Edit: I am using the File type variable to pass it in the share function.
This is the library that I am using.
Here is my current on share button click code
if (file != null) {
ShareExtend.share(file.path, "image",
sharePanelTitle: "share image title",
subject: "share image subject");
}
Thanks for your help.
You need to download image and create an empty file then fill the file with image data:
import 'dart:io';
import 'package:http/http.dart' as http;
import 'package:path/path.dart';
import 'package:path_provider/path_provider.dart';
Future<File> _fileFromImageUrl() async {
final response = await http.get(Uri.parse('https://example.com/xyz.jpg)');
final documentDirectory = await getApplicationDocumentsDirectory();
final file = File(join(documentDirectory.path, 'imagetest.png'));
file.writeAsBytesSync(response.bodyBytes);
return file;
}
import 'dart:io';
import 'package:dio/dio.dart';
import 'package:path/path.dart';
import 'package:path_provider/path_provider.dart';
Future<File> getImage({required String url}) async {
/// Get Image from server
final Response res = await Dio().get<List<int>>(
url,
options: Options(
responseType: ResponseType.bytes,
),
);
/// Get App local storage
final Directory appDir = await getApplicationDocumentsDirectory();
/// Generate Image Name
final String imageName = url.split('/').last;
/// Create Empty File in app dir & fill with new image
final File file = File(join(appDir.path, imageName));
file.writeAsBytesSync(res.data as List<int>);
return file;
}
Future<File> fileFromImageUrl() async {
String img='https://pps.whatsapp.net/v/t61.24694-24/160266256_1115367465775510_3546030680878251116_n.jpg?ccb=11-4&oh=01_AdSsrMGOPfs8CUJsEkYImMUu5L4DAzt2ym8eBrdsMG5O0Q&oe=63D7B45E';
final response = await http.get(Uri.parse(img));
final documentDirectory = await getApplicationDocumentsDirectory();
final file =
File(p.join(documentDirectory.path, 'File Name.jpg'));
file.writeAsBytesSync(response.bodyBytes);
return file;
}

Is there any way to write to a pre-existing text file in flutter?

I have a txt file that I need to write to. I know that I can't write to this using File IO, so is there any way to write to this file?
If you want to open the file in append mode you have to pass the file mode in your writeAsString() function else it will over write the file.
import 'dart:async';
import 'dart:io';
import 'package:flutter/foundation.dart';
import 'package:path_provider/path_provider.dart';
Future<File> writeCounter(int counter) async {
final file = await File('your_path.txt');
// Write the file
return file.writeAsString('$counter',mode: FileMode.append);
}
}
Future<File> writeCounter(int counter) async {
final file = await File('your_path.txt');
// Write the file
return file.writeAsString('$counter');
}
and import the following packages
import 'dart:async';
import 'dart:io';
import 'package:flutter/foundation.dart';
import 'package:path_provider/path_provider.dart';