Galileo Computing < openbook >
Galileo Computing - Programming the Net
Galileo Computing - Programming the Net


Einstieg in ASP.NET von Matthias Lohrer
Einstieg in ASP.NET
gp Kapitel HTML-Serversteuerelemente
  gp 6.1 System.Web.UI.LiteralControl
  gp 6.2 Die HTML-Serversteuerelemente. Vererbungshierarchie und gemeinsame Eigenschaften
  gp 6.3 Die Klasse HtmlImage
  gp 6.4 HtmlContainerControl und abgeleitete Klassen
    gp 6.4.1 Die Basisklasse HtmlContainerControl
    gp 6.4.2 HtmlGenericControl
    gp 6.4.3 HtmlAnchor
    gp 6.4.4 HtmlTable, HtmlTableRow und HtmlTableCell
    gp 6.4.5 HtmlForm
    gp 6.4.6 HtmlButton
    gp 6.4.7 HtmlSelect
    gp 6.4.8 HtmlTextArea
  gp 6.5 HtmlInputControl und abgeleitete Klassen
    gp 6.5.1 Ein Beispiel mit mehreren Eingabeelementen
    gp 6.5.2 HtmlInputButton
    gp 6.5.3 HtmlInputImage
    gp 6.5.4 HtmlInputFile
    gp 6.5.5 HtmlInputText
    gp 6.5.6 HtmlInputCheckBox
    gp 6.5.7 HtmlInputRadioButton
    gp 6.5.8 HtmlInputHidden


Galileo Computing

6.3 Die Klasse HtmlImage  toptop

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.

Abbildung
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.

  

Einstieg in VB.NET

VB.NET

Einstieg in C#

Visual C#

VB.NET und Datenbanken

Einstieg in XML




Copyright © Galileo Press GmbH 2003
Für Ihren privaten Gebrauch dürfen Sie die Online-Version natürlich ausdrucken. Ansonsten unterliegt das <openbook> denselben Bestimmungen, wie die gebundene Ausgabe: Das Werk einschließlich aller seiner Teile ist urheberrechtlich geschützt. Alle Rechte vorbehalten einschließlich der Vervielfältigung, Übersetzung, Mikroverfilmung sowie Einspeicherung und Verarbeitung in elektronischen Systemen.


[Galileo Computing]

Galileo Press GmbH, Gartenstraße 24, 53229 Bonn, Tel.: 0228.42150.0, Fax 0228.42150.77, info@galileo-press.de