时间戳

首页 > 解决方案 > provides YouTube suggestions using flutter

flutter - provides YouTube suggestions using flutter

问题描述

I am developing an app for elderly people using flutter, the app will requires the elderly to select the subject he interested in then, in the home of the app I want to provide YouTube videos about that subject so for example if he chose news this will provided in the home enter image description here

and if he clicked in the video it will be opened in the YouTube app I want the suggestions to be changed every 2 hours and he can chose more than one subject. any ideas how can I do this?

标签： flutter

解决方案

Use this package https://pub.dev/packages/youtube_api for searching for videos on the topic entered by user and display the videos using https://pub.dev/packages/youtube_player_flutter to display the videos.

Import the libraries in your pubspec.yaml

dependencies:
  youtube_api: ^0.8.0
  youtube_player_flutter: ^7.0.0+7

Then inside your stateful widget where you display the videos, add this function after the build method and call it in initState

void videoList(query) async{
   static String key = 'YOUR_API_KEY';# Get one by following this https://developers.google.com/youtube/registering_an_application
   YoutubeAPI ytApi = new YoutubeAPI(key,Type:"video",maxResults:20);
   List<YT_API> ytResult = [];
   ytResult = await ytApi.search(query);
   ytResult.forEach((video){
      String url = video['url'];
      videoId = YoutubePlayer.convertUrlToId(url);
      YoutubePlayerController _controller = YoutubePlayerController(
        initialVideoId: videoID,
        flags: YoutubePlayerFlags(
        autoPlay: false,
        ),
      ); 
      widgetList.add(Container(
         width:MediaQuery.of(context).size.width *0.9,
         child: YoutubePlayer(
           controller: _controller,
           showVideoProgressIndicator: true,
           videoProgressIndicatorColor: Colors.amber,
           progressColors: ProgressColors(
             playedColor: Colors.amber,
             handleColor: Colors.green[800],
           ),
           onReady () {
           },
         ),
      ); 
      widgetList.add(SizedBox(height:30));
      setState((){});
   });
}

INIT STATE

void initState(){
   super.initState();
   videoList(query);#I have declared the variables in next code block
}

VARIABLES DECLARATION

List<Widget> widgetList= [];
String query = "";

IN BUILD

body:Container(
  color:Colors.white,
  child: SingleChildScrollView(
    child:Column(
      children:<Widget>[
       //Add a text field or a dropdown for the subject entry and set its on submit to (value){setState((){query=value});)
       SizedBox(height:30),
      ]+widgetList
    )
  )
)

I have written this code without an editor so you will have to make changes but this is basically the code

推荐阅读