pip_flutter

A Flutter plugin for Android and ios for make video in picture in picture mode.


Picture in Picture Mode Flutter



Picture in Picture ModeDisable Picture in Picture Mode

A flutter package pip flutter which will help to put your video in pip mode.

Features 💚

  • Put your video in Picture in Picture mode.
  • Also mute sound and play and pause the video.
  • Make video in full screen mode,set play back speed of video

Installation

First, add pip_flutter as a dependency in your pubspec.yaml file.

Android

Add below permission in your AndroidManifest.xml file ,also specified picture in picture mode in your activity tag and add foreground service for when app is not in background that time app not kill and running in foregorund and also add update code of MainActivity.kt and add PipFlutterPlayerService.

    <uses-permission android:name="android.permission.INTERNET"/>
    <uses-permission android:name="android.permission.FOREGROUND_SERVICE" />
    
    <activity
            android:name=".MainActivity"
            android:supportsPictureInPicture="true"
            android:launchMode="singleTop"
            android:theme="@style/LaunchTheme"
            android:configChanges="orientation|keyboardHidden|keyboard|screenSize|smallestScreenSize|locale|layoutDirection|fontScale|screenLayout|density|uiMode"
            android:hardwareAccelerated="true"
            android:windowSoftInputMode="adjustResize"
            android:exported="true"/>
            
    <service
           android:name=".PipFlutterPlayerService"
           android:stopWithTask="false" />

IOS

In Xcode of your project set ios deployment info 11.0 and set in below code in your Info.plist file.

<key>NSAppTransportSecurity</key>
<dict>
<key>NSAllowsArbitraryLoads</key>
<true/>
</dict>
<key>NSBonjourServices</key>
<array>
<string>_dartobservatory._tcp</string>
</array>
<key>UIBackgroundModes</key>
<array>
<string>audio</string>
<string>processing</string>
<string>remote-notification</string>
</array>

How to use

  • PipFlutterPlayerConfiguration : Put this class for your video configuration.
PipFlutterPlayerConfiguration pipFlutterPlayerConfiguration =
const PipFlutterPlayerConfiguration(
  aspectRatio: 16 / 9,
  fit: BoxFit.contain,
);
  • PipFlutterPlayerDataSource : Put this class for declare your video type url and url.
PipFlutterPlayerDataSource dataSource = PipFlutterPlayerDataSource(
  PipFlutterPlayerDataSourceType.network,
  'http://commondatastorage.googleapis.com/gtv-videos-bucket/sample/BigBuckBunny.mp4',
);
  • PipFlutterPlayer :
PipFlutterPlayer(
controller: pipFlutterPlayerController,
key: pipFlutterPlayerKey,
),
  • Make your video in Pip mode put this code on your onTap.
pipFlutterPlayerController.enablePictureInPicture(pipFlutterPlayerKey);
  • And make your video in disable mode put this code on your onTap.
pipFlutterPlayerController.disablePictureInPicture();

Run the example app in the exmaple folder to find out more about how to use it.

Libraries

drm_init_data
exception
format
hls_master_playlist
hls_media_playlist
hls_playlist_parser
hls_track_metadata_entry
metadata
method_channel_video_player
mime_types
pipflutter_player
pipflutter_player_asms_audio_track
pipflutter_player_asms_data_holder
pipflutter_player_asms_subtitle
pipflutter_player_asms_subtitle_segment
pipflutter_player_asms_track
pipflutter_player_asms_utils
pipflutter_player_buffering_configuration
pipflutter_player_cache_configuration
pipflutter_player_clickable_widget
pipflutter_player_configuration
pipflutter_player_controller
pipflutter_player_controller_event
pipflutter_player_controller_provider
pipflutter_player_controls_configuration
pipflutter_player_controls_state
pipflutter_player_cupertino_controls
pipflutter_player_cupertino_progress_bar
pipflutter_player_dash_utils
pipflutter_player_data_source
pipflutter_player_data_source_type
pipflutter_player_drm_configuration
pipflutter_player_drm_type
pipflutter_player_event
pipflutter_player_event_type
pipflutter_player_hls_utils
pipflutter_player_material_controls
pipflutter_player_material_progress_bar
pipflutter_player_multiple_gesture_detector
pipflutter_player_notification_configuration
pipflutter_player_overflow_menu_item
pipflutter_player_playlist_configuration
pipflutter_player_progress_colors
pipflutter_player_subtitle
pipflutter_player_subtitles_configuration
pipflutter_player_subtitles_drawer
pipflutter_player_subtitles_factory
pipflutter_player_subtitles_source
pipflutter_player_subtitles_source_type
pipflutter_player_theme
pipflutter_player_translations
pipflutter_player_utils
pipflutter_player_video_format
pipflutter_player_with_controls
playlist
rendition
scheme_data
segment
util
variant
variant_info
video_player
video_player_platform_interface