Zoom camera in Flutter - flutter

Question

I'm using this lib for displaying a camera (https://pub.dev/packages/camera), however, I'd like to set a predefined zoom value for the camera before it starts, but I'm not able to identify where I can set it using this lib.
Does anyone know how to do it?
Here's the code I got so far
import 'package:flutter/material.dart';
import 'dart:async';
import 'package:flutter/material.dart';
import 'package:camera/camera.dart';
class CameraPage extends StatefulWidget {
#override
_CameraPageState createState() => _CameraPageState();
}
class _CameraPageState extends State<CameraPage> {
List<CameraDescription> cameras;
CameraController controller;
#override
void initState() {
// TODO: implement initState
super.initState();
buscarCameras();
}
Future<void> buscarCameras() async {
cameras = await availableCameras();
controller = CameraController(cameras[0], ResolutionPreset.medium);
controller.initialize().then((_) {
if (!mounted) {
return;
}
setState(() {});
});
}
#override
Widget build(BuildContext context) {
if(controller == null || controller.value == null)
return Center(
child: CircularProgressIndicator(),
);
if (!controller.value.isInitialized) {
return Container();
}
return AspectRatio(
aspectRatio: controller.value.aspectRatio,
child: CameraPreview(controller));
}
}

Answer 1

Flutter has added zoom support as of Camera version 0.6.2. You can use cameraController.setZoomLevel(4.0); in your code to adjust the zoom level.
There are also other helpful functions, such as cameraControl.getMaxZoomLevel(); to find the limits for the zoom level.
There isn't any documentation for this feature at time of writing, as it is very recent, but you can look through the code for the camera controller to see the available methods.

Answer 2

Create your zoom variable in state class:
class _ShowCameraState extends State<ShowCamera> {
CameraController _cameraController;
Future<void> _initializeControllerFuture;
double zoom = 0.0;
}
And then in a widget, create slider:
#override
Widget build(BuildContext context) {
return OrientationBuilder(
builder: (context, orientation) => Scaffold(
backgroundColor: Colors.black,
body: Stack(
children: [
FutureBuilder<void>(
future: _initializeControllerFuture,
builder: (context, snapshot) {
if (snapshot.connectionState == ConnectionState.done) {
return CameraPreview(_cameraController);
} else {
return Center(
child: CircularProgressIndicator(),
);
}
},
),
floatingActionButtonLocation: FloatingActionButtonLocation.centerFloat,
floatingActionButton: Column(
mainAxisAlignment: MainAxisAlignment.end,
children: [
Slider(
activeColor: Colors.red,
value: zoom,
onChanged: (value) {
print(value);
// as slider values are in decimals, we multiply it by 10 because camera
//take values above 1.0 and below 8.0
//e.g:
//value=0.19 //according to slider
//value=value*10=> 0.19*10
//Now the updated value is:
//value=1.9
value = value * 10;
if (value <= 8.0 && value >= 1.0) {
//Here we set the zoom level when we move slider pointer
_cameraController.setZoomLevel(value);
}
//and to set slider pointer position visually, we divided the value by 10
//to give slider its original value.
setState(() => zoom = value / 10);
},
),

Answer 3

For those who need to do it now: Wrap your CameraPreview widget inside a GestureDetector and add the below code block inside it (you must initialize your CameraController before this).
onScaleUpdate: (details) async {
var maxZoomLevel = await camController.getMaxZoomLevel();
// just calling it dragIntensity for now, you can call it whatever you like.
var dragIntensity = details.scale;
if (dragIntensity < 1) {
// 1 is the minimum zoom level required by the camController's method, hence setting 1 if the user zooms out (less than one is given to details when you zoom-out/pinch-in).
camController.setZoomLevel(1);
} else if (dragIntensity > 1 && dragIntensity < maxZoomLevel) {
// self-explanatory, that if the maxZoomLevel exceeds, you will get an error (greater than one is given to details when you zoom-in/pinch-out).
camController.setZoomLevel(dragIntensity);
} else {
// if it does exceed, you can provide the maxZoomLevel instead of dragIntensity (this block is executed whenever you zoom-in/pinch-out more than the max zoom level).
camController.setZoomLevel(maxZoomLevel);
}
},
Very simple logic and gets the job done right away, but you can optimize it further for better user experience if you need.