Last active
June 26, 2021 08:57
-
-
Save nelson1995/52d2bab8d4b8419b6a356c5fb51bf9ca to your computer and use it in GitHub Desktop.
A simple flutter camera that capture photos and display them. Thanks to https://flutter.dev/docs/ docs
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
import 'dart:async'; | |
import 'dart:io'; | |
import 'package:camera/camera.dart'; | |
import 'package:flutter/material.dart'; | |
void main() async { | |
// Making sure that the plugin services are initialized so that `availableCameras()` | |
// can be called before `runApp()` | |
WidgetsFlutterBinding.ensureInitialized(); | |
// Now lets get all the available cameras | |
final cameras = await availableCameras(); | |
// finally let's use the back camera. | |
final firstCamera = cameras.first; | |
runApp(CameraApp(camera:firstCamera)); | |
} | |
// A screen that allows users to take a picture using a given camera. | |
class CameraApp extends StatefulWidget { | |
final CameraDescription camera; | |
const CameraApp({ Key key,@required this.camera }) : super(key: key); | |
@override | |
TakePictureScreenState createState() => TakePictureScreenState(); | |
} | |
class TakePictureScreenState extends State<CameraApp> { | |
CameraController _controller; | |
Future<void> _initializeControllerFuture; | |
@override | |
void initState() { | |
super.initState(); | |
// To display the current output from the Camera, | |
// create a CameraController. | |
_controller = CameraController( | |
// Get a specific camera from the list of available cameras i.e back,front | |
widget.camera, | |
// Define the resolution to use. | |
ResolutionPreset.medium, | |
); | |
// Next, initialize the controller. This returns a Future. | |
_initializeControllerFuture = _controller.initialize(); | |
} | |
@override | |
void dispose() { | |
// Dispose of the controller when the widget is disposed. | |
_controller.dispose(); | |
super.dispose(); | |
} | |
@override | |
Widget build(BuildContext context) { | |
return Scaffold( | |
// You must wait until the controller is initialized before displaying the | |
// camera preview. Use a FutureBuilder to display a loading spinner until the | |
// controller has finished initializing. | |
body: FutureBuilder<void>( | |
future: _initializeControllerFuture, | |
builder: (context, snapshot) { | |
if (snapshot.connectionState == ConnectionState.done) { | |
// If the Future is complete, display the preview. | |
return CameraPreview(_controller); | |
} else { | |
// Otherwise, display a loading indicator. | |
return const Center(child: CircularProgressIndicator()); | |
} | |
}, | |
), | |
bottomNavigationBar: bottomNavigationBar(), | |
); | |
} | |
// We put all the camera controls here | |
// like the capture button. You can add your custom one | |
// like flash or toggle camera mode and code its functionality | |
Widget bottomNavigationBar(){ | |
return Container( | |
color: Colors.black, | |
height: 140, | |
width: MediaQuery.of(context).size.width, | |
child: Row( | |
mainAxisAlignment: MainAxisAlignment.spaceAround, | |
children: <Widget>[ | |
SizedBox(width: 45,), | |
Container( | |
child: Align( | |
alignment: Alignment.center, | |
child:Material( | |
color: Colors.black, | |
child : InkResponse( | |
child: Container( | |
width: 80, | |
height: 80, | |
decoration: BoxDecoration( | |
borderRadius: BorderRadius.all(Radius.circular(60)), | |
border: Border.all( | |
width: 3, | |
color: Colors.white, | |
style: BorderStyle.solid, | |
), | |
), | |
), | |
highlightColor: Colors.blueAccent, | |
onTap: (){ captureImage(); }, | |
) | |
), | |
) | |
), | |
SizedBox(width: 45,) | |
], | |
), | |
); | |
} | |
void captureImage() async { | |
// Take the Picture in a try / catch block. If anything goes wrong, | |
// catch the error. | |
try { | |
// Ensure that the camera is initialized. | |
await _initializeControllerFuture; | |
// Attempt to take a picture and get the file `image` | |
// where it was saved. | |
final image = await _controller.takePicture(); | |
// If the picture was taken, display it on a new screen. | |
await Navigator.of(context).push( | |
MaterialPageRoute( builder: (context) => DisplayImage( imagePath: image.path)); | |
} catch (e) { | |
// If an error occurs, log the error to the console. | |
print(e); | |
} | |
} | |
} | |
class DisplayImage extends StatelessWidget { | |
final String imagePath; | |
const DisplayImage({Key key, @required this.imagePath}) : super(key: key); | |
String fileName = this.imagePath.split('/').last; | |
@override | |
Widget build(BuildContext context) { | |
return Scaffold( | |
appBar: AppBar(title: const Text(fileName)), | |
body: Image.file(File(imagePath)), | |
); | |
} | |
} |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment