技术开发 频道

自食其力!ASP.NET 4打造HTML5视频控件

  步骤5 修改RenderContents方法

  服务端控件的主要目的就是向浏览器输出内容。因此,作为开发者,我们就必须设定好我们的控件要向客户端浏览器输出什么样的内容。因此,我们可以重写RenderContents方法即可,如下代码:

protected override void RenderContents(HtmlTextWriter output)
{
}

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

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

protected override void RenderContents(HtmlTextWriter output)
{
    output.AddAttribute(HtmlTextWriterAttribute.Id,
this.ID);
    output.AddAttribute(HtmlTextWriterAttribute.Width,
this.Width.ToString());
    output.AddAttribute(HtmlTextWriterAttribute.Height,
this.Height.ToString());

    
if (DisplayControlButtons == true)
    {
        output.AddAttribute(
"controls", "controls");
    }

    
if (PosterUrl != null)
    {
        output.AddAttribute(
"poster", PosterUrl);
    }

    
if (AutoPlay == true)
    {
        output.AddAttribute(
"autoplay", "autoplay");
    }

    
if (Loop == true)
    {
        output.AddAttribute(
"loop", "loop");
    }
}

  步骤6 输出VIDEO标签内容

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

output.RenderBeginTag("video");
if (OggUrl != null)
{
    output.AddAttribute(
"src", OggUrl);
    output.AddAttribute(
"type", "video/ogg");
    output.RenderBeginTag(
"source");
    output.RenderEndTag();
}

if (Mp4Url != null)
{
    output.AddAttribute(
"src", Mp4Url);
    output.AddAttribute(
"type", "video/mp4");
    output.RenderBeginTag(
"source");
    output.RenderEndTag();
}
output.RenderEndTag();

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

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

protected override void Render(HtmlTextWriter writer)
{
    
this.RenderContents(writer);
}
0
相关文章