youtube_player_flutter 🚀 - [バグ]フルスクリーンは純粋なフルスクリーン機能ではありません。

こんにちは@princeteck。同様の問題があり、ブール変数を追加してフルスクリーンを使用しているかどうかを確認することで問題を解決できたので、フルスクリーンを使用しているときにAppBarをnullに変更できます。また、フルスクリーンでフルスクリーンを終了するときに戻るボタンを押す処理を行うWillPopScopeウィジェットを追加しました。これが私の最終ファイルです。パラメータとしてライブオブジェクトを受け取ります。

class LiveDetail extends StatefulWidget {
  final Live live;

  LiveDetail({
    Key key,
    <strong i="8">@required</strong> this.live,
  }) : super(key: key);

  <strong i="9">@override</strong>
  _LiveDetailState createState() => _LiveDetailState();
}

class _LiveDetailState extends State<LiveDetail> {
  YoutubePlayerController _controller;

  bool showAppBar = true;

  <strong i="10">@override</strong>
  void initState() {
    _controller = YoutubePlayerController(
      initialVideoId: widget.live.videoId,
      flags: YoutubePlayerFlags(autoPlay: true, isLive: widget.live.isLive, controlsVisibleAtStart: true),
    );
    super.initState();
  }

  Future<bool> _onWillPop() {
    if (_controller.value.isFullScreen) {
      _controller.toggleFullScreenMode();
    } else {
      Navigator.pop(context);
    }
  }

  <strong i="11">@override</strong>
  Widget build(BuildContext context) {
    return WillPopScope(
      onWillPop: _onWillPop,
      child: MaterialApp(
        title: 'Live',
        theme: ThemeData(primaryColor: Color(CustomColors.grena)),
        debugShowCheckedModeBanner: false,
        home: Scaffold(
            appBar: showAppBar
                ? AppBar(
                    title: Text(widget.live.title),
                    leading: new IconButton(
                      icon: new Icon(Icons.arrow_back),
                      onPressed: () {
                        Navigator.pop(context);
                      },
                    ),
                  )
                : null,
            body: Container(
              child: YoutubePlayerBuilder(
                player: YoutubePlayer(controller: _controller),
                builder: (context, player) {
                  return Column(
                    children: <Widget>[player],
                  );
                },
                onEnterFullScreen: () {
                  setState(() {
                    showAppBar = false;
                  });
                },
                onExitFullScreen: () {
                  setState(() {
                    showAppBar = true;
                  });
                },
              ),
            )),
      ),
    );
  }
}

GitDoGui 2020年07月01日

👍2

足場をYoutubePlayerBuilderの下に置くだけです

sarbagyastha 2020年07月01日

👍4 👎2

足場をYoutubePlayerBuilderの下に置くだけです

これはうまくいくようですが、今私が直面している新しい問題が1つあります。ビデオはライブデバイスでテストするとトリミングされますが、iOSシミュレーターでは正しく表示されます。アスペクト比がめちゃくちゃだと思います。

princeteck 2020年07月01日

こんにちは@princeteck。同様の問題があり、ブール変数を追加してフルスクリーンを使用しているかどうかを確認することで問題を解決できたので、フルスクリーンを使用しているときにAppBarをnullに変更できます。また、フルスクリーンでフルスクリーンを終了するときに戻るボタンを押す処理を行うWillPopScopeウィジェットを追加しました。これが私の最終ファイルです。パラメータとしてライブオブジェクトを受け取ります。

class LiveDetail extends StatefulWidget {
  final Live live;

  LiveDetail({
    Key key,
    <strong i="9">@required</strong> this.live,
  }) : super(key: key);

  <strong i="10">@override</strong>
  _LiveDetailState createState() => _LiveDetailState();
}

class _LiveDetailState extends State<LiveDetail> {
  YoutubePlayerController _controller;

  bool showAppBar = true;

  <strong i="11">@override</strong>
  void initState() {
    _controller = YoutubePlayerController(
      initialVideoId: widget.live.videoId,
      flags: YoutubePlayerFlags(autoPlay: true, isLive: widget.live.isLive, controlsVisibleAtStart: true),
    );
    super.initState();
  }

  Future<bool> _onWillPop() {
    if (_controller.value.isFullScreen) {
      _controller.toggleFullScreenMode();
    } else {
      Navigator.pop(context);
    }
  }

  <strong i="12">@override</strong>
  Widget build(BuildContext context) {
    return WillPopScope(
      onWillPop: _onWillPop,
      child: MaterialApp(
        title: 'Live',
        theme: ThemeData(primaryColor: Color(CustomColors.grena)),
        debugShowCheckedModeBanner: false,
        home: Scaffold(
            appBar: showAppBar
                ? AppBar(
                    title: Text(widget.live.title),
                    leading: new IconButton(
                      icon: new Icon(Icons.arrow_back),
                      onPressed: () {
                        Navigator.pop(context);
                      },
                    ),
                  )
                : null,
            body: Container(
              child: YoutubePlayerBuilder(
                player: YoutubePlayer(controller: _controller),
                builder: (context, player) {
                  return Column(
                    children: <Widget>[player],
                  );
                },
                onEnterFullScreen: () {
                  setState(() {
                    showAppBar = false;
                  });
                },
                onExitFullScreen: () {
                  setState(() {
                    showAppBar = true;
                  });
                },
              ),
            )),
      ),
    );
  }
}

ただし、setstateはウィジェットを再構築します。つまり、onEnterFullScreenおよびonExitFullScreenコールバックがトリガーされると、ビデオが何度も再起動します。

Luktm 2020年08月17日

👍1

足場をYoutubePlayerBuilderの下に置くだけです

この問題を再度開いて申し訳ありませんが、この回避策を使用したところ、@ princeteckと同じ結果が得られました。ビデオがトリミングされているため、すべてのキャプションが表示されません。

誰かがこれに対する解決策を持っているなら、それは素晴らしいでしょう:)

Akiat 2021年01月17日

フルスクリーンの場合、このプラグインスケーリングプレーヤーが原因で問題が発生しています。手動スケーリングを削除することで、この問題を解決することができました。

この問題を解決する手順：-

プラグインの以下のファイルをプロジェクトにコピーします（プラグインコードを変更できるようにします）。

次に、コピーしたyoutube_player.dartに移動してbuildPlayer（）メソッドに移動し、階層からTransform.scaleウィジェット（RawYoutubePlayerの親ウィジェット）を削除して、RawYoutubePlayerを直接使用します。ビデオを拡大縮小したくないので、これで問題は解決します。 buildPlayer（）メソッドが前後にどのように見えるかについてのより良いコンテキストについては、添付のスクリーンショットをご覧ください。

NileshRathore 2021年03月01日

👎1 👍1

こんにちは@princeteck。同様の問題があり、ブール変数を追加してフルスクリーンを使用しているかどうかを確認することで問題を解決できたので、フルスクリーンを使用しているときにAppBarをnullに変更できます。また、フルスクリーンでフルスクリーンを終了するときに戻るボタンを押す処理を行うWillPopScopeウィジェットを追加しました。これが私の最終ファイルです。パラメータとしてライブオブジェクトを受け取ります。

class LiveDetail extends StatefulWidget {
  final Live live;

  LiveDetail({
    Key key,
    <strong i="9">@required</strong> this.live,
  }) : super(key: key);

  <strong i="10">@override</strong>
  _LiveDetailState createState() => _LiveDetailState();
}

class _LiveDetailState extends State<LiveDetail> {
  YoutubePlayerController _controller;

  bool showAppBar = true;

  <strong i="11">@override</strong>
  void initState() {
    _controller = YoutubePlayerController(
      initialVideoId: widget.live.videoId,
      flags: YoutubePlayerFlags(autoPlay: true, isLive: widget.live.isLive, controlsVisibleAtStart: true),
    );
    super.initState();
  }

  Future<bool> _onWillPop() {
    if (_controller.value.isFullScreen) {
      _controller.toggleFullScreenMode();
    } else {
      Navigator.pop(context);
    }
  }

  <strong i="12">@override</strong>
  Widget build(BuildContext context) {
    return WillPopScope(
      onWillPop: _onWillPop,
      child: MaterialApp(
        title: 'Live',
        theme: ThemeData(primaryColor: Color(CustomColors.grena)),
        debugShowCheckedModeBanner: false,
        home: Scaffold(
            appBar: showAppBar
                ? AppBar(
                    title: Text(widget.live.title),
                    leading: new IconButton(
                      icon: new Icon(Icons.arrow_back),
                      onPressed: () {
                        Navigator.pop(context);
                      },
                    ),
                  )
                : null,
            body: Container(
              child: YoutubePlayerBuilder(
                player: YoutubePlayer(controller: _controller),
                builder: (context, player) {
                  return Column(
                    children: <Widget>[player],
                  );
                },
                onEnterFullScreen: () {
                  setState(() {
                    showAppBar = false;
                  });
                },
                onExitFullScreen: () {
                  setState(() {
                    showAppBar = true;
                  });
                },
              ),
            )),
      ),
    );
  }
}

または、AppBarのtoolbarHeightパラメータのみを変更できます

56はデフォルト値です

AppBar(
        title: Text('Your title'),
        toolbarHeight: _fullScreen ? 0 : 56,
),

biel-correa 2021年04月27日

Youtube_player_flutter: [バグ]フルスクリーンは純粋なフルスクリーン機能ではありません。

最も参考になるコメント

全てのコメント7件

関連する問題