建站学 - 轻松建站从此开始!

建站学-个人建站指南,网页制作,网站设计,网站制作教程

当前位置: 建站学 > 网站开发 > asp.net教程 >

如何在ASP.NET4中构造HTML5视频控件(4)

时间:2011-03-15 10:26来源: 作者: 点击:
要注意的是,该方法有个参数是以HtmlTextWriter为对象的output,它可以设置向浏览器输出HTML,它有很多方法和属性,比如AddAttribute和RenderBeginTag。 接下来我们为控件增加向浏览器输出的方法代码了,如下: prot

要注意的是,该方法有个参数是以HtmlTextWriter为对象的output,它可以设置向浏览器输出HTML,它有很多方法和属性,比如AddAttribute和RenderBeginTag。

接下来我们为控件增加向浏览器输出的方法代码了,如下:

  1. protected override void RenderContents(HtmlTextWriter output)  
  2. {  
  3.     output.AddAttribute(HtmlTextWriterAttribute.Id, this.ID);  
  4.     output.AddAttribute(HtmlTextWriterAttribute.Width, this.Width.ToString());  
  5.     output.AddAttribute(HtmlTextWriterAttribute.Height, this.Height.ToString());  
  6.  
  7.     if (DisplayControlButtons == true)  
  8.     {  
  9.         output.AddAttribute("controls""controls");  
  10.     }  
  11.  
  12.     if (PosterUrl != null)  
  13.     {  
  14.         output.AddAttribute("poster", PosterUrl);  
  15.     }  
  16.  
  17.     if (AutoPlay == true)  
  18.     {  
  19.         output.AddAttribute("autoplay""autoplay");  
  20.     }  
  21.  
  22.     if (Loop == true)  
  23.     {  
  24.         output.AddAttribute("loop""loop");  
  25.     }  

步骤6 输出VIDEO标签内容

紧接着,就可以输出video标签内的内容了,接着增加如下代码:

  1. output.RenderBeginTag("video");  
  2. if (OggUrl != null)  
  3. {  
  4.     output.AddAttribute("src", OggUrl);  
  5.     output.AddAttribute("type""video/ogg");  
  6.     output.RenderBeginTag("source");  
  7.     output.RenderEndTag();  
  8. }  
  9.  
  10. if (Mp4Url != null)  
  11. {  
  12.     output.AddAttribute("src", Mp4Url);  
  13.     output.AddAttribute("type""video/mp4");  
  14.     output.RenderBeginTag("source");  
  15.     output.RenderEndTag();  
  16. }  
  17. output.RenderEndTag(); 

我们在输出标签的内容时,先使用了RenderBeginTag方法往浏览器端输出一个标签video,并使用RenderEndTag指示标签内容已经输出完毕。接下来在上面的代码中我们判断指定的文件格式的视频文件是否存在,如果存在的话,则按指定的文件格式输出。

最后,为了防止ASP.NET 控件在向浏览器输出时,带有span标签,我们可以把它移走,只需要重写render方法即可,如下:

  1. protected override void Render(HtmlTextWriter writer)  
  2. {  
  3.     this.RenderContents(writer);  

步骤7 编译生成控件

选择Build 菜单,生成整个解决方案,如下图:

 

步骤8 将控件放到工具箱去

接下来要把我们做好的控件放到工具箱中去以方便今后使用。步骤如下:

1) 打开工具箱视图,鼠标右键在空白的地方,在弹出的菜单中点choose item,

2) 在弹出的菜单中选择.NET 组件卡,并选择浏览,浏览我们刚做好的CustomerControll工程中的bin\debug目录下的CustomControls.DLL,最后点确定,如下图所示:

 

这个时候,该控件就会在工具箱出现了,如下图:

 

步骤8 把控件加到aspx页面

我们可以随便新建立一个aspx页面,把控件从工具箱拖拉到页面中就可以了,可以看到如下代码:

<cc1:VideoPlayer ID="VideoPlayer1" runat="server" Mp4Url="videos/movie.mp4" OggUrl="videos/movie.ogg" Width="400" Height="300" />

我们还可以在design设计视图时,具体指定这个控件的每个属性的值得了,看,是不是很简单方便?

最后运行我们的程序,可以看到如下所示的播放器了:

 

(责任编辑:admin)
织梦二维码生成器
顶一下
(0)
0%
踩一下
(0)
0%
------分隔线----------------------------
发表评论
请自觉遵守互联网相关的政策法规,严禁发布色情、暴力、反动的言论。
评价:
表情:
用户名: 验证码:点击我更换图片