Link to home
Start Free TrialLog in
Avatar of hqdev
hqdevFlag for Canada

asked on

Custom control absolute positioning

Hi,

I've build a couples of web controls and I was wondering how can we made those control behave like MS builtin controls with absolute positioning.

I think I should implement top and left properties in my controls and then render the server "style" tag, but I don't really know how to do that.

Here's the code of one of the simpliest control.

Option Explicit On
Option Strict On

Imports System
Imports System.Web.UI
Imports System.Web.UI.WebControls


Public Class ctlStatus
    Inherits Control

    Dim _message As String
    Dim _icon As Integer
    Dim _pict As String
    Dim _col As String
    Dim _style As String

    Property Message() As String
        Get
            Return _message
        End Get
        Set(ByVal Value As String)
            _message = Value
        End Set
    End Property

     Property Icon() As Integer
        Get
            Return _icon
        End Get
        Set(ByVal Value As Integer)
            _icon = Value
            Select Case _icon
                Case 0
                    _pict = "./images/stats_nothing_big.png"
                    _col = "#cdcbbc"
                Case 1
                    _pict = "./images/stats_warning_big.png"
                    _col = "yellow"
                Case 2
                    _pict = "./images/stats_error_big.png"
                    _col = "red"
                Case 3
                    _pict = "./images/stats_critical_big.png"
                    _col = "red"
                Case 4
                    _pict = "./images/stats_info_big.png"
                    _col = "green"
                Case Else
                    _pict = "./images/stats_nothing_big.png"
                    _col = "#cdcbbc"
            End Select
        End Set
    End Property

    Protected Overrides Sub Render(ByVal writer As HtmlTextWriter)
        writer.Write(("<span id=""Label1"" style=""Z-INDEX: 101; LEFT: 124px; POSITION: absolute; TOP: 760px"">") & vbCr)

        writer.Write(("<DIV style=""Z-INDEX: 101; WIDTH: 100%; POSITION: relative;HEIGHT: 36px"" >"))
        writer.Write(("      <TABLE id=""Table3"" style=""BORDER-RIGHT: gray 1px solid; BORDER-TOP: gray 1px solid; Z-INDEX: 101; LEFT: 0px; BORDER-LEFT: gray 1px solid; WIDTH: 100%; BORDER-BOTTOM: gray 1px solid; POSITION: absolute; TOP: 6px"""))
        writer.Write(("            borderColor=""black"" height=""21"" cellSpacing=""0"" cellPadding=""0"" width=""100%"" bgColor=""" & Me._col & """"))
        writer.Write(("            border=""0"">"))
        writer.Write(("            <TR>"))
        writer.Write(("                  <TD style=""WIDTH: 5%; FONT-FAMILY: tahoma"" align=""left""><P align=""center""><FONT style=""FONT-SIZE: 9pt; FONT-FAMILY: tahoma"" face=""Times New Roman"" size=""3""></FONT>&nbsp;</P>"))
        writer.Write(("                  </TD>"))
        writer.Write(("                  <TD id=""status_msg"" style=""FONT-WEIGHT: bold; FONT-SIZE: 9pt; WIDTH: 95%; FONT-FAMILY: tahoma"" align=""left"">" & Me.Message & "</TD>"))
        writer.Write(("            </TR>"))
        writer.Write(("      </TABLE>"))
        writer.Write(("      <IMG id=""status_img"" style=""Z-INDEX: 102; LEFT: 0px; WIDTH: 51px; POSITION: absolute; TOP: 0px; HEIGHT: 31px"""))
        writer.Write(("            alt="""" src=""" & Me._pict & """></DIV>"))
        writer.Write(("</span>"))

    End Sub
End Class

Thanks
ASKER CERTIFIED SOLUTION
Avatar of ovalsquare
ovalsquare

Link to home
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
Start Free Trial
Avatar of hqdev

ASKER

I finally use a HTML grid layout and put the control in it.
Avatar of ovalsquare
ovalsquare

Sounds good - a much better approach (although you'll find that if you go with FlowLayout, you'll be happier in the long run - but no biggy - the big thing was getting it out of your code-behind).

Ted
Uh, my response was what the asker ended up implementing so I believe I should receive the points.

Thanks,

Ted