2 Best Picture-In-Picture Libraries for Flutter

Picture-In-Picture (PIP) is a special type of multi-window mode mostly used for video playback. This mode display a popup in the corner which plays a video,

PIP is a new feature which only works on new version of Android and iOS.

flutter_android_pip

This plugin is a simple Picture in picture mode for Flutter on Android with SDK > 24.

RaisedButton(
  child: Text("Enter PIP"),
  onPressed: () {
    FlutterAndroidPip.enterPictureInPictureMode;
  },
)

easy_pip

This widget is used for creating a Picture-In-Picture interface in Flutter like YouTube interface.

After install easy_pip in pubspec.yaml, you can start using PIPStack widget to enable PIP. This widget has three elements:

1. Background Widget (Displays behind the pip widget)
2. PIP Widget (The widget which shrinks to go into PIP mode)
3. PIP Expanded Content (The content below the PIP widget when the widget is expanded)

var isEnabled = true; //add this variable to determine state

PIPStack(
  backgroundWidget: Center(
    child: RaisedButton(
      onPressed: () {
        setState(() {
          isEnabled = !isEnabled;
        });
      },
      child: Text("Click here to enable PIP"),
    ),
  ),
  pipWidget: isEnabled
      ? Container(
    color: Colors.pink,
  )
      : Container(),
  pipEnabled: isEnabled,
  pipExpandedContent: Card(
    color: Colors.white,
    child: Column(
      children: <Widget>[Text("Hello World"), Row()],
    ),
  ),
  onClosed: () {
    setState(() {
      isEnabled = !isEnabled;
    });
  },
)