如何在WP7中播放嵌入式视频 - Phonegap？

我需要在WP7 phonegap应用程序中播放嵌入式视频文件。该文件（dizzy.mp4）位于www文件夹与以下布局如何在WP7中播放嵌入式视频 - Phonegap？

<!DOCTYPE html> 
<html> 
<head> 
    <meta name="viewport" content="width=device-width, height=device-height, initial-scale=1.0, maximum-scale=1.0, user-scalable=no;" /> 
    <meta http-equiv="Content-type" content="text/html; charset=utf-8" /> 
    <title>PhoneGap WP7</title> 
    <link rel="stylesheet" href="master.css" type="text/css" /> 
    <script type="text/javascript" charset="utf-8" src="phonegap-1.4.1.js"></script> 
    <script type="text/javascript" charset="utf-8" src="jquery-1.6.4.min.js"></script> 
</head> 
<body> 
    <video onclick="play()"> 
     <source src="http://html5demos.com/assets/dizzy.mp4" type="video/mp4" /> 
    </video> 
    <video onclick="play()"> 
     <source src="./dizzy.mp4" type="video/mp4" /> 
    </video> 
</body> 
</html>

如果点击第一视频元素，该视频文件从互联网上下载，一切都OK一起。但是在点击第二个（本地视频）后，只有带有'Opening ...'标签的视频播放器屏幕出现。这两个视频都是相同的视频文件。

该应用程序在模拟器和真实设备（带有WF7.5芒果的诺基亚Lumnia 710）上运行，结果是相同的。

我试着为视频文件设置不同的构建动作：内容，资源，嵌入式资源。它没有帮助。

如何使它工作？

更新：类似的问题描述为here。这是一个WP7的错误？

来源

2012-02-17 Andrei Schneider

100％不是WP7的错误。它是一个Phonegap甚至是HTML5的错误。 – MyKuLLSKI 2012-02-20 19:23:18

这是一种解决方法。以下代码是实现视频回放功能的Phonegap命令。

using System; 
using System.IO; 
using System.IO.IsolatedStorage; 
using System.Runtime.Serialization; 
using System.Windows; 
using System.Windows.Controls; 
using Microsoft.Phone.Controls; 
using WP7GapClassLib.PhoneGap; 
using WP7GapClassLib.PhoneGap.Commands; 
using WP7GapClassLib.PhoneGap.JSON; 

namespace PhoneGap.Extension.Commands 
{ 

    /// <summary> 
    /// Implements video play back functionality. 
    /// </summary> 
    public class Video : BaseCommand 
    { 

     /// <summary> 
     /// Video player object 
     /// </summary> 
     private MediaElement _player; 

     [DataContract] 
     public class VideoOptions 
     { 
      /// <summary> 
      /// Path to video file 
      /// </summary> 
      [DataMember(Name = "src")] 
      public string Src { get; set; } 
     } 

     public void Play(string args) 
     { 
      VideoOptions options = JsonHelper.Deserialize<VideoOptions>(args); 

      Deployment.Current.Dispatcher.BeginInvoke(() => 
      { 
       try 
       { 
        _Play(options.Src); 

        DispatchCommandResult(new PluginResult(PluginResult.Status.OK)); 
       } 
       catch (Exception e) 
       { 
        DispatchCommandResult(new PluginResult(PluginResult.Status.ERROR, e.Message)); 
       } 
      }); 
     } 

     private void _Play(string filePath) 
     { 
      // this.player is a MediaElement, it must be added to the visual tree in order to play 
      PhoneApplicationFrame frame = Application.Current.RootVisual as PhoneApplicationFrame; 
      if (frame != null) 
      { 
       PhoneApplicationPage page = frame.Content as PhoneApplicationPage; 
       if (page != null) 
       { 
        Grid grid = page.FindName("LayoutRoot") as Grid; 
        if (grid != null && _player == null) 
        { 
         _player = new MediaElement(); 
         grid.Children.Add(this._player); 
         _player.Visibility = Visibility.Visible; 
        } 
       } 
      } 

      Uri uri = new Uri(filePath, UriKind.RelativeOrAbsolute); 
      if (uri.IsAbsoluteUri) 
      { 
       _player.Source = uri; 
      } 
      else 
      { 
       using (IsolatedStorageFile isoFile = IsolatedStorageFile.GetUserStoreForApplication()) 
       { 
        if (isoFile.FileExists(filePath)) 
        { 
         using (
          IsolatedStorageFileStream stream = new IsolatedStorageFileStream(filePath, FileMode.Open, 
                          isoFile)) 
         { 
          _player.SetSource(stream); 
         } 
        } 
        else 
        { 
         throw new ArgumentException("Source doesn't exist"); 
        } 
       } 
      } 

      _player.Play(); 
     } 
    } 

}

这里只有播放功能，但它可以扩展为支持停止/暂停/关闭等。

要在客户端注册这个命令：

<script type="text/javascript"> 

    function playVideo(src) { 

     PhoneGap.exec(  //PhoneGap.exec = function(success, fail, service, action, args) 
      null, //success 
      null, //fail 
      "Video", //service 
      "Play", //action 
      {src: src} //args 
      ); 
    }; 
    </script>

要播放的文件：对路径 '/app/www/dizzy.mp4'

<a href="#" class="btn" onClick="playVideo('/app/www/dizzy.mp4');">Play</a>

留意。

来源

2012-02-21 15:02:24

嘿安德烈施耐德，我有一个问题，你的解决方法。你在哪里保存视频？您是否将其复制到独立的存储中？或者是您应用的www文件夹中的视频？你究竟如何实现你的插件到项目中？我已经将视频保存在应用程序中并使用您的代码，但在调用phonegap.exec（...）时代码失败。如果你能回答这些问题，那将是非常棒的！提前致谢。 – DrLudwig3 2012-03-05 15:52:32

嘿DrLudwig3，看看Phonegap项目中的GapSourceDictionary.xml文件。它包含一个文件列表。 PGView类中有一个GapBrowser_Loaded方法。在这个方法内部，GapSourceDictionary.xml被加载，解析。这些文件被加载到独立存储中。 – 2012-03-05 21:52:28

如果你愿意，给我发电子邮件。我会在接下来的12个小时内向您发送我的测试项目的源代码。 – 2012-03-05 21:55:07

我实现了播放音乐的功能，在Android平台的PhoneGap，和我的代码快照如下： HTML代码：

<a href="#" class="btn large" onclick="playAudio('/android_asset/www/music/noya_wyt.mp3');">Play Audio</a>

JavaScript代码：

function playAudio(src) { 
     // Create Media object from src 
     my_media = new Media(src, onSuccess, onError); 

     // Play audio 
     my_media.play(); 
}

而且我认为你可以更改您的视频“src”路径，然后重试。如果应用程序仍然无法正常工作，您可以尝试调用phonegap媒体API进行实施。

来源

2012-02-21 02:35:46

谢谢@Kidd Y，我用你的想法来创建一个解决方法。 – 2012-02-21 15:04:19

如何在WP7中播放嵌入式视频 - Phonegap？

回答

相关问题