Flutter - Drawstring on captured photo from camera - flutter

I am using this https://github.com/brendan-duncan/image/wiki to try and draw text on my image my question is how do I get the image needed for the first parameter in Image.drawString() when the image I am trying to pass is the one that is captured by the camera plugin?
final path = join(
// Store the picture in the temp directory.
// Find the temp directory using the `path_provider` plugin.
(await getTemporaryDirectory()).path,
'${DateTime.now()}.png',
);
// Attempt to take a picture and log where it's been saved.
await _controller.takePicture(path);
//this doesnt work
img.Image image = Image.file(File(path))
img.drawString(image, img.arial_24, 50, 50, "Hello World");
I am getting this error:
'Image (where Image is defined in
myflutterpath/packages/flutter/lib/src/widgets/image.dart)' can't be
assigned to a variable of type 'Image (where Image is defined in
/myflutterpath/flutter/.pub-cache/hosted/pub.dartlang.org/image-2.1.4/lib/src/image.dart)'

You're assigning an Image widget from Flutter to a img.Image variable from the image package. These are completely separate data types.
To do what you want, you need to create an img.Image object. Since your image source is a PNG file(guessing based on file extension), you'll need to decode it to raw pixel data. This can be done with the PngDecoder that's already included in the image package that you have.
img.Image image = img.PngDecoder().decodeImage(await File(path).readAsBytes());
This creates an img.Image from your PNG file instead of an Image widget.

Related

Flutter - How to convert Image to List<Int>?

I want to make the following code work and I do not understand image conversion properly. Would really like someone to point me the right direction to learn this please along with providing a solution to my following problem.
I display the image as a container background image using:
MemoryImage(base64Decode(image)) // My image is in base64 String format here
The above works fine.
Now I have an image path: example-
'/data/user/0/....../cache/scaled_image_picker2751194612758734223.jpg'
How do I go from getting image from this path to base64Encode(image)?
I tried the following up to now and have run out of ideas here:
final Image? image = await Image.file(File(_imagePath));
if (image != null){
setState(() => imageDisplayInContainer = base64Encode(image)); <----Doesn't work
}
Get the file object:
File imageFile = File(_imagePath);
Get the bytes:
List<int> imageBytes = imageFile.readAsBytesSync();
Give the bytes the MemoryImage
MemoryImage(imageBytes);

How can one convert an XFile image from any format to a JPG image for upload?

Right now I'm able to chose an image as XFile using MultiImage picker as follows:
final List<XFile>? images = await _picker.pickMultiImage(maxWidth: _maxWidth, maxHeight:_maxHeight);
which then gives me a list of images which I am able to send into my upload service for uploading to my server
for (var image in images)
{
await myUploadService(image); //image is an XFile
}
Now what I need to do is convert the images, no matter what format they are in, into a JPG image before the upload
So I have tried to convert the images, using the image Flutter package (https://github.com/brendan-duncan/image) as follows:
import 'package:image/image.dart' as ImageConvert;
for (var image in images)
{
//Convert all images to JPG
final newImage = ImageConvert.decodeImage(File(image.path).readAsBytesSync())!;
var newImg = ImageConvert.encodeJpg(newImage);
var newImg2 = Image.memory(Uint8List.fromList(newImg)) as XFile; // <--- the main problem
await myUploadService(newImg2);
}
But this isn't working, mainly at the point where I try to put the image back into an XFile format for upload with my upload service
So the main question is here is how can I convert the newly encoded JPG image back to XFile format?
Open to totally different strategies of dealing with this issue as well

flutter image picker reduce file size with provider and flutter_image_compress

I am using image picker to pick image from device(App) and after that stored that file in provider class like that.
File? _img;
get img=> _img;
void putbannerimg(File img) {
_img = img;
notifyListeners();
}
I found out that image picker does not compress png images, I tried compressing it with flutter_image_compress
compressFile() async {
final formservice = Provider.of<PostForm>(context, listen: false);
File file = formservice.bannerfile;
final result = await FlutterImageCompress.compressWithFile(
file.absolute.path,
quality: 54,
);
formservice.putbannerimg(File.fromRawPath(result!));
}
I tried this way And other multiple ways but getting different different errors I want to upload this file in firebase storage like this
var task = storageicon.putFile(formservice.iconfile);
please tell me where I am going wrong, without compress file all things are working fine
Edit: I found out that path should be a string how can I parse local code file in that
If you are using the "flutter_image_compress" package
You may have to use the compress function for files stored on the phone like this:
Future<File> testCompressAndGetFile(File file, String targetPath) async {
var result = await FlutterImageCompress.compressAndGetFile(
file.absolute.path, targetPath,
quality: 88,
rotate: 180,
);
print(file.lengthSync());
print(result.lengthSync());
return result;
}
"compressAndGetFile()" returns a file while "compressWithFile()" returns a Uint8List.
If i understand your last question right, you want to use an image built into your application by default.
For this, you have to open your "pubsepc.yaml", go to the "flutter:" mark and add "assets:" like so:
flutter:
assets:
- path
"path", in my example, describes a top level folder containing assets like pictures.
You can freely describe its name.

Getting FirebaseVisionImage from manipulated image in Flutter

I'm trying to do some pre-processing in my image before using Firebase MLkit. Previously, I was simply loading my image and then passing it directly like this.
File file = await FilePicker.getFile(type: FileType.IMAGE);
final FirebaseVisionImage visionImage = FirebaseVisionImage.fromFile(file);
VisionText visionText = await textRecognizer.processImage(visionImage);
But now, I wanted to do some processing on the image. I did this using Flutter's Image package like this.
import 'package:image/image.dart' as Img;
File file = await FilePicker.getFile(type: FileType.IMAGE);
Img.Image image = Img.decodeImage(file.readAsBytesSync());
var img = Img.invert(image);
Now, how do I pass this new object to FirebaseVisionImage. I see that there is this function:
FirebaseVisionImage.fromBytes(bytes, metadata)
I'm guessing I can get bytes from the above image object using img.getBytes() but I'm confused how to set the metadata.
EDIT:
I see that one can write the image to a temporary file doing
img.writeAsBytesSync(decoded.ToList());
and then use that image again using FirebaseVisionImage.fromFile() but I would really prefer not to do that.

Capture a photo, save temporarily, and open as bitmap

I'm new to Flutter.
What I need:
Open a photo from android temp folder and convert to bitmap.
What am I doing:
Following this tutorial: https://flutter.dev/docs/cookbook/plugins/picture-using-camera
I'm invoking the "takePicture" method in "CameraController" which
saves the photo in a temporary file;
I open the file and try to convert to bitmap:
Code:
final Image photo = Image.file(File(imagePath));
final AssetImage image = photo.image;
final Bitmap bitmap = Bitmap.fromAssetImage(image);
What happens:
local> /data/data/io.flutter.plugins.firebasemlvisionexample/cache/2019-08-19 14:14:58.720970.png.
I/flutter ( 7943): type 'FileImage' is not a subtype of type 'AssetImage'
If you use "Bitmap.fromImage(photo)", VScode displays:
The argument type 'Image (where Image is defined in.
/Users/luis/development/flutter/packages/flutter/lib/src/widgets/image.dart)'
can't be assigned to the parameter type 'Image (where Image is defined
in
/Users/luis/development/flutter/bin/cache/pkg/sky_engine/lib/ui/painting.dart)'.
Do this:
Image.asset('images/cat.png')
Images.asset