我们在前面几篇文章中,已经简要的对服务器控件做了基本介绍,接下来的几篇文章中我们要开始实作服务器控件。在网页上常使用 Media Player 来拨放影片,在 ASP.NET 中没有现成的控件来处理 Media Player,只能在 aspx 中加入 Media Player 相关的程序代码;本文将示范如何制作一个 Media Player 控件,让我们在 ASP.NET 中更方便的使用 Media Player。

程序代码下载:ASP.NET Server Control - Day10.rar

 

一、Media Player 原始 HTML

在制作 Media Player 控件之前,你需要先了解 Media Player 原本的 HTML 码,控件的作用就是想辨法把这些写在 aspx 中的 HTML 码交由控件来输出而已,以下为网页中加入 Media Player 的 HTML 码范例。

<OBJECT id="VIDEO" width="320" height="240" 
    style="position:absolute; left:0;top:0;"
    CLASSID="CLSID:6BF52A52-394A-11d3-B153-00C04F79FAA6"
    type="application/x-oleobject">
    
    <PARAM NAME="URL" VALUE="your file or url">
    <PARAM NAME="SendPlayStateChangeEvents" VALUE="True">
    <PARAM NAME="AutoStart" VALUE="True">
    <PARAM name="uiMode" value="none">
    <PARAM name="PlayCount" value="9999">
</OBJECT>

 

 

在下面的网页有 Media Player 相关参数说明。

http://www.mioplanet.com/rsc/embed_mediaplayer.htm

 

二、实作 Media Player 控件

step1.首先新增由 WebControl 继承下来的 TBMediaPlayer 类别。

    Public Class TBMediaPlayer
        Inherits WebControl
 
    End Class

 

 

step2.覆写 TagKey 属性,传回 object 的 Tag。

        Protected Overrides ReadOnly Property TagKey() As System.Web.UI.HtmlTextWriterTag
            Get
                Return HtmlTextWriterTag.Object
            End Get
        End Property

 

step3.输出 HTML Tag 的 Attribute

在 object Tag 中包含 style、classid、type 二个 Attribute,WebControl 本身会处理 style,所以我们只需覆写 AddAttributesToRender 方法,处理 classid 及 type 二个 Attribute,记得覆写 AddAttributesToRender 方法时最后要加入 MyBase.AddAttributesToRender(writer),才会执行父类别的 AddAttributesToRender 方法。

        ''' <summary>
        ''' 覆寫 AddAttributesToRender 方法。
        ''' </summary>
        Protected Overrides Sub AddAttributesToRender(ByVal writer As System.Web.UI.HtmlTextWriter)
            '加入 MediaPlayer ActiveX 元件的 classid
            writer.AddAttribute("classid", "clsid:6BF52A52-394A-11D3-B153-00C04F79FAA6")
            writer.AddAttribute("type", "application/x-oleobject")
            MyBase.AddAttributesToRender(writer)
        End Sub

 

 

step4.加入 Url 属性

加入指定播放档案来源的 Url 属性,其中套用 EditorAttribute 设定 UrlEditor,使用 Url 专用的编辑器来设定属性。

        ''' <summary>
        ''' 播放檔案來源。
        ''' </summary>
        < _
        Description("播放檔案來源"), _
        Bindable(True), _
        Category("Appearance"), _
        Editor(GetType(UrlEditor), GetType(UITypeEditor)), _
        UrlProperty(), _
        DefaultValue("") _
        > _
        Public Property Url() As String
            Get
                Return FUrl
            End Get
            Set(ByVal value As String)
                FUrl = value
            End Set
        End Property

 

 

step5.输出 Url 参数

接下来覆写 CreateChildControls 方法,输出 Url 参数。

        ''' <summary>
        ''' 加入參數。
        ''' </summary>
        ''' <param name="Name">參數名稱。</param>
        ''' <param name="Value">參數值。</param>
        Private Sub AddParam(ByVal Name As String, ByVal Value As String)
            Dim oParam As HtmlControls.HtmlGenericControl
 
            oParam = New HtmlControls.HtmlGenericControl("param")
            oParam.Attributes.Add("name", Name)
            oParam.Attributes.Add("value", Value)
            Me.Controls.Add(oParam)
        End Sub
 
        Protected Overrides Sub CreateChildControls()
            '加入 Url 參數
            AddParam("url", Me.ResolveClientUrl(Me.Url))
            MyBase.CreateChildControls()
        End Sub

 

 

step6.输出 Media Player 其它参数
你可以将 Media Player 的参数设定皆使用相对应的属性来设定,然后使用 step5 的方式来输出所有设定的参数值。

 

三、Media Player 控件程序代码

Media Player 控件的完整程序代码如下,此控件只加入 URL、AutoStart、UIMode 三个参数,你可以视需求情形将使用到的参数定义为属性来做设定即可。

    Public Class TBMediaPlayer
        Inherits WebControl
 
        ''' <summary>
        ''' 顯示界面模式。
        ''' </summary>
        Public Enum EUIMode
            NotSet
            Invisible
            None
            Mini
            Full
        End Enum
 
        Private FUrl As String = String.Empty
        Private FAutoStart As Boolean = False
        Private FUIMode As EUIMode = EUIMode.NotSet
 
        ''' <summary>
        ''' 播放檔案來源。
        ''' </summary>
        < _
        Description("播放檔案來源"), _
        Bindable(True), _
        Category("Appearance"), _
        Editor(GetType(UrlEditor), GetType(UITypeEditor)), _
        UrlProperty(), _
        DefaultValue("") _
        > _
        Public Property Url() As String
            Get
                Return FUrl
            End Get
            Set(ByVal value As String)
                FUrl = value
            End Set
        End Property
 
        ''' <summary>
        ''' 是否自動播放。
        ''' </summary>
        < _
        Description("是否自動播放。"), _
        DefaultValue(False) _
        > _
        Public Property AutoStart() As Boolean
            Get
                Return FAutoStart
            End Get
            Set(ByVal value As Boolean)
                FAutoStart = value
            End Set
        End Property
 
        ''' <summary>
        ''' 顯示界面模式。
        ''' </summary>
        < _
        Description("顯示界面模式。"), _
        DefaultValue(GetType(EUIMode), "NotSet") _
        > _
        Public Property UIMode() As EUIMode
            Get
                Return FUIMode
            End Get
            Set(ByVal value As EUIMode)
                FUIMode = value
            End Set
        End Property
 
        Protected Overrides ReadOnly Property TagKey() As System.Web.UI.HtmlTextWriterTag
            Get
                Return HtmlTextWriterTag.Object
            End Get
        End Property
 
        ''' <summary>
        ''' 覆寫 AddAttributesToRender 方法。
        ''' </summary>
        Protected Overrides Sub AddAttributesToRender(ByVal writer As System.Web.UI.HtmlTextWriter)
            '加入 MediaPlayer ActiveX 元件的 classid
            writer.AddAttribute("classid", "clsid:6BF52A52-394A-11D3-B153-00C04F79FAA6")
            writer.AddAttribute("type", "application/x-oleobject")
            MyBase.AddAttributesToRender(writer)
        End Sub
 
        ''' <summary>
        ''' 加入參數。
        ''' </summary>
        ''' <param name="Name">參數名稱。</param>
        ''' <param name="Value">參數值。</param>
        Private Sub AddParam(ByVal Name As String, ByVal Value As String)
            Dim oParam As HtmlControls.HtmlGenericControl
 
            oParam = New HtmlControls.HtmlGenericControl("param")
            oParam.Attributes.Add("name", Name)
            oParam.Attributes.Add("value", Value)
            Me.Controls.Add(oParam)
        End Sub
 
        Protected Overrides Sub CreateChildControls()
            '加入 Url 參數
            AddParam("URL", Me.ResolveClientUrl(Me.Url))
            '加入 autoStart 參數
            If Me.AutoStart Then
                AddParam("autoStart", "true")
            End If
            '加入 uiMode 參數
            If Me.UIMode <> EUIMode.NotSet Then
                AddParam("uiMode", Me.UIMode.ToString)
            End If
 
            MyBase.CreateChildControls()
        End Sub
    End Class

 

 

四、执行程序

把 TBMediaPlayer 控件拖曳至页面,设定好属性后,执行程序就可以在页面上看到呈现出来的 Media Player。

        <bee:TBMediaPlayer ID="TBMediaPlayer1" runat="server" Height="250px" 
            Width="250px" Url="~/test.wmv" />

 

 

备注:本文同步发布于「第一届iT邦帮忙铁人赛」,如果你觉得这篇文章对您有帮助,记得连上去推鉴此文增加人气 ^^
http://ithelp.ithome.com.tw/question/10012142

posted on 2008-10-14 07:30  jeff377  阅读(1428)  评论(0编辑  收藏  举报