一个简单的Silverlight视频播放器

下面就来制作一个简易的视频播放器：

1、在XMAL页面中添加一个MediaElement，用以容纳视频文件。

2、拖放一个Slider，用来实时显示视频播放进度。

3、一个TextBlock，用来显示当前播放的时间值。

4、一个TextBlock，用来显示视频的总时间。

5、五个按钮，分别用来进行播放、暂停、继续、停止、全屏操作。

6、一个CheckBox，用来控制静音操作。

7、一个Slider，用来控制媒体音量。

 

以下是文件代码：

<UserControl xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" x:Class="VideoPaly.MainPage" Width="640" Height="480"> <Grid x:Name="LayoutRoot" Background="Gray"> <Canvas Margin="34,23,38,63"> <MediaElement x:Name="media" Source="http://download.microsoft.com/download/2/0/5/205d8c39-3d55-4032-8195-7b0e6eda4cb6/WinVideo-SL-InstallExperience.wmv" Height="248" Width="542" Canvas.Left="10" Canvas.Top="8" BufferingProgressChanged="media_BufferingProgressChanged" Loaded="media_Loaded"/> <Slider x:Name="slider1" Height="21" Width="550" Canvas.Left="10" Canvas.Top="260" ValueChanged="Slider_ValueChanged" Maximum="10" SmallChange="1"/> <Button x:Name="btnPlay" Height="25" Width="57" Canvas.Left="151" Canvas.Top="324" Content="Play" Click="btnPlay_Click"/> <Button x:Name="btnPause" Height="25" Width="57" Canvas.Left="212" Canvas.Top="324" Content="Pause" Click="btnPause_Click"/> <Button x:Name="btnResume" Height="25" Width="57" Canvas.Left="273" Canvas.Top="324" Content="Resume" Click="btnResume_Click"/> <Button x:Name="btnStop" Height="25" Width="57" Canvas.Left="334" Canvas.Top="324" Content="Stop" Click="btnStop_Click"/> <TextBlock x:Name="tbCurrentTime" Height="25" Width="90" Canvas.Left="22" Canvas.Top="281" TextWrapping="Wrap"/> <TextBlock x:Name="tbTotalTime" Height="25" Width="91" Canvas.Left="505" Canvas.Top="281" TextWrapping="Wrap"/> <CheckBox x:Name="cbSilent" Canvas.Left="526" Canvas.Top="369" Content="静音" RenderTransformOrigin="0.881,0.235" Checked="cbSilent_Checked" Unchecked="cbSilent_Unchecked"/> <TextBlock x:Name="tbBufferingdValue" Height="55" Width="171" Canvas.Left="213" Canvas.Top="111" TextWrapping="Wrap" FontSize="18.667"/> <Slider x:Name="sliderVolumn" Height="74" Width="36" Canvas.Left="486" Canvas.Top="312" Orientation="Vertical" ValueChanged="sliderVolumn_ValueChanged" Maximum="1" LargeChange="0.2"/> <Button x:Name="btnFullScreen" Height="25" Width="57" Canvas.Left="395" Canvas.Top="324" Content="FullScreen" Click="btnFullScreen_Click"/> </Canvas> </Grid> </UserControl>  

using System; using System.Windows; using System.Windows.Controls; using System.Windows.Documents; using System.Windows.Ink; using System.Windows.Input; using System.Windows.Media; using System.Windows.Media.Animation; using System.Windows.Shapes; using System.Windows.Threading; namespace VideoPaly { public partial class MainPage : UserControl { //使用计时器对象来更新播放进度 private DispatcherTimer timer = new DispatcherTimer(); // 媒体的时长 private TimeSpan duration; public MainPage() { // 为初始化变量所必需 InitializeComponent(); } private void btnPlay_Click(object sender, System.Windows.RoutedEventArgs e) { // 播放 media.Play(); } private void btnPause_Click(object sender, System.Windows.RoutedEventArgs e) { // 暂停 media.Pause(); } private void btnResume_Click(object sender, System.Windows.RoutedEventArgs e) { // 继续 media.Play(); } private void btnStop_Click(object sender, System.Windows.RoutedEventArgs e) { //停止 media.Stop(); } private void cbSilent_Checked(object sender, System.Windows.RoutedEventArgs e) { // 静音 media.IsMuted = true; } private void cbSilent_Unchecked(object sender, System.Windows.RoutedEventArgs e) { // 不静音 media.IsMuted = false; } private void Slider_ValueChanged(object sender, System.Windows.RoutedPropertyChangedEventArgs<double> e) { //确定多媒体对象的播放位置是否处于可管理状态 if (media.CanSeek) { //重新设置MediaElement的播放位置 media.Position = TimeSpan.FromSeconds((media.NaturalDuration.TimeSpan.TotalSeconds*slider1.Value)/10); } } private void media_BufferingProgressChanged(object sender, System.Windows.RoutedEventArgs e) { // 视频缓冲事件 double bufferingValue = this.media.BufferingProgress * 100; this.tbBufferingdValue.Text = "缓冲 : " + bufferingValue.ToString() + "%"; if(this.tbBufferingdValue.Text=="缓冲 : 100%") { //隐藏缓冲值 this.tbBufferingdValue.Visibility = Visibility.Collapsed; } } private void media_Loaded(object sender, System.Windows.RoutedEventArgs e) { //设置事件引发的时间间隔 timer.Interval = TimeSpan.FromMilliseconds(500); //计时器对象事件 timer.Tick += new EventHandler(timer_Tick); //开始计时 timer.Start(); //设置音量 media.Volume = 0.8; sliderVolumn.Value = 0.8; } private void timer_Tick(object sender, System.EventArgs e) { //当前处于播放时有效 if (this.media.CurrentState == MediaElementState.Playing) { duration = media.NaturalDuration.HasTimeSpan ? media.NaturalDuration.TimeSpan : TimeSpan.FromMilliseconds(0); this.tbCurrentTime.Text = string.Format("{0}:{1}:{2}", media.Position.Hours < 10 ? "0" + media.Position.Hours.ToString() : media.Position.Hours.ToString(), media.Position.Minutes < 10 ? "0" + media.Position.Minutes.ToString() : media.Position.Minutes.ToString(), media.Position.Seconds < 10 ? "0" + media.Position.Seconds.ToString() : media.Position.Seconds.ToString()); this.tbTotalTime.Text = string.Format( "{0}{1:00}:{2:00}:{3:00}", "时长：", duration.Hours, duration.Minutes, duration.Seconds); //跳过事件处理程序 slider1.ValueChanged -= new RoutedPropertyChangedEventHandler<double>(Slider_ValueChanged); //计算并设置Slider的百分比 slider1.Value = (media.Position.TotalSeconds / media.NaturalDuration.TimeSpan.TotalSeconds) * 10; //重新声明ValueChanged事件 slider1.ValueChanged += new RoutedPropertyChangedEventHandler<double>(Slider_ValueChanged); } } private void sliderVolumn_ValueChanged(object sender, System.Windows.RoutedPropertyChangedEventArgs<double> e) { // 音量发生改变触发事件 media.Volume = sliderVolumn.Value; } private void btnFullScreen_Click(object sender, System.Windows.RoutedEventArgs e) { // 全屏操作 Application.Current.Host.Content.IsFullScreen = !Application.Current.Host.Content.IsFullScreen; } } }

以上代码，拷贝粘贴，可以直接运行，但是因为视频文件时从Microsoft上下载的,所以离线是看不到视频的。

 

 

运行效果图如下：