image_painter
A flutter implementation of painting over image.
Overview
[Note] Tested and working only on flutter stable channel. Please make sure you are on stable channel of flutter before using the package.
In the pubspec.yaml
of your flutter project, add the following dependency:
dependencies:
...
image_painter: latest
In your library add the following import:
import 'package:image_painter/image_painter.dart';
For help getting started with Flutter, view the online documentation.
Basic usage of the libary:
ImagePainter.network
: Painting over image from network url.final _imageKey = GlobalKey<ImagePainterState>();
//Provide controller to the painter.
ImagePainter.network("https://sample_image.png",
key: _imageKey,scalable: true),
///Export the image:
Uint8List byteArray = await _imageKey.currentState.exportImage();
//Now you use `Uint8List` data and convert it to file.
File imgFile = new File('directoryPath/fileName.png');
imgFile.writeAsBytesSync(image);
For more thorough implementation guide, check the example.
Run this command:
With Flutter:
$ flutter pub add image_painter_hap
This will add a line like this to your package's pubspec.yaml (and run an implicit flutter pub get
):
dependencies:
image_painter_hap: ^0.6.2
Alternatively, your editor might support flutter pub get
. Check the docs for your editor to learn more.
Now in your Dart code, you can use:
import 'package:image_painter_hap/image_painter.dart';
import 'dart:io';
import 'package:flutter/material.dart';
import 'package:image_painter/image_painter.dart';
import 'package:open_file/open_file.dart';
import 'package:path_provider/path_provider.dart';
void main() => runApp(ExampleApp());
class ExampleApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return MaterialApp(
title: 'Image Painter Example',
theme: ThemeData(
primarySwatch: Colors.blue,
visualDensity: VisualDensity.adaptivePlatformDensity,
),
home: ImagePainterExample(),
);
}
}
class ImagePainterExample extends StatefulWidget {
@override
_ImagePainterExampleState createState() => _ImagePainterExampleState();
}
class _ImagePainterExampleState extends State<ImagePainterExample> {
final _imageKey = GlobalKey<ImagePainterState>();
void saveImage() async {
final image = await _imageKey.currentState?.exportImage();
final directory = (await getApplicationDocumentsDirectory()).path;
await Directory('$directory/sample').create(recursive: true);
final fullPath =
'$directory/sample/${DateTime.now().millisecondsSinceEpoch}.png';
final imgFile = File('$fullPath');
if (image != null) {
imgFile.writeAsBytesSync(image);
ScaffoldMessenger.of(context).showSnackBar(
SnackBar(
backgroundColor: Colors.grey[700],
padding: const EdgeInsets.only(left: 10),
content: Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
const Text("Image Exported successfully.",
style: TextStyle(color: Colors.white)),
TextButton(
onPressed: () => OpenFile.open("$fullPath"),
child: Text(
"Open",
style: TextStyle(
color: Colors.blue[200],
),
),
)
],
),
),
);
}
}
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: const Text("Image Painter Example"),
actions: [
IconButton(
icon: const Icon(Icons.save_alt),
onPressed: saveImage,
)
],
),
body: ImagePainter.asset(
"assets/sample.jpg",
key: _imageKey,
scalable: true,
initialStrokeWidth: 2,
textDelegate: TextDelegate(),
initialColor: Colors.green,
initialPaintMode: PaintMode.line,
),
);
}
}
Download details:
Author: