一个简单的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)

// 继续

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上下载的,所以离线是看不到视频的。

运行效果图如下：