Select Image Galary Or Camera in Flutter

Select Image Galary Or Camera in Flutter :

Select Image Galary Or Camera in Flutter : the content overview for this flutter tutorial.

Content Overview

  • How to Select image from gallery or camera in flutter?
  • Select image from gallery?
  • Select image from camera?
  • How to get select gallery or camera path in flutter?
  • When your application select image,set the widgets image that used to plugin. This program get the current path in selected image from gallery.
  • How to Select image from gallery or camera in flutter
    Select image gallery: ImagePicker.pickImage(source: ImageSource.gallery);
    Select image camera: ImagePicker.pickImage(source: ImageSource.gallery);

pubspec.yaml

name: flutter_app
description: A new Flutter application.

version: 1.0.0+1

environment:
sdk: “>=2.1.0 <3.0.0”

dependencies:
flutter:
sdk: flutter

cupertino_icons: ^0.1.2
image_picker:

dev_dependencies:
flutter_test:
sdk: flutter

flutter:
uses-material-design: true

main.dart

import 'package:flutter/material.dart';
import 'profile_page.dart';
void main() => runApp(MaterialApp(home: MyApp()));
class MyApp extends StatelessWidget {
   Widget build(BuildContext context) {
     return Scaffold(
       backgroundColor: Colors.blue,
       body: SafeArea(
         child: Center(
           child: ProfilePage(),
         ),
       ),
     );
   }
 }

Screenshot 1 :

Select Image Galary Or Camera in Flutter

Screenshot 2 :

Select Image Galary Or Camera in Flutter

profile_page.dart

 import 'package:flutter/material.dart';
 import 'package:flutter/cupertino.dart';
 import 'dart:io';
 import 'package:image_picker/image_picker.dart';

class ProfilePage extends StatefulWidget {
   @override
   _ProfilePageState createState() => _ProfilePageState();
 }
class _ProfilePageState extends State
   with SingleTickerProviderStateMixin {
   final FocusNode myFocusNode = FocusNode();
   File _image;
   String profilePath;

@override
     void initState() {
     super.initState();
     downloadImage();  }

Future getImage() async {
     File image = await ImagePicker.pickImage(source: ImageSource.gallery);
     setState(() {
       _image = image;
       print('Select image path' + _image.path.toString());
     });
}
Future downloadImage() async {
     if (profilePath != null) {
       var image = new File(profilePath);
       setState(() {
      _image = image;
  });
}
}

@override
   Widget build(BuildContext context) {
     return new Scaffold(
         body: ListView(
           children: [
             Stack(
               children: [
                 Container(
                   height: 280.0,
                   width: double.infinity,
                 ),
                 Container(
                   height: 200.0,
                   width: double.infinity,
                   color: Colors.orangeAccent,
                 ),
                 Align(
                   alignment: Alignment.topLeft,
                   child: IconButton(
                     icon: Icon(Icons.arrow_back_ios),
                     onPressed: () {
                       Navigator.pop(context);
                     },
                     color: Colors.white,
                   ),
                 ),
                 Positioned(
                   top: 125.0,
                   left: 15.0,
                   right: 15.0,
                   child: Material(
                     elevation: 3.0,
                     shape: RoundedRectangleBorder(
                       borderRadius: BorderRadius.vertical(bottom: Radius.circular(20.0)),
                     ),
                     child: Container(
                       height: 150.0,
                     /*  decoration: BoxDecoration(
                           borderRadius: BorderRadius.circular(7.0),
                           color: Colors.white),*/
                     ),
                   ),
                 ),
                 Positioned(
                   top: 40.0,
                   left: (MediaQuery
                       .of(context)
                       .size
                       .width / 2 - 70.0),
                   child: Container(
                     child: new Column(
                       children: [
                         Padding(
                           padding: EdgeInsets.only(top: 0.0),
                           child: new Stack(
                               fit: StackFit.loose, children: [
                             new Row(
                               crossAxisAlignment: CrossAxisAlignment.center,
                               mainAxisAlignment: MainAxisAlignment.center,
                               children: [
                                 new Center(
                                   child: _image == null
                                       ? new Icon(Icons.camera_alt, color: Colors.grey, size: 140,)
                                       : new CircleAvatar(
                                     backgroundImage: new FileImage(_image),
                                     radius: 65.0,
                                   ),
                                 ),
                               ],
                             ),
                             Padding(
                                 padding: EdgeInsets.only(top: 90.0, left: 90.0),
                                 child: new Row(
                                   mainAxisAlignment: MainAxisAlignment.center,
                                   children: [
                                     new FloatingActionButton(
                                       foregroundColor: Colors.grey,
                                       backgroundColor: Colors.white,
                                       onPressed: getImage,
                                       tooltip: 'Pick Image',
                                       child: Icon(Icons.add_a_photo),
                                     ),
                                   ],
                                 )),
                           ]),
                         )
                       ],
                     ),
                   ),
                 ),
                 Positioned(
                   top: 200.0,
                   left: 15.0,
                   right: 15.0,
                   child: Column(
                     mainAxisAlignment: MainAxisAlignment.center,
                     children: [
                       Text(
                         'Lakhani Kamlesh',
                         style: TextStyle(
                             color: Colors.orange,
                             fontWeight: FontWeight.bold,
                             fontSize: 18.0),
                       ),
                       SizedBox(height: 12.0),
                       Row(
                           mainAxisAlignment: MainAxisAlignment.center,
                           children: [
                             Icon(Icons.description,
                                 color: Colors.grey, size: 20),
                             Text('Flutter developer lakhani kamlesh',
                               style: TextStyle(
                                   fontSize: 15.0,
                                   color: Colors.grey),
                             )
                           ])
                     ],
                   ),
                 ),
               ],
             ),
             //TODO HERE CONTEXT ADD
           ],
         ));
   }
    @override
      void dispose() {
      super.dispose();
   }
 }

The flutter tutorial  is a website that bring you the latest and amazing resources of code. All the languages codes are included in this website. The languages like flutter, android, java,kotlin etc.with the help of this languages any user can develop the beautiful application

For more information about Flutter. visit www.fluttertutorial.in