dart - Android 和 iOS 的底部导航栏都没有填充抖动的视频宽度

Question

我正在播放视频。
没有底部导航栏， View 看起来很完美。
宽度与设备的宽度相同。
但是有了底部导航栏，宽度会变小一点。
所以，视频的宽度不会填满设备的宽度，两边都会有空白。
我不知道出了什么问题。喜欢这些图片

代码

     // bottom navigation
              return WillPopScope(
              onWillPop: () async {
                await Future<bool>.value(true);
              },
              child: CupertinoTabScaffold(
              tabBar: CupertinoTabBar(
              iconSize: 36.0,
              activeColor: Colors.black,
              inactiveColor: Colors.grey,
              backgroundColor: Colors.white,
              items: <BottomNavigationBarItem>[
                BottomNavigationBarItem(
                  icon: Icon(Icons.home),
                  title: Container(),
                ),
                BottomNavigationBarItem(
                  icon: Icon(Icons.whatshot),
                  title: Container(),
                ),
                BottomNavigationBarItem(
                  icon: Icon(Icons.search),
                  title: Container(),
                ),
                BottomNavigationBarItem(
                  icon: Icon(Icons.subscriptions),
                  title: Container(),
                ),
              ],
            ),
            tabBuilder: (BuildContext context, int index) {
              return CupertinoTabView(
                builder: (_) {
                    return _pages[index];
                },
              );
            },
          ),
        );

 // video page
    return Scaffold(
      body: SafeArea(
        child: Stack(
          children: <Widget>[
            Center(
              child: AspectRatio(
                aspectRatio: _controller.value.aspectRatio,
                child: VideoPlayer(_controller),
              )
            ),
            Align(
              alignment: Alignment.topLeft,
              child: Icon(Icons.history, color: Colors.white)
            ),
            Align(
              alignment: Alignment.bottomCenter,
              child: Row(
                mainAxisAlignment: MainAxisAlignment.spaceBetween,
                children: <Widget>[
                  Icon(Icons.tag_faces, color: Colors.white),
                  Icon(Icons.lightbulb_outline, color: Colors.white)
                ],
              ),
            )
          ],
        )
      )
    );

谁知道问题出在哪里？

Answer 1

底部导航栏不在堆栈中，因此它缩小了分配给堆栈的空间。视频具有固定的纵横比，因此当垂直空间减小时，宽度也会减小。尝试将视频播放器包装在 FittedBox 中。

FittedBox(fit: BoxFit.fitWidth, child: VideoPlayer(_controller));