From 9a24f3e474047bcd0c5823fd60cecd6583e56b9e Mon Sep 17 00:00:00 2001
From: Naveed Jooma <naveed@viam.com>
Date: Fri, 29 Sep 2023 17:29:06 -0400
Subject: [PATCH] Set correct ratio for camera stream widget (#121)

---
 lib/widgets/camera_stream.dart | 23 ++++++++++++++++++-----
 1 file changed, 18 insertions(+), 5 deletions(-)

diff --git a/lib/widgets/camera_stream.dart b/lib/widgets/camera_stream.dart
index 5a64dd9566..945e7db7a2 100644
--- a/lib/widgets/camera_stream.dart
+++ b/lib/widgets/camera_stream.dart
@@ -23,6 +23,8 @@ class _ViamCameraStreamViewState extends State<ViamCameraStreamView> {
   late RTCVideoRenderer _renderer;
   late StreamSubscription<MediaStream> _streamSub;
   Exception? _error;
+  int _width = 160;
+  int _height = 90;
 
   @override
   void initState() {
@@ -44,7 +46,15 @@ class _ViamCameraStreamViewState extends State<ViamCameraStreamView> {
     final stream = widget.streamClient.getStream();
     _streamSub = stream.listen((event) {
       _error = null;
-      _renderer.srcObject = event;
+      _renderer.setSrcObject(stream: event);
+      _renderer.onResize = () {
+        setState(() {
+          if (_renderer.videoWidth > 0 && _renderer.videoHeight > 0) {
+            _width = _renderer.videoWidth;
+            _height = _renderer.videoHeight;
+          }
+        });
+      };
       setState(() {});
     });
     _streamSub.onError((error, trace) {
@@ -74,9 +84,12 @@ class _ViamCameraStreamViewState extends State<ViamCameraStreamView> {
               Text(_error.toString(), textAlign: TextAlign.center),
             ]),
           )
-        : Container(
-            constraints: const BoxConstraints(maxHeight: 300),
-            child: RTCVideoView(_renderer),
-          );
+        : LayoutBuilder(builder: ((context, constraints) {
+            return Container(
+              decoration: const BoxDecoration(color: Colors.black),
+              constraints: BoxConstraints(maxHeight: _height * constraints.maxWidth / _width),
+              child: RTCVideoView(_renderer),
+            );
+          }));
   }
 }