Camera Preview and Multipart Image Upload In Flutter :
This flutter tutorial camera preview and multipart image upload to server in flutter.
dependencies
camera:
path_provider:
http:
Camera Preview Image
AspectRatio(child: CameraPreview(controller), aspectRatio: controller.value.aspectRatio)
main.dart
import 'dart:async'; import 'dart:io'; import 'package:async/async.dart'; import 'package:flutter/material.dart'; import 'package:camera/camera.dart'; import 'package:path/path.dart'; import 'package:path_provider/path_provider.dart'; import 'package:http/http.dart' as http; import 'dart:convert'; List<CameraDescription> cameras; Future<void> main() async { WidgetsFlutterBinding.ensureInitialized(); cameras = await availableCameras(); runApp(MaterialApp(home: CameraApp())); } class CameraApp extends StatefulWidget { @override _CameraAppState createState() => _CameraAppState(); } class _CameraAppState extends State<CameraApp> with SingleTickerProviderStateMixin { CameraController controller; int currentCamera = 0; bool isOffStaged = true; bool showpic = true; double _bottomPosition = 0; List<Widget> texts = List<Widget>(); File _file; static final Animatable<Offset> _drawerDetailsTween = Tween<Offset>( begin: const Offset(0.0, 1.0), end: Offset.zero, ).chain(CurveTween( curve: Curves.fastOutSlowIn, )); Animation<Offset> _drawerDetailsPosition; AnimationController _controller; @override void initState() { super.initState(); _file = null; controller = CameraController(cameras[currentCamera], ResolutionPreset.high); controller.initialize().then((_) { if (!mounted) { return; } setState(() {}); }); _controller = AnimationController( vsync: this, duration: const Duration(milliseconds: 300), ); _drawerDetailsPosition = _controller.drive(_drawerDetailsTween); } @override void dispose() { controller?.dispose(); _controller.dispose(); super.dispose(); } Future<File> _takePicture() async { if (!controller.value.isInitialized) { // TODO: show snackbar print("no camera selected! show snackbar"); return null; } final Directory extDir = await getApplicationDocumentsDirectory(); final String dirPath = "${extDir.path}/pictures/fluttertutorial"; await Directory(dirPath).create(recursive: true); final String filePath = "$dirPath/${timestamp()}.jpg"; if (controller.value.isTakingPicture) { return null; } try { await controller.takePicture(filePath); } on CameraException catch (e) { // TODO: show snackbar print("show snackbar here"); return null; } setState(() { _file = File(filePath); }); return File(filePath); } String timestamp() => DateTime.now().millisecondsSinceEpoch.toString(); upload(File imageFile) async { print('Tag' + imageFile.path.toString()); var stream = new http.ByteStream(DelegatingStream.typed(imageFile.openRead())); // get file length var length = await imageFile.length(); // string to uri //var uri = Uri.parse("url"); var uri = Uri.parse("url"); // create multipart request var request = new http.MultipartRequest("POST", uri); // multipart that takes file var multipartFile = new http.MultipartFile('file', stream, length, filename: basename(imageFile.path)); // add file to multipart request.files.add(multipartFile); // send var response = await request.send(); print(response.statusCode); // listen for response response.stream.transform(utf8.decoder).listen((value) { print(value); setState(() { //chips = getChips(value); texts = getTexts(value); isOffStaged = false; _controller.forward(); print(isOffStaged); }); }); } List<Widget> getTexts(String value) { List<String> doggos = value.split(","); List<Widget> doggoChips = List<Widget>(); doggoChips.add(Align( alignment: Alignment.centerRight, child: IconButton( icon: Icon(Icons.close), onPressed: () { setState(() { _controller.reverse(); Future.delayed(Duration(milliseconds: 300)).then((v) { setState(() { isOffStaged = true; showpic = true; _bottomPosition = 0; }); }); }); }, ), )); for (int i = 0; i < doggos.length - 1; i++) { doggoChips.add( Padding( padding: i == 0 ? EdgeInsets.only(bottom: 8.0) : EdgeInsets.symmetric(vertical: 8.0), child: Text( doggos[i].replaceRange(0, 1, doggos[i][0].toUpperCase()), style: TextStyle(fontSize: 20), ), ), ); } return doggoChips; } @override Widget build(BuildContext context) { // if (!controller.value.isInitialized) { // return Container(); // } final size = MediaQuery.of(context).size; final deviceRatio = size.width / size.height; return Scaffold( backgroundColor: Colors.white, body: Container( height: MediaQuery.of(context).size.height, width: MediaQuery.of(context).size.width, child: Stack( alignment: Alignment.bottomCenter, children: <Widget>[ Offstage( offstage: !showpic, child: controller.value.isInitialized ? Transform.scale( scale: controller.value.aspectRatio / deviceRatio, child: Center( child: AspectRatio( child: CameraPreview(controller), aspectRatio: controller.value.aspectRatio, ), ), ) : Container()), AnimatedPositioned( bottom: _bottomPosition, duration: Duration(milliseconds: 300), left: 0, right: 0, curve: Curves.easeInOut, child: Container( color: Colors.black45, child: Row( mainAxisAlignment: MainAxisAlignment.spaceAround, children: <Widget>[ IconButton( icon: Icon( Icons.photo, color: Colors.white, ), onPressed: () {}, ), IconButton( icon: Icon( Icons.camera, color: Colors.white, ), onPressed: () { setState(() { _bottomPosition = -200; }); _takePicture().then((imageFile) { setState(() { showpic = false; }); upload(imageFile); }); }, ), IconButton( icon: Icon( Icons.loop, color: Colors.white, ), onPressed: () { currentCamera = (currentCamera + 1) % cameras.length; controller = CameraController( cameras[currentCamera], ResolutionPreset.high); controller.initialize().then((_) { if (!mounted) { return; } setState(() {}); }); }, ), ], ), ), ), Offstage( offstage: showpic, child: _file == null ? Container() : Stack( children: <Widget>[ Image.file( _file, fit: BoxFit.fitHeight, height: MediaQuery.of(context).size.height, width: MediaQuery.of(context).size.width, ), SizedBox.expand( child: Container( color: Colors.black45, child: Center( child: isOffStaged == true ? Container( height: 50, width: 50, child: CircularProgressIndicator(), ) : Container(), ), ), ), ], )), Offstage( offstage: isOffStaged, child: SlideTransition( position: _drawerDetailsPosition, child: Card( color: Colors.blue.shade300, shape: RoundedRectangleBorder( borderRadius: BorderRadius.circular(20)), margin: EdgeInsets.all(10), child: Container( width: double.infinity, child: Padding( padding: const EdgeInsets.symmetric( vertical: 8.0, horizontal: 24), child: Column( mainAxisSize: MainAxisSize.min, crossAxisAlignment: CrossAxisAlignment.start, children: texts, ), ), ), ), ), ) ], ), ), ); } }
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