I'm trying to make a mobile app that should work with tablets 7" and above for the screen size.
The app uses the camera when it starts after the login completes.
The camera shall record video and display the camera at the same time on the screen as a small box at the corner.
The problem is when the camera is initialized, even without starting recording the video, the app changes the orientation and displays a message "Rotate for a better view". This happens in all android studio tablet emulator devices that I use to test the app. I never tested this on a real device yet!
The code:
I use specific orientation as landscape locking app to use at the app start.
void main() async {
SystemChrome.setPreferredOrientations(
[DeviceOrientation.landscapeLeft, DeviceOrientation.landscapeRight])
.then((_) {
runApp(MyApp(prefs));
});
}
Initialization of camera controller object, I also tried to force orientation two more times here, but it still doing the same behavior to rotate the screen when start using camera:
void initState() {
super.initState();
SystemChrome.setPreferredOrientations([
DeviceOrientation.landscapeLeft,
DeviceOrientation.landscapeRight,
]);
WidgetsBinding.instance.addPostFrameCallback((_) async {
Timer(
const Duration(seconds: 1),
() async {
await _initCamera();
// await _recordVideo();
},
);
});
}
_initCamera() async {
final cameras = await availableCameras();
final CameraDescription camera = cameras
.where(
(camera) => camera.lensDirection == CameraLensDirection.front)
// ignore: sdk_version_since
.firstOrNull ??
cameras.first;
_cameraController = CameraController(
camera,
ResolutionPreset.max,
enableAudio: true,
);
await _cameraController!.initialize().then((_) {
if (!mounted) {
return;
}
setState(() {});
});
await _cameraController!.lockCaptureOrientation(DeviceOrientation.landscapeRight);
_isLoading = false;
isCamera = true;
setState(() {});
}
For the camera preview widget, which is the small box at the device corner:
Container(
padding: const EdgeInsets.all(4),
decoration: BoxDecoration(
color: isCamera
? isCameraRecording
? Colors.deepOrange
: Colors.black
: Colors.redAccent,
borderRadius: const BorderRadius.all(Radius.circular(10))),
child: isCamera && _cameraController != null
? CameraPreview(_cameraController!)
: null,
)
Screenshot of the issue: android tablet emuator that rotates when using camera
I tried the following:
But unfortunately it keeps consistenet behavior to auto rotate device.
After that, I tested using a phone emulator the issue is not there.
The issue is not related to flutter, but all android tablet emulators.
I assume testing on real android tablets will not generate the same issue. I'll update answer after I test on a real device tablet!
if you're using camera 0.11.0, upgrade it to 0.11.1.
had a similar issue and it got fixed with the update.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With