如何使 flutter_vlc_player 使用来自 api 的数据答案

【问题标题】：How to make flutter_vlc_player work with data from an api如何使 flutter_vlc_player 使用来自 api 的数据
【发布时间】：2023-02-12 18:40:16
【问题描述】：

我正在使用一个返回一些电视直播的 api。但我真的不知道如何使用 flutter_vlc_player 来解决这个问题，这正是我想要使用的。 its documentation

我试过了，但我收到错误 _videoPlayerController has not been initialized

这是我的代码

import 'package:flutter/material.dart';
import 'dart:convert';
import 'package:http/http.dart' as http;
import 'package:flutter_vlc_player/flutter_vlc_player.dart';

  class Home extends StatefulWidget {
  const Home({Key? key}) : super(key: key);

 @override
 State<Home> createState() => _HomeState();
 }

 class _HomeState extends State<Home> {

  Future<List<dynamic>> fetchMedia() async {
  final result = await http
     .get(Uri.parse('https://iptv-org.github.io/api/streams.json'));
  return json.decode(result.body);
  }

  String _name(dynamic media) {
  return media['channel'];
   }

 String _location(dynamic media) {
 return media['url'];
 }

  @override
 Widget build(BuildContext context) {
  return Scaffold(
   body: Container(
    child: FutureBuilder<List<dynamic>>(
      future: fetchMedia(),
      builder: (BuildContext context, AsyncSnapshot snapshot) {
        if(snapshot.hasData){

          return ListView.builder(
              padding: EdgeInsets.all(8),
              itemCount: 10,
              itemBuilder: (BuildContext context, int index){
                 late VlcPlayerController _videoPlayerController;

      @override

      void dispose() async {
      super.dispose();
      await _videoPlayerController.stopRendererScanning();
     await _videoPlayerController.dispose();
     }

     String url = _location(snapshot.data[index]);
       
    @override

   void initState() {
    super.initState();

    _videoPlayerController = VlcPlayerController.network(
     url,
    autoPlay: false,
   options: VlcPlayerOptions(),
   );
    }
        return
             Card(
                 child: Column(
                      children: <Widget>[
                        ListTile(
                          leading: Icon(Icons.tv),
                           
                          title: Text(_name(snapshot.data[index])),
                          subtitle:SizedBox(
                              child: VlcPlayer(
      controller: _videoPlayerController,
      aspectRatio: 16/ 9,
      placeholder: Center(child: CircularProgressIndicator()),
       ),),)], 
     ),):});
                      
        }else {
          return Center(child: CircularProgressIndicator());
        }
      },


    ),
  ),

);
}
}

我想要实现的是，对于要传递到 VlcPlayerController.network() 的特定索引的每个媒体 url 有人可以帮忙吗！

【问题讨论】：

标签： flutter api

【解决方案1】：

Scaffold(
  body: FutureBuilder<List<dynamic>>(
    future: fetchMedia(),
    builder: (BuildContext context, AsyncSnapshot snapshot) {
      if (snapshot.hasData) {
        return ListView.builder(
            padding: const EdgeInsets.all(8),
            itemCount: 10,
            itemBuilder: (BuildContext context, int index) {
              String url = _location(snapshot.data[index]);
              VlcPlayerController videoPlayerController =
                  VlcPlayerController.network(
                url,
                autoPlay: false,
                options: VlcPlayerOptions(),
              );

              @override
              void dispose() async {
                super.dispose();
                await videoPlayerController.stopRendererScanning();
                await videoPlayerController.dispose();
              }

              @override
              void initState() {
                super.initState();

                videoPlayerController = VlcPlayerController.network(
                  url,
                  autoPlay: false,
                  options: VlcPlayerOptions(),
                );
              }

              return Card(
                child: Column(
                  children: <Widget>[
                    ListTile(
                      leading: Icon(Icons.tv),
                      title: Text(_name(snapshot.data[index])),
                      subtitle: SizedBox(
                        child: VlcPlayer(
                          controller: videoPlayerController,
                          aspectRatio: 16 / 9,
                          placeholder:
                              Center(child: CircularProgressIndicator()),
                        ),
                      ),
                    )
                  ],
                ),
              );
            });
      } else {
        return Center(child: CircularProgressIndicator());
      }
    },
  ),
);

这是flutter_vlc_player 的更新代码请确保android 最小SDK 为20，否则项目将无法运行。

【讨论】：