你如何在Flutter中"中心裁剪"Widget?

Bra*_*ell 4 flutter

我有一个VideoPlayer小部件需要全屏,并且还适合源视频的宽高比.为了达到这个目的,我需要切断视频的顶部/底部或左/右.

我希望以下可能实现这一点,但我认为我必须使用FittedBox不正确,因为它会导致我VideoPlayer的消失:

final Size size = controller.value.size;
return new FittedBox(
  fit: BoxFit.cover,
  child: new AspectRatio(
    aspectRatio: size.width / size.height,
    child: new VideoPlayer(controller)
  ),
);
Run Code Online (Sandbox Code Playgroud)

谁能帮我解决这个问题?

Bra*_*ell 13

终于解决了.有一些缺失的部分:

  1. 我需要一个OverflowBox没有限制的东西,以便我的孩子可以根据需要增长.
  2. 我需要孩子FittedBox实际执行一个大小来阻止布局系统崩溃.
  3. 现在我的小部件将在其边界之外绘制,我们还想在其中放置一个ClipRect以阻止这种情况发生.
final Size size = controller.value.size;
return new ClipRect(
  child: new OverflowBox(
    maxWidth: double.infinity,
    maxHeight: double.infinity,
    alignment: Alignment.center,
    child: new FittedBox(
      fit: BoxFit.cover,
      alignment: Alignment.center,
      child: new Container(
        width: size.width,
        height: size.height,
        child: new VideoPlayer(controller)
      )
    )
  )
);
Run Code Online (Sandbox Code Playgroud)


小智 5

从上面的解决方案开始,我想出了这个:

final Size size = _controller.value.size;
return Container(
  color: Colors.lightBlue,
  width: MediaQuery.of(context).size.width,
  height: MediaQuery.of(context).size.width,
  child: FittedBox(
           alignment: Alignment.center,
       fit: BoxFit.fitWidth,
       child: Container(
         width: size.width,
         height: size.height,
         child: VideoPlayer(_controller))),
      ),
)
Run Code Online (Sandbox Code Playgroud)

内部提供了内部Container的尺寸。TextureVideoPlayer