时间戳

首页 > 解决方案 > 在 TabBarView 中颤振 video_player

dart - 在 TabBarView 中颤振 video_player

问题描述

谁能指出一些允许在 TabBarView 中显示视频的示例代码？到目前为止，当我尝试在选项卡中加载视频时，它会引发错误：

I/颤振（5591）：══╡小部件库发现异常╞══════════════════════════════════════════ ═════════════════════════ I/flutter（5591）：在最终确定小部件树时引发以下断言：I/flutter（5591）： 'package:flutter/src/widgets/scroll_position.dart'：断言失败：第 683 行 pos 12：'pixels != I/flutter (5591): null'：不正确。...

标签： dartflutter

解决方案

下面的代码在 TabBarVew 中显示了 youtube 视频播放器。您需要为 youtube 视频包更新 pubspec.yaml 文件，例如：

dependencies:
  youtube_player: ^0.6.0

您的要求的示例代码是：

import 'package:flutter/material.dart';
import 'package:youtube_player/youtube_player.dart';


void main() {
  runApp(StartPage());
}

class StartPage extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return new MaterialApp(
      title: "New Task",
      debugShowCheckedModeBanner: false,
      home: new HomePage(),
    );
  }
}

class HomePage extends StatefulWidget {
  @override
  _HomePageState createState() => _HomePageState();
}

class _HomePageState extends State<HomePage> with SingleTickerProviderStateMixin{

  TabController _tabController;

  @override
  void initState() {
    _tabController = new TabController(length: 3, vsync: this);
    super.initState();
  }

  @override
  Widget build(BuildContext context) {
    return new Scaffold(
      appBar: new AppBar(
        title: new Text("GrubX"),
        bottom: TabBar(
          unselectedLabelColor: Colors.white,
          labelColor: Colors.amber,
          tabs: [
          new Tab(icon: new Icon(Icons.call)),
          new Tab(
            icon: new Icon(Icons.chat),
          ),
          new Tab(
            icon: new Icon(Icons.notifications),
          )
        ],
        controller: _tabController,
        indicatorColor: Colors.white,
        indicatorSize: TabBarIndicatorSize.tab,),
        bottomOpacity: 1,
      ),
      body: TabBarView(
          children: [
        new YoutubePlayer(
          source: "https://www.youtube.com/watch?v=Gb2xJ-GMKmo",
          quality: YoutubeQuality.HD,
          aspectRatio: 16/9,
          showThumbnail: true,),
        new YoutubePlayer(
          source: "https://www.youtube.com/watch?v=Gb2xJ-GMKmo",
          quality: YoutubeQuality.HD,
          aspectRatio: 16/9,
          showThumbnail: true,),
        new YoutubePlayer(
          source: "https://www.youtube.com/watch?v=Gb2xJ-GMKmo",
          quality: YoutubeQuality.HD,
          aspectRatio: 16/9,
          showThumbnail: true,),
      ],
      controller: _tabController,),
    );
  }
}

如果您想从手机播放视频，可以使用 video_player 包而不是 youtube_player。

推荐阅读