设计silverlight的MediaPlay控件--silverlight(银光)学习(3)
大家都知道silverlight里用了获得艾美奖的新的视频编解码技术。视频质量无论从移动设备还是桌面浏览器都可以达到720p HDTV video模式。如果能用silverlight技术设计一个视频网站估计客户体验很不错的。
那我们就开始做一个最简单的MediaPlayer控件,能动态的传入视频的URI参数,还能控制视频的播放。
在上次我们建的silverlight控件类库项目里添加一个新的silverlight控件----MediaPlayControl.xaml.
做一个媒体播放器,难就难在界面设计上。如果要设计的简陋话,只需要在xaml文件里放上一个MediaElement和几个TextBlock就可以了,不过这样实在太丑陋了。我就用了Microsoft Expression Encoder 里面媒体播放器的界面,效果如下:
![](/images/cnblogs_com/wangergo/silverlightControl8.JPG)
中间带摄像机图标的就是MediaElement ,几个按钮是由Canvas组成的。代码过长,请下载该文件
/Files/wangergo/MediaPlayControl.rar
那么如何控制视频的播放呢,这主要跟MediaElement有关系。
MediaElement有一个重要的属性是Source,它是指所要播放的媒体文件的Uri,也就是媒体文件的地址。
还有几个重要方法:Pause--暂停播放, Play--播放, Stop--停止.
xaml文件对应的.cs文件代码如下:
然后我们在上次建的silverlight项目里的page.xaml.cs文件的page_loaded事件里调用我们做的控件。
具体silverlight控件库和silverlight项目如何建,请看
设计一个silverlight的Button控件--silverlight(闪光)学习(1)
那我们就开始做一个最简单的MediaPlayer控件,能动态的传入视频的URI参数,还能控制视频的播放。
在上次我们建的silverlight控件类库项目里添加一个新的silverlight控件----MediaPlayControl.xaml.
做一个媒体播放器,难就难在界面设计上。如果要设计的简陋话,只需要在xaml文件里放上一个MediaElement和几个TextBlock就可以了,不过这样实在太丑陋了。我就用了Microsoft Expression Encoder 里面媒体播放器的界面,效果如下:
中间带摄像机图标的就是MediaElement ,几个按钮是由Canvas组成的。代码过长,请下载该文件
/Files/wangergo/MediaPlayControl.rar
那么如何控制视频的播放呢,这主要跟MediaElement有关系。
MediaElement有一个重要的属性是Source,它是指所要播放的媒体文件的Uri,也就是媒体文件的地址。
还有几个重要方法:Pause--暂停播放, Play--播放, Stop--停止.
xaml文件对应的.cs文件代码如下:
1
/// <summary>
2
/// Desc:媒体播放器控件
3
/// Author:williams
4
/// Date:2007-9-27
5
/// </summary>
6
public class MediaPlayControl : Control
7
{
8
9
私有变量
18
19
公有属性
31
32
构造函数
63
64
公有方法
74
}
![](/Images/OutliningIndicators/ExpandedBlockStart.gif)
2
![](/Images/OutliningIndicators/InBlock.gif)
3
![](/Images/OutliningIndicators/InBlock.gif)
4
![](/Images/OutliningIndicators/InBlock.gif)
5
![](/Images/OutliningIndicators/ExpandedBlockEnd.gif)
6
![](/Images/OutliningIndicators/None.gif)
7
![](/Images/OutliningIndicators/ExpandedBlockStart.gif)
8
![](/Images/OutliningIndicators/InBlock.gif)
9
![](/Images/OutliningIndicators/ContractedSubBlock.gif)
18
![](/Images/OutliningIndicators/InBlock.gif)
19
![](/Images/OutliningIndicators/ContractedSubBlock.gif)
31
![](/Images/OutliningIndicators/InBlock.gif)
32
![](/Images/OutliningIndicators/ContractedSubBlock.gif)
63
![](/Images/OutliningIndicators/InBlock.gif)
64
![](/Images/OutliningIndicators/ContractedSubBlock.gif)
74
![](/Images/OutliningIndicators/ExpandedBlockEnd.gif)
然后我们在上次建的silverlight项目里的page.xaml.cs文件的page_loaded事件里调用我们做的控件。
1
public void Page_Loaded(object o, EventArgs e)
2
{
3
// Required to initialize variables
4
InitializeComponent();
5
6
double top = 100;
7
8
double left = 20;
9
10
MediaPlayControl media = new MediaPlayControl();
11![](/Images/OutliningIndicators/InBlock.gif)
12
media.MediaUrl = "wow.wmv";
13![](/Images/OutliningIndicators/InBlock.gif)
14
media.SetValue<double>(Canvas.TopProperty, top);
15![](/Images/OutliningIndicators/InBlock.gif)
16
media.SetValue<double>(Canvas.LeftProperty, left);
17
18
this.Children.Add(media);
19
}
![](/Images/OutliningIndicators/None.gif)
2
![](/Images/OutliningIndicators/ExpandedBlockStart.gif)
3
![](/Images/OutliningIndicators/InBlock.gif)
4
![](/Images/OutliningIndicators/InBlock.gif)
5
![](/Images/OutliningIndicators/InBlock.gif)
6
![](/Images/OutliningIndicators/InBlock.gif)
7
![](/Images/OutliningIndicators/InBlock.gif)
8
![](/Images/OutliningIndicators/InBlock.gif)
9
![](/Images/OutliningIndicators/InBlock.gif)
10
![](/Images/OutliningIndicators/InBlock.gif)
11
![](/Images/OutliningIndicators/InBlock.gif)
12
![](/Images/OutliningIndicators/InBlock.gif)
13
![](/Images/OutliningIndicators/InBlock.gif)
14
![](/Images/OutliningIndicators/InBlock.gif)
15
![](/Images/OutliningIndicators/InBlock.gif)
16
![](/Images/OutliningIndicators/InBlock.gif)
17
![](/Images/OutliningIndicators/InBlock.gif)
18
![](/Images/OutliningIndicators/InBlock.gif)
19
![](/Images/OutliningIndicators/ExpandedBlockEnd.gif)
具体silverlight控件库和silverlight项目如何建,请看
设计一个silverlight的Button控件--silverlight(闪光)学习(1)
本文版权属于王传炜所有,首发http://www.cnblogs.com/,转载请注明出处。