dart 如何使Chewie视频播放器响应- Flutter?

hof1towb  于 2023-06-19  发布在  Flutter
关注(0)|答案(3)|浏览(154)

我试着在 SizedBox 中放置,也使用 AspectRatio 属性,但它不能正常工作。如果我可以调整大小,以适应移动的设备上,它不会在平板电脑上响应。这段代码放在一个 * 列 * 中

Chewie(
  controller: chewieController,
),

这就是它的声明方式:

videoPlayerController = VideoPlayerController.network(
        "https://player.vimeo.com/progressive_redirect/playback/738271412/rendition/1080p/file.mp4?loc=external&signature=b4ac532ca6f446de3a53ba9e29a5d7e54f3bca0acb5ae61528a44d75222a0ef8");

    //videoPlayerController.initialize();

    chewieController = ChewieController(
      videoPlayerController: videoPlayerController,
      autoPlay: true,
      looping: false,
    );

k5hmc34c

k5hmc34c1#

尝试将您的widget放入Expanded widget:

Expanded(
    child: VideoPlayer(),
);

或进入:

final screenSize = MediaQuery.of(context).size;

SizedBox(
    width: screenSize.width,
    height: screenSize.height,
    child: VideoPlayer(),
);
h43kikqp

h43kikqp2#

我通过添加 SizedBox 小部件解决了这个问题

SizedBox(
              width: 80.w,
              height: 40.w,
              child: Chewie(
                controller: chewieController,
              ),
            ),

和aspectRatio在构造函数中

chewieController = ChewieController(
      videoPlayerController: videoPlayerController,
      autoPlay: true,
      aspectRatio: videoPlayerController.value.aspectRatio*2,
      looping: false,
    );

这适合我的例子,因为视频宽度是高度的两倍,但它工作得很好。

70gysomp

70gysomp3#

这是我工作的解决方案(chewie v1.5.0)。
关键的添加(与我看到的其他建议相比)是添加一个带有max约束的Container(由LayoutBuilder提供)。

LayoutBuilder(builder: (context, constraints) {
      return Column(
        mainAxisAlignment: MainAxisAlignment.center,
        mainAxisSize: MainAxisSize.min,
        children: [
          _chewieController != null && _chewieController!.videoPlayerController.value.isInitialized
              ? Container(
                  constraints: BoxConstraints(
                    maxHeight: constraints.maxHeight,
                    maxWidth: constraints.maxWidth,
                  ),
                  child: AspectRatio(
                    aspectRatio: _videoPlayerController.value.aspectRatio,
                    child: Chewie(controller: _chewieController!),
                  ),
                )
              : const SomeFallBackWidget(),
        ],
      );
    });

我还将aspectRatio传递给了chewie控制器:

_chewieController = ChewieController(
        videoPlayerController: _videoPlayerController,
        \\... other options
        aspectRatio: _videoPlayerController.value.aspectRatio,
        );

注意:在父Widget中添加SafeArea和AppBar时,我发现chewie控件的呈现方式有些不一致。对我有效的解决方案是SafeArea> Scaffold(extendBodyBehindAppBar: true)> Stack> ...as above(没有AppBar)。

相关问题