How to Custom value YoutubePlayerFlags in youtube_player_flutter library when we click on button?

977 views Asked by At

I have a problem custom YoutubePlayerFlags every time a button clicked . I want when the button is pressed, its change the value of YoutubePlayerFlags , is it possible ? if possible, how to do it? this is my View

import 'dart:developer';

import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:flutter/rendering.dart';
import 'package:flutter/services.dart';
import 'package:flutter_switch/flutter_switch.dart';
import 'package:get/get.dart';
import 'package:mobile/Controller/Home/Live/LiveController.dart';
import 'package:youtube_player_flutter/youtube_player_flutter.dart';

/// Homepage
class LiveScreen extends StatefulWidget {
  @override
  _LiveScreen createState() => _LiveScreen();
}

class _LiveScreen extends State<LiveScreen> {

  var liveController    = Get.put(LiveController());
  var url               = '';
  bool statustiket      = false;

  @override
  void initState() {
// TODO: implement initState

url         = Get.arguments['url'];
statustiket = Get.arguments['status'];
print("Status Tiket : "+statustiket.toString());
liveController.videoId = YoutubePlayer.convertUrlToId(url)!;
print(liveController.videoId);
liveController.controller = YoutubePlayerController(
  initialVideoId: liveController.videoId,
  flags: YoutubePlayerFlags(
    mute: false,
    autoPlay: true,
    disableDragSeek: false,
    loop: false,
    isLive: false,
    forceHD: false,
    // startAt: 0,
    enableCaption: false,
    // useHybridComposition: true
  ),
)..addListener(listener);
liveController.idController = TextEditingController();
liveController.seekToController = TextEditingController();
liveController.videoMetaData = const YoutubeMetaData();
liveController.playerState = PlayerState.unknown;
super.initState();


}



void listener() {
    if (liveController.isPlayerReady && mounted && !liveController.controller.value.isFullScreen) {
      setState(() {
        liveController.playerState = liveController.controller.value.playerState;
        liveController.videoMetaData = liveController.controller.metadata;
      });

    }



}



 @override
  Widget build(BuildContext context) {
    return YoutubePlayerBuilder(

  // onEnterFullScreen: (){
  //   SystemChrome.setPreferredOrientations(DeviceOrientation.values);
  // },
  // onExitFullScreen: () {
  //   // The player forces portraitUp after exiting fullscreen. This overrides the behaviour.
  //   SystemChrome.setPreferredOrientations(DeviceOrientation.values);
  // },
  player: YoutubePlayer(
    // bottomActions: [
    //   Text("coba")
    // ],
    // thumbnail: Text(ThumbnailQuality.high),
    controller: liveController.controller,
    showVideoProgressIndicator: true,
    progressIndicatorColor: Colors.blueAccent,
    topActions: <Widget>[
      const SizedBox(width: 8.0),
      Expanded(
        child: Text(
          liveController.controller.metadata.title,
          style: const TextStyle(
            color: Colors.white,
            fontSize: 18.0,
          ),
          overflow: TextOverflow.ellipsis,
          maxLines: 1,
        ),
      ),
      // IconButton(
      //   icon: const Icon(
      //     Icons.settings,
      //     color: Colors.white,
      //     size: 25.0,
      //   ),
      //   onPressed: () {
      //     log('Settings Tapped!');
      //   },
      // ),
    ],
    onReady: () {
      liveController.isPlayerReady = true;
    },
    onEnded: (data) {
      print(data);
      liveController.controller
          .load(liveController.ids[(liveController.ids.indexOf(data.videoId) + 1) % liveController.ids.length]);
      _showSnackBar('Next Video Started!');
    },
  ),
  builder: (context, player) => Scaffold(
    appBar: AppBar(
      // leading: Padding(
      //   padding: const EdgeInsets.only(left: 12.0),
      //   child: Image.asset(
      //     'assets/ypf.png',
      //     fit: BoxFit.fitWidth,
      //   ),
      // ),
      title: const Text(
        'Youtube Player Flutter',
        style: TextStyle(color: Colors.white),
      ),
      // actions: [
      //   IconButton(
      //     icon: const Icon(Icons.video_library),
      //     onPressed: () => Navigator.push(
      //       context,
      //       CupertinoPageRoute(
      //         builder: (context) => VideoList(),
      //       ),
      //     ),
      //   ),
      // ],
    ),
    body: Container(
      color: Colors.orangeAccent,
      child: ListView(
        children: [
          player,
          Padding(
            padding: const EdgeInsets.all(8.0),
            child: Column(
              crossAxisAlignment: CrossAxisAlignment.stretch,
              children: [
                _space,
                _text('Title', liveController.videoMetaData.title),
                _space,
                _text('Channel', liveController.videoMetaData.author),
                // _space,
                // _text('Video Id', _videoMetaData.videoId),
                _space,
                Row(
                  mainAxisAlignment: MainAxisAlignment.start,
                  children: [
                    Text(
                      'Kualitas : ',
                    ),
                    // const Spacer(),

                    GetBuilder<LiveController>(
                        builder: (value){

                          return FlutterSwitch(
                            // width: Get.width * 0.1,
                            activeText: "High",
                            inactiveText: "Auto",
                            height: 30.0,
                            width: 80,
                            valueFontSize: 10.0,
                            toggleSize: 45.0,
                            value: value.statusHD.value,
                            borderRadius: 30.0,
                            padding: 8.0,
                            showOnOff: true,
                            // disabled: value.statusHD.value,
                            onToggle: (bool val) {
                              // print("Status : " + val.toString());
                              print(liveController.videoMetaData.duration);
                              value.updateStatusHD(val);
//update YoutubePlayerFlags forceHD here

                            },
                          );

                        }
                    ),

                    // _text(
                    //   'Playback Rate',
                    //   liveController.controller.value.playbackRate.toString() + '}x  ',
                    // ),
                  ],
                ),
                _space,
                AnimatedContainer(
                  duration: const Duration(milliseconds: 800),
                  decoration: BoxDecoration(
                    borderRadius: BorderRadius.circular(20.0),
                    color: _getStateColor(liveController.playerState),
                  ),
                  padding: const EdgeInsets.all(8.0),
                  child: Text(
                    // _playerState.toString(),
                    "Share",
                    style: const TextStyle(
                      fontWeight: FontWeight.w300,
                      color: Colors.white,
                    ),
                    textAlign: TextAlign.center,
                  ),
                ),
              ],
            ),
          ),
        ],
      ),
    )
  ),
);


}

  Widget _text(String title, String value) {
    return RichText(
      text: TextSpan(
        text: '$title : ',
        style: const TextStyle(
          color: Colors.blueAccent,
          fontWeight: FontWeight.bold,
        ),
        children: [
          TextSpan(
            text: value,
            style: const TextStyle(
              color: Colors.black,
              fontWeight: FontWeight.w300,
            ),
          ),
        ],
      ),
    );



}

  Color _getStateColor(PlayerState state) {
    switch (state) {
      case PlayerState.unknown:
        return Colors.grey[700]!;
      case PlayerState.unStarted:
        return Colors.pink;
      case PlayerState.ended:
        return Colors.red;
      case PlayerState.playing:
        return Colors.blueAccent;
      case PlayerState.paused:
        return Colors.orange;
      case PlayerState.buffering:
        return Colors.yellow;
      case PlayerState.cued:
        return Colors.blue[900]!;
      default:
        return Colors.blue;
    }
  }

  Widget get _space => const SizedBox(height: 10);

  Widget _loadCueButton(String action) {
    return Expanded(
      child: MaterialButton(
        color: Colors.blueAccent,
        onPressed: liveController.isPlayerReady
            ? () {
          if (liveController.idController.text.isNotEmpty) {
            var id = YoutubePlayer.convertUrlToId(
              liveController.idController.text,
            ) ??
                '';
            if (action == 'LOAD') liveController.controller.load(id);
            if (action == 'CUE') liveController.controller.cue(id);
            FocusScope.of(context).requestFocus(FocusNode());
          } else {
            _showSnackBar('Source can\'t be empty!');
          }
        }
            : null,
        disabledColor: Colors.grey,
        disabledTextColor: Colors.black,
        child: Padding(
          padding: const EdgeInsets.symmetric(vertical: 14.0),
          child: Text(
            action,
            style: const TextStyle(
              fontSize: 18.0,
              color: Colors.white,
              fontWeight: FontWeight.w300,
            ),
            textAlign: TextAlign.center,
          ),
        ),
      ),
    );
  }

  void _showSnackBar(String message) {
    ScaffoldMessenger.of(context).showSnackBar(
      SnackBar(
        content: Text(
          message,
          textAlign: TextAlign.center,
          style: const TextStyle(
            fontWeight: FontWeight.w300,
            fontSize: 16.0,
          ),
        ),
        backgroundColor: Colors.blueAccent,
        behavior: SnackBarBehavior.floating,
        elevation: 1.0,
        shape: RoundedRectangleBorder(
          borderRadius: BorderRadius.circular(50.0),
        ),
      ),
    );
  }
}

this is my Controller using GetX

import 'package:flutter/material.dart';
import 'package:flutter_local_notifications/flutter_local_notifications.dart';
import 'package:get/get.dart';
import 'package:youtube_player_flutter/youtube_player_flutter.dart';

class LiveController extends GetxController {

  late YoutubePlayerController controller;
  late TextEditingController idController;
  late TextEditingController seekToController;
  RxBool statusHD = false.obs;
  late PlayerState playerState;
  late YoutubeMetaData videoMetaData;
  double volume = 100;
  bool muted = false;
  bool isPlayerReady = false;
  final List<String> ids = [
    'nPt8bK2gbaU',
    'gQDByCdjUXw',
    'iLnmTe5Q2Qw',
    '_WoCV4c6XOE',
    'KmzdUe0RSJo',
    '6jZDSSZZxjQ',
    'p2lYr3vM_1w',
    '7QUtEmBT_-w',
    '34_PXCzGw1M',
  ];

  String videoId = '';

  onInit(){
    super.onInit();
  }


  @override
  void onClose() {
    // TODO: implement onClose
    controller.pause();
    super.onClose();
  }
  @override
  void dispose() {
    // TODO: implement dispose
    controller.dispose();
    idController.dispose();
    seekToController.dispose();
    super.dispose();
  }
  // @override
  // void deactivate() {
  //   // Pauses video while navigating to next page.
  //   super.deactivate();
  // }

  updateStatusHD(bool status){
    statusHD.value = status;
    print(status);
    update();
  }

}

this is the screenshot enter image description here

Can anyone help me?I am grateful if anyone can solve my problem

0

There are 0 answers