6.3 Die Klasse HtmlImage
HtmlImage ist das einzige HTML-Serversteuerelement, das direkt von HtmlControl abgeleitet ist. Das ist aber auch seine einzige Besonderheit. Ansonsten bietet diese Klasse einfach eine Heimat für das vertraute img-Element. Über die Eigenschaften können Sie die Größe des Bildes, die Datenquelle, den Rahmen, die Ausrichtung und den Alternativtext beeinflussen. Tabelle 6.5 listet die Eigenschaften detailliert auf.
| Name der Eigenschaft
|
Typ
|
Beschreibung
|
| Align
|
String
|
Ausrichtung des Bildes. Zur Verfügung stehen die Werte left, center, right, top, middle und bottom.
|
| Alt
|
String
|
Alternativtext für das Bild
|
| Border
|
Integer
|
Rahmenbreite in Pixeln
|
| Height
|
Integer
|
Höhe in Pixeln oder als Prozentangabe
|
| Src
|
String
|
Pfad zur Bilddatei
|
| Width
|
Integer
|
Bildbreite in Pixeln oder als Prozentangabe
|
Tabelle 6.5 Eigenschaften der Klasse HtmlImage
Das Beispiel-Skript in HtmlImage01.aspx ermöglicht die stufenweise Vergrößerung und Verkleinerung eines Bildes. Abbildung 6.3 zeigt die Darstellung im Browser.
Hier klicken, um das Bild zu Vergrößern
Abbildung 6.3 Mit der HtmlImage-Klasse können Sie Eigenschaften von Bildern serverseitig beeinflussen.
<!-- HtmlImage01.aspx -->
<%@ Page Language="VB" Debug="True" Strict="True" %>
<script runat="server">
Sub Page_Load (ByVal Sender As Object, _
ByVal E As EventArgs)
If Not IsPostBack Then
meinBild.src = "img/benjaminampc.jpg"
meinBild.height=400
meinBild.border=1
zeigeHoehe (meinBild.height)
End If
End Sub
Sub btnGroesser_Click (ByVal Sender As Object, _
ByVal E As EventArgs)
Dim groesse_alt As Integer = meinBild.height
Dim groesse_neu As Integer = _
CInt(CDbl(meinBild.height) * 1.1)
If groesse_neu = groesse_alt Then
groesse_neu += 1
End If
meinBild.height=groesse_neu
zeigeHoehe (groesse_neu)
End Sub
Sub btnKleiner_Click (ByVal Sender As Object, _
ByVal E As EventArgs)
meinBild.height = _
CInt(CType(meinBild.height, Double) * 0.9)
zeigeHoehe (meinBild.height)
End Sub
Sub zeigeHoehe (ByVal inHoehe as Integer)
meinAbsatz.innerText = _
"Höhe: " & CStr(inHoehe) & " Pixel"
End Sub
</script>
<html><head><title>HtmlImage-Demo</title></head>
<body>
<form runat="server">
<p><img runat="server" id="meinBild"></p>
<p>
<input runat="server" type="submit" id="btnGroesser"
value=" 10 % Größer "
onServerClick="btnGroesser_Click">
<input runat="server" type="submit" id="btnKleiner"
value=" 10 % Kleiner "
onServerClick="btnKleiner_Click">
</p>
<p runat="server" id="meinAbsatz" ></p>
</form></body></html>
Im HTML-Abschnitt der aspx-Datei wird ein img-Element definiert, aber ohne Eigenschaften wie die Datenquelle oder die Größe festzulegen. Dafür sorgt die Ereignisprozedur Page_Load, die beim erstmaligen Laden (If Not IsPostBack) die Ausgangswerte für das Bild festlegt. Über src wird die Datenquelle festgelegt. Die Höhe wird auf 400 Pixel festgesetzt und ein 1 Pixel breiter Rahmen wird um das Bild gezogen. Der Anwender kann durch Anklicken der jeweiligen Schaltfläche das Bild um zehn Prozent vergrößern oder verkleinern. Unterhalb der Schaltflächen wird die aktuelle Höhe des Bildes in Pixeln angezeigt.
Das Attribut onServerClick="btnGroesser_Click" verknüpft die Schaltfläche btnGroesser mit dieser Ereignisprozedur. btnGroesser_Click berechnet den neuen Wert, indem es den alten Wert mit 1,1 multipliziert. Anschließend vergleicht die Prozedur den neuen mit dem alten Wert. Wenn beide identisch sind, wird der Wert um 1 erhöht. Damit wird das Problem umgangen, dass bei sehr kleiner Höhe, z. B. wenn ein Bild nur noch 4 Pixel hoch ist, die Multiplikation mit 1,1 und anschließender Rundung auch wieder nur 4 ergibt. Die Schaltfläche würde in diesem Fall nichts mehr bewirken.
Da das Skript die Option Strict="True" verwendet, müssen alle Konvertierungen explizit durchgeführt werden. So kommt es zu der Zeile
Dim groesse_neu As Integer = _
CInt(CDbl(meinBild.height) * 1.1)
Weil meinBild.height vom Typ Integer ist, muss es für die Multiplikation mit 1,1 zunächst mit CDbl in einen Wert vom Typ Double konvertiert werden.
Da die Höhe des Bildes an mehreren Stellen im Programmcode geändert wird, sorgt die Prozedur zeigeHoehe für eine einheitlich gestaltete Ausgabe des entsprechenden Hinweistextes.
| Achtung Warum Double? Weil ein Literal mit Nachkommastellen – und das ist 1,1 – automatisch als Wert vom Typ Double angesehen wird. Für die Zuweisung zu groesse_neu benötigen wir aber einen Wert vom Typ Integer, der mit CInt erzeugt wird. CInt führt dabei automatisch eine Rundung durch, die zu dem oben beschriebenen Problem führen kann.
|
|
