Testo e immagini nel controllo HyperLink

Sat, 28 Apr 2007 11:04:00 GMT

Voglio aggiungere del testo e un'immagine nel controllo HyperLink del namespace System.Web.UI.WebControls .

All'apparenza sembra banale, ma si valorizzano entrambe le proprietà Text (la proprietà che contiene il testo del link) e ImageUrl (il path dell'immagine da caricare nel link), il controllo si disinteressa completamente della proprietà Text. Viene quindi caricata solo l'immagine. E se link è composto da un'immagine e da un testo? Si devono aggiungere due controlli HyperLink distinti, l'uno con il testo e l'altro con l'immagine?

Perchè? Come ovviare al problema?

Ho disassemblato il controllo. Qui sotto riporto la subroutine RenderContents; tanto per intenderci, il metodo che disegna il link nella pagina html:

Protected Friend Overrides Sub RenderContents(ByVal writer As HtmlTextWriter)
    Dim relativeUrl As String = Me.ImageUrl
    If (relativeUrl.Length > 0) Then
        Dim image As New Image
        image.ImageUrl = MyBase.ResolveClientUrl(relativeUrl)
        relativeUrl = Me.ToolTip
        If (relativeUrl.Length <> 0) Then
            image.ToolTip = relativeUrl
        End If
        relativeUrl = Me.Text
        If (relativeUrl.Length <> 0) Then
            image.AlternateText = relativeUrl
        End If
        image.RenderControl(writer)
    ElseIf MyBase.HasRenderingData Then
        MyBase.RenderContents(writer)
    Else
        writer.Write(Me.Text)
    End If
End Sub

Come si può vedere, non appena si valorizza la proprietà ImageUrl, il controllo disegna solamente l'immagine, e il testo finisce nell'AlternateText.

Se popoliamo la proprietà Text, ma senza traccia dell'immagine, il controllo renderizza correttamente il testo.

Esiste una terza alternativa, quella che serve. Si possono aggiungere i controlli dinamicamente nella collezione Controls dell'Hyperlink, i quali verranno renderizzati nell'ordine d'inserimento.

Ecco un esempio:

Dim hy As New HyperLink()

'Impostiamo delle proprietà di stile

            hy.ForeColor = Drawing.Color.Black
            hy.Font.Bold = False
            hy.Style("font-weight") = "normal"
            hy.Font.Size = FontUnit.Point(8)

'Imposto il testo del tooltip
hy.ToolTip = "Il mio link con immagine"

'Creo l'immagine

            Dim IMG As New WebControls.Image
            IMG.ImageUrl = imgPath
            hy.Controls.Add(IMG)

'Scrivo il testo
            Dim txt As New Label
            txt.Text = "Il testo del mio link con immagine"
            hy.Controls.Add(txt)

Immagine/i e Testo nel controllo HyperLink

Testo e immagini nel controllo HyperLink