Open In App
Related Articles

Camera Access in Flutter

Improve Article
Save Article
Like Article

To add images from the camera in flutter, we’ll use the image_picker package. For this, you’ll need to use your real device.

Follow the below steps to display the images from the camera:

Step 1: Create a new flutter application.

flutter create <APP_NAME>

Step 2: Delete the default code from the main.dart file.

Step 3: Add the dependency to your pubspec.yaml file:


Step 4: Use the below code in the main.dart file :



import 'dart:io';
import 'package:flutter/material.dart';
import 'package:image_picker/image_picker.dart';
void main() {
  runApp(new MyApp());
class MyApp extends StatelessWidget {
  Widget build(BuildContext context) {
    return new MaterialApp(
      home: new CameraAccess(),
      debugShowCheckedModeBanner: false,
class CameraAccess extends StatefulWidget {
  State<StatefulWidget> createState() {
    return new CameraAccessState();
class CameraAccessState extends State<CameraAccess> {
  File cameraFile;
  Widget build(BuildContext context) {
    //display image selected from gallery
    selectFromCamera() async {
      cameraFile=await ImagePicker.pickImage(
        // maxHeight: 50.0,
        // maxWidth: 50.0,
      setState(() {});
    return new Scaffold(
      appBar: new AppBar(
        title: new Text("Camera Access"),
        actions: <Widget>[
          Text("GFG",textScaleFactor: 3,)
      body: new Builder(
        builder: (BuildContext context) {
          return Center(
            child: new Column(
              children: <Widget>[
                new RaisedButton(
                  child: new Text('Select Image from Camera'),
                  onPressed: selectFromCamera
                  height: 200.0,
                  width: 300.0,
                  child: cameraFile == null
                      ? Center(child: new Text('Sorry nothing selected!!'))
                      : Center(child: new Image.file(cameraFile)),


When no image is selected, it will result:

camera access button

When the button is tapped, the mobile’s camera will be opened to capture the image as shown below:

When the image is captured, it will be displayed on the screen as shown below:


  • Import image_picker package.
  • Create async selectFromCamera() function and await for camera image.
  • After loading the image from the camera, the image will be displayed on the screen.

Last Updated : 30 Aug, 2020
Like Article
Save Article
Similar Reads