image_input 0.0.3 image_input: ^0.0.3 copied to clipboard
A pacakage to be used for image input in flutter. It can be used to take image from camera or gallery or from a url.
Image Input
A flutter package which.
Getting Started #
Import image_input package #
import 'package:image_input/image_input.dart';
Profile Avatar #
ProfileAvatar(
image: profileAvatarCurrentImage,
radius: 100,
allowEdit: allowEdit,
addImageIcon: Container(
decoration: BoxDecoration(
color: Theme.of(context).colorScheme.primaryContainer,
borderRadius: BorderRadius.circular(100),
),
child: const Padding(
padding: EdgeInsets.all(8.0),
child: Icon(Icons.add_a_photo),
),
),
removeImageIcon: Container(
decoration: BoxDecoration(
color: Theme.of(context).colorScheme.primaryContainer,
borderRadius: BorderRadius.circular(100),
),
child: const Padding(
padding: EdgeInsets.all(8.0),
child: Icon(Icons.close),
),
),
onImageChanged: (XFile? image) {
setState(() {
profileAvatarCurrentImage = image;
});
},
onImageRemoved: () {
setState(() {
profileAvatarCurrentImage = null;
});
},
getImageSource: () {
return showDialog<ImageSource>(
context: context,
builder: (context) {
return SimpleDialog(
children: [
SimpleDialogOption(
child: const Text("Camera"),
onPressed: () {
Navigator.of(context).pop(ImageSource.camera);
},
),
SimpleDialogOption(
child: const Text("Gallery"),
onPressed: () {
Navigator.of(context).pop(ImageSource.gallery);
}),
],
);
},
).then((value) {
return value ?? ImageSource.gallery;
});
},
getPreferredCameraDevice: () {
return showDialog<CameraDevice>(
context: context,
builder: (context) {
return SimpleDialog(
children: [
SimpleDialogOption(
child: const Text("Rear"),
onPressed: () {
Navigator.of(context).pop(CameraDevice.rear);
},
),
SimpleDialogOption(
child: const Text("Front"),
onPressed: () {
Navigator.of(context).pop(CameraDevice.front);
}),
],
);
},
).then(
(value) {
return value ?? CameraDevice.rear;
},
);
},
),
Usage of Profile Avatar #
- Use in listview to show profile images.
- use in creating a new user to take profile image input from user.
ImageInput #
ImageInput(
images: imageInputImages,
allowEdit: allowEditImageInput,
allowMaxImage: 5,
onImageSelected: (image, index) {
setState(() {
imageInputImages.add(image);
});
},
onImageRemoved: (image, index) {
setState(() {
imageInputImages.remove(image);
});
},
),
Usage of Image Input #
- Use to show/preview multiple images from a path
- Use to take input of multiple images from user
Issues #
Please file issues, bugs, or feature requests in issue tracker.