顫振相機預覽

Question

我是Flutter和Dart的新手，所以請耐心等待。 我正在嘗試使用Flutter使用Camera Plugin顯示相機預覽，並且有兩個問題。 1）預覽被拉伸，所以事情看起來很奇怪。 2）我想在預覽下方顯示BottomNavigationBar ，但Camera Preview使用所有屏幕空間。

我初始化相機並打開預覽：

@override
Widget build(BuildContext context) {

  if (!_isReady) return new Container();
  if (!controller.value.initialized) return new Container();

  return new CameraPreview(controller);
}

1）這是我稱為_CameraWidgetState的類的構建方法。 如何讓這個預覽看起來不舒展？

2）為了使CameraWidget不使用所有空間，我已經嘗試將它放在一個沒有運氣的Scaffold ：

Widget build(BuildContext context) {
return new Scaffold(
  appBar: new AppBar(
    title: new Text(widget.title),
  ),
  body: new Center(
    child: new CameraWidget(),
  ),
  bottomNavigationBar: new BottomNavigationBar(
    items: [
      new BottomNavigationBarItem(
          icon: new Icon(Icons.camera), title: new Text("Left")),

      new BottomNavigationBarItem(
          icon: new Icon(Icons.favorite),
          title: new Text("Right"))
    ],
  ),
);
}

任何想法或幫助表示贊賞！

Answer 1

這解決了問題，但也可能有更好的解決方案。 （感謝上述評論中的@ user1462442。）

@override
Widget build(BuildContext context) {
 if (!_isReady) return new Container();
 if (!controller.value.initialized) return new Container();

 return new Scaffold(
   body: new Container(
     child: new AspectRatio(
       aspectRatio: controller.value.aspectRatio,
       child: new CameraPreview(controller),
     ),
   ),
   floatingActionButton: new FloatingActionButton(
     onPressed: _isReady ? capture : null,
     child: const Icon(
       Icons.camera,
       color: Colors.white,
     ),
   ),
   floatingActionButtonLocation: FloatingActionButtonLocation.centerFloat,
 );
}