Image Input

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.

Profile Avatar

Image Input

Profile Avatar in list

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) {
    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.