We have implemented a cross-platform video player, which provides a seamless video playback experience.
- video_player for Android, iOS, and web.
- media_kit for desktop platforms.
👋 👉 Complete documentation here
Feature | iOS | Android | Windows | Linux | macOS | Web |
---|---|---|---|---|---|---|
Videos from Network | ✔️ | ✔️ | ✔️ | ✔️ | ✔️ | ✔️ |
Videos from Assets | ✔️ | ✔️ | ✔️ | ✔️ | ✔️ | ✔️ |
Videos from Local Files | ✔️ | ✔️ | ✔️ | ✔️ | ✔️ | ✔️ |
Looping | ✔️ | ✔️ | ✔️ | ✔️ | ✔️ | ✔️ |
AutoPlay | ✔️ | ✔️ | ✔️ | ✔️ | ✔️ | ✔️ |
Swipe to Control Volume | ✔️ | ✔️ | Keyboard Arrows | Keyboard Arrows | Keyboard Arrows | Keyboard Arrows |
Swipe to Seek | ✔️ | ✔️ | Keyboard Arrows | Keyboard Arrows | Keyboard Arrows | Keyboard Arrows |
FullScreen | ✔️ | ✔️ | ✔️ | ✔️ | ✔️ | ✔️ |
Launch Player in FullScreen | ✔️ | ✔️ | ✔️ | ✔️ | ✔️ | ✔️ |
Playback Speed | ✔️ | ✔️ | ✔️ | ✔️ | ✔️ | ✔️ |
Fast Forward/Rewind | ✔️ | ✔️ | ✔️ | ✔️ | ✔️ | ✔️ |
SRT Subtitles | ✔️ | ✔️ | ✔️ | ✔️ | ✔️ | ✔️ |
Customization | Partially | Partially | Partially | Partially | Partially | Partially |
Picture in Picture (PIP) | Not Implemented (Help Wanted) | ✔️ | ✔️ | Implemented (Not tested) | Implemented (Crashes, waiting for window_manager release, fixed in GitHub) | Not Implemented |
- Swipe horizontally to seek forward or backward in the video. (seekSwipes)
- Swipe vertically on the right side of the screen to control the video volume. (volumeSwipes)
- Swipe vertically on the left side of the screen to control the video brightness. (brightnessSwipes)
- Double-tap on the sides of the screen to seek forward or backward in the video. (doubleTapToSeek)
- Long press on the screen to speed up the video, and the video slows down when the long press is released. (onLongPressSpeedUp)
- One-click with the mouse to toggle play and pause. (desktopTapToPlayAndPause)
- Double-click with the mouse to toggle full-screen mode. (desktopDoubleTapToFullScreen)
- Use the keyboard up and down arrows to increase or decrease the video volume. (volumeArrows)
- Use the keyboard right and left arrows to seek forward or backward in the video. (seekArrows)
- Press the Escape key to close full-screen mode. (escapeKeyCloseFullScreen)
- Press the NumPad Decimal key (.) to toggle the video fit. (numPadDecimalKeyToggleFit)
- Press the Enter key to open full-screen mode. (enterKeyOpensFullScreen)
- Press the Space key to toggle between playing and pausing the video. (spaceKeyTogglePlay)
void main() {
initMeeduPlayer();
runApp(MyApp());
}
Everything ready.
System shared libraries from distribution specific user-installed packages are used by-default. You can install these as follows.
sudo apt install libmpv-dev mpv
There are other ways to bundle these within your app package e.g. within Snap or Flatpak. Few examples:
Everything ready.
The minimum supported macOS version is 11.0,set MACOSX_DEPLOYMENT_TARGET = 11.0 macos\Runner.xcodeproj\project.pbxproj
Also, during the build phase, the following warnings are not critical and cannot be silenced:
#import "Headers/media_kit_video-Swift.h"
^
/path/to/media_kit/media_kit_test/build/macos/Build/Products/Debug/media_kit_video/media_kit_video.framework/Headers/media_kit_video-Swift.h:270:31: warning: 'objc_ownership' only applies to Objective-C object or block pointer types; type here is 'CVPixelBufferRef' (aka 'struct __CVBuffer *')
- (CVPixelBufferRef _Nullable __unsafe_unretained)copyPixelBuffer SWIFT_WARN_UNUSED_RESULT;
# 1 "<command line>" 1
^
<command line>:20:9: warning: 'POD_CONFIGURATION_DEBUG' macro redefined
#define POD_CONFIGURATION_DEBUG 1 DEBUG=1
^
#define POD_CONFIGURATION_DEBUG 1
^
- The minimum supported iOS version is 13.0, so the target needs to be set IPHONEOS_DEPLOYMENT_TARGET to 13.0 in
ios\Runner.xcodeproj\project.pbxproj
- Just add this package in case you set iosUseMediaKit to true in initMeeduPlayer
dependencies:
...
media_kit_libs_ios_video: ^1.0.4 # iOS package for video (& audio) native libraries.
Also, software rendering is forced in the iOS simulator, due to an incompatibility with OpenGL ES.
- Just add this package in case you set androidUseMediaKit to true in initMeeduPlayer
dependencies:
...
media_kit_libs_android_video: ^1.0.3 # Android package for video native libraries.
Add to pubspec.yaml
video_player_web_hls: ^1.0.0+3
Add
<script src="https://cdn.jsdelivr.net/npm/hls.js@latest" type="application/javascript"></script>
in index.html above
<script src="main.dart.js" type="application/javascript"></script>
or above
<script src="flutter.js" defer></script>