Silverlight专题(15) - 你自己的视频播放器之自定义MoveToPointSlider
前言:
这几天在网络上看到不少人在问如何创建一个Video Player(Silverlight版本)
而我在微软和这方面打了不少交道
所以计划用两篇文章解答下大家的问题
本篇文章先介绍下如何创建一个自定义的滚动条
下篇文章创建完整的一个Video Player
问题:
大家可能要问,你为什么要自定义滚动条(Slider)呢?
微软的Sliverlight控件中不是已经默认的有个Slider了吗?
如下所示:我们使用微软默认的Slider控件如下
1 <Grid x:Name="LayoutRoot" Background="#808080">
2 <Slider Width="400" Maximum="100" Minimum="0" LargeChange="10" SmallChange="1"/>
3 </Grid>
展示程序如下(大家可以试试)
大家是不是发现点什么啦?
对了,就是Slider并不是按照你点击哪里,他就滚到哪里的方式工作的
而是以上面设置的LargeChange的幅度(也就是每点一次,只移动10*400/100)工作
解决方案:
难道我们没有办法了吗?
自定义一个Slider可以帮你忙(我取名为MoveToPointSlider)
原理图如下:
(本图来自MSDN)
如图所示,Slider主要由3三部分组成,左边和右边的RepeatButton,中间的Track
也就是整个Slider共分成了3列
其中左边的RepeatButton和中间的Track分别属于第1,2列,其宽度为Auto
而右边的RepeatButton在第3列,占据了剩下的空间,其宽度设置为*
(有关Grid的布局介绍请参见Silverlight专题(8)-布局介绍)
现在我们需要在第一以及第三列上各覆盖上一个Rectangle来响应鼠标的点击
使的其能实现我们的预期效果
具体实现步骤如下:
1.给程序添加一个类如下图所示
2.让这个类继承Slider类
3.实现功能如下
1 public class MoveToPointSlider : Slider
2 {
3 private Thumb m_horizontalThumb;
4 private FrameworkElement m_leftTrack;
5 private FrameworkElement m_rightTrack;
6
7 public override void OnApplyTemplate()
8 {
9 base.OnApplyTemplate();
10 base.OnApplyTemplate();
11 m_horizontalThumb = GetTemplateChild("HorizontalThumb") as Thumb;
12 m_leftTrack = GetTemplateChild("LeftTrack") as FrameworkElement;
13 if (m_leftTrack != null)
14 this.m_leftTrack.MouseLeftButtonDown += new MouseButtonEventHandler(OnMoveThumbToMouse);
15
16 m_rightTrack = GetTemplateChild("RightTrack") as FrameworkElement;
17 if (m_rightTrack != null)
18 this.m_rightTrack.MouseLeftButtonDown += new MouseButtonEventHandler(OnMoveThumbToMouse);
19 }
20
21 void OnMoveThumbToMouse(object sender, MouseButtonEventArgs e)
22 {
23 Point p = e.GetPosition(this);
24 Value = (p.X - (m_horizontalThumb.ActualWidth / 2)) / (ActualWidth - m_horizontalThumb.ActualWidth) * Maximum;
25 }
26 }
m_leftTrack就是上面说的第一列的Rectangle
m_rightTrack就是第三列的Rectangle
23~24行就是响应鼠标左键点击使得你点Slider的哪里,Slider上的Thumb就滑到哪里
4.引用MoveToPointSlider并使用他
5.给MoveToPointSlider自定义Style,在Microsoft Expression Blend 2 SP1中操作如下
在默认的Slider Style的HorizontalTemplate的自底部添加两个Rectangle控件
并分别命名为LeftTrack和RightTrack
(一定只能是这两个名字,因为我们前面的MoveToPointSlider的底层代码就是通过这两个名字来获取Slider中的控件的
也就是GetTemplateChild(“LeftTrack”)和GetTemplateChild(“RightTrack”))
这样我们就得到了我们需要的MoveToPointSlider了
实际效果展示:
实际的程序如下(部署在http://streaming.live.com/):
代码下载:
总结:
本篇大概介绍了下如何在Slider控件的基础上自定义控件
为下篇文章实现合理的视频播放器做了前期准备
转载于:https://www.cnblogs.com/ibillguo/archive/2008/11/21/1338462.html
Silverlight专题(15) - 你自己的视频播放器之自定义MoveToPointSlider相关推荐
- 从零开始学习音视频编程技术(六) FFMPEG Qt视频播放器之显示图像
从零开始学习音视频编程技术(六) FFMPEG Qt视频播放器之显示图像 原文地址:http://blog.yundiantech.com/?log=blog&id=9 前面讲解了如何用FFM ...
- FFmpeg开发(九)——Qt视频播放器之快进滑动条(参考了暴风影音、迅雷影音)
FFmpeg开发(九)--Qt视频播放器之快进滑动条(参考了暴风影音.迅雷影音) 上一篇介绍了使用多线程 FFmpeg开发(八)--Qt视频播放器之多线程的使用(参考了暴风影音.迅雷影音) 本播放器系 ...
- 从零开始学习音视频编程技术(七) FFMPEG Qt视频播放器之SDL的使用
从零开始学习音视频编程技术(七) FFMPEG Qt视频播放器之SDL的使用 原文地址:http://blog.yundiantech.com/?log=blog&id=10 前面介绍了使用F ...
- 基于libVLC的视频播放器之二:使用VLC-Qt播放RTSP流
此篇是 使用VLC浏览器插件播放RTSP流的姊妹篇. 一.直接使用libVLC libVLC是VLC media player多媒体框架的核心引擎和接口,开发者使用它能轻松的创建大量具有VLC特性的应 ...
- FFmpeg开发(五)——Qt视频播放器之封装FFmpeg类(参考了暴风影音、迅雷影音)
FFmpeg开发(五)--Qt视频播放器之封装FFmpeg类(参考了暴风影音.迅雷影音) 上一篇介绍了,使用Qt和FFmpeg写的播放器.页面大家可以点进去查看和下载. FFmpeg开发(四)--Qt ...
- FFmpeg开发(七)——Qt视频播放器之播放列表类(参考了暴风影音、迅雷影音)
FFmpeg开发(七)--Qt视频播放器之播放列表类(参考了暴风影音.迅雷影音) 上一篇分享了音频类的封装. FFmpeg开发(六)--Qt视频播放器之封装音频类(参考了暴风影音.迅雷影音) 本播放器 ...
- FFmpeg开发(八)——Qt视频播放器之多线程的使用(参考了暴风影音、迅雷影音)
FFmpeg开发(八)--Qt视频播放器之多线程的使用(参考了暴风影音.迅雷影音) 上篇文章介绍了: FFmpeg开发(七)--Qt视频播放器之播放列表类(参考了暴风影音.迅雷影音) 本播放器系列相关 ...
- 基于FFmpeg的视频播放器之十五:录像
一.效果 1.录制视频 2.播放录制的视频 二.原理 将上一篇基于FFmpeg的视频播放器之十四:remuxing中的代码直接用于录像是行不通的,会存在下列问题. 1.因为可以从任意时间点开始录制,此 ...
- FFmpeg开发(六)——Qt视频播放器之封装音频类(参考了暴风影音、迅雷影音)
FFmpeg开发(六)--Qt视频播放器之封装音频类(参考了暴风影音.迅雷影音) 上一篇介绍了,封装FFmpeg类. Qt视频播放器之封装FFmpeg类(参考了暴风影音.迅雷影音) 之前的链接大家可以 ...
最新文章
- 收藏 | 2015年度大数据应用经典案例Top100
- 车来了赵祺:贴近业务,是DT时代第一驱动力
- html语言中括号怎么打,HTML语言中括号(尖括号)的字符编码
- 开发转测试没人要_前端开发,测试,后端,该如何选择?
- linux 内核系统优化,Linux系统内核优化(一)
- 浅谈OpenCL之Platform API(2)
- 域名抢注php程序_“丁真”被抢注,蹭热点这门生意,能成就好品牌?
- escapexml java_fn:escapeXml()函数
- 用计算机组成原理+唐朔飞的,计算机组成原理(唐朔飞) 课件.ppt
- URL与URI的区别和联系
- 机器视觉(9)搞懂机器视觉基本内容,这份PPT就够了!
- 最经典的人生定律、法则、效应总结
- 华为核心交换如何配置源地址转换_华为路由器和交换机配置地址转换
- python 区块链_如何用Python快速实现区块链?
- python分号_在Python中拆分分号分隔的字符串
- java学习感想_Java学习感想
- 怎样用ipad录制游戏视频?ipad如何录制视频?
- 论文阅读笔记:From Zero-Shot Learning to Cold-Start Recommendation
- 亚马逊被人差评了怎么办?
- Codeforces 833D Red-Black Cobweb 边分治