Question

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

I / flutter（5591）：W小工具库引起的异常CA ════════════════════════════ I / flutter（5591）：在结束小部件树时引发了以下断言： I / flutter（5591）：'package：flutter / src / widgets / scroll_position.dart'：断言失败：第683行pos 12：'pixels！= I / flutter（5591）：null'：不正确。 ...

Answer 1

下面的代码在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。

TabBarView中的Flutter video_player

1 个答案: