如何在Flutter中“中心裁剪”小部件？

一尘不染

如何在Flutter中“中心裁剪”小部件？

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)
  ),
);

谁能帮我解决这个问题？🙏

阅读 328

2020-08-13

共1个答案

一尘不染

终于解决了。有一些遗漏的部分：

我需要一个OverflowBox不受限制的，这样我的孩子才能长到需要的大小。
我需要的孩子FittedBox实际设置一个大小，以防止布局系统崩溃。
现在，我的小部件将在其边界之外进行绘制，我们也想在其中放置一个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)
          )
        )
      )
    );

2020-08-13