Video

添加 <video /> 标签，在 Kraken 内部嵌入一个 视频播放器。

快速使用

将 kraken_video_player 作为项目依赖添加到 pubspec.yaml 文件中。

在调用 runApp() 之前添加以下代码：

  1. import 'package:kraken_video_player/kraken_video_player.dart';
  3. void main() {
  4.   KrakenVideoPlayer.initialize();
  5.   runApp(MaterialApp(
  6.     title: 'Navigation Basics',
  7.     home: FirstRoute(),
  8.   ));
  9. }

示例

  1. function setElementStyle(dom, object) {
  2.   if (object == null) return;
  3.   for (let key in object) {
  4.     if (object.hasOwnProperty(key)) {
  5.       dom.style[key] = object[key];
  6.     }
  7.   }
  8. }
  10. function setAttributes(dom, object) {
  11.   for (const key in object) {
  12.     if (object.hasOwnProperty(key)) {
  13.       dom.setAttribute(key, object[key]);
  14.     }
  15.   }
  16. }
  18. const container1 = document.createElement('div');
  19. setElementStyle(container1, {
  20.   height: '500px',
  21. });
  23. document.body.appendChild(container1);
  25. const video = document.createElement('video');
  26. setElementStyle(video, {
  27.   width: '750px',
  28.   height: '400px',
  29. });
  31. setAttributes(video, {
  32.   autoPlay: true,
  33.   src:
  34.     'https://videocdn.taobao.com/oss/ali-video/1fa0c3345eb3433b8af7e995e2013cea/1458900536/video.mp4',
  35. });
  37. video.addEventListener('canplay', () => {
  38.   console.log('vide can play');
  39. });
  41. container1.appendChild(video);
  43. const pauseBtn = document.createElement('div');
  44. pauseBtn.appendChild(document.createTextNode('pause button'));
  45. pauseBtn.addEventListener('click', () => {
  46.   video.pause();
  47. });
  48. container1.appendChild(pauseBtn);
  50. const playBtn = document.createElement('div');
  51. playBtn.appendChild(document.createTextNode('playBtn button'));
  52. playBtn.addEventListener('click', () => {
  53.   video.play();
  54. });
  55. container1.appendChild(playBtn);

API

参考： 链接