Wenn Sie das soeben eingefügte ASP.NET-Textfeld markieren, sehen Sie, dass die Eigenschaften dieses Elements in die Kategorien Darstellung, Daten, Eingabehilfen, Layout, Sonstiges und Verhalten unterteilt sind. Die Eigenschaften, die Designer interessieren, sind in der Regel den Kategorien Darstellung und Layout untergeordnet. Die meisten anderen Eigenschaften sind fast ausschließlich für Entwickler interessant.

Oft benötigte Designeigenschaften

Viele ASP.NET-Steuerelemente bieten im Aufgabenbereich Tageigenschaften und dort in den Kategorien Darstellung und Layout dieselben Eigenschaften an. Mit diesen Eigenschaften legen Sie das Erscheinungsbild des jeweiligen Elements fest. Sie sind in der folgenden Tabelle beschrieben. Beachten Sie, dass nicht jedes ASP.NET-Steuerelement über jede dieser Eigenschaften verfügt.

Übersicht über die ASP.NET-Steuerelemente

Wenn Sie als Designer in einem aus Designern und Entwicklern bestehenden Team arbeiten, erfahren Sie von den Entwicklern, welche Steuerelemente auf einer Seite benötigt werden. Die verfügbaren Standardsteuerelemente sind in den folgenden Abschnitten erläutert. Die wichtigsten Eigenschaften, die sich auf das Design der Elemente beziehen, sind dort ebenfalls beschrieben.

ASP.NET-Steuerelemente der Kategorie Standard

Der Kategorie Standard sind alle ASP.NET-Steuerelemente untergeordnet, mit deren Hilfe auf einer Webseite Informationen angezeigt und von den Besuchern entgegengenommen werden können. Die Steuerelemente, die einer näheren Erläuterung bedürfen, werden zunächst einzeln beschrieben. Die verbleibenden Steuerelemente sind dann in einer Tabelle zusammengefasst.

Hinweis: Einige der in den folgenden Abschnitten vorgestellten Steuerelemente bieten die Möglichkeit, Listen zu generieren, deren Einträge von den künftigen Benutzern ausgewählt werden können. Wenn Sie auf einer ASP.NET-Seite ein solches Steuerelement einfügen, können Sie die Listeneinträge entweder direkt angeben, oder Sie legen eine Datenquelle (XML-Datei oder Datenbanktabelle) fest, die die anzuzeigenden Listeneinträge enthält. Dazu wird die Datenquelle an das jeweilige Steuerelement gebunden. Dies geschieht mithilfe eines zusätzlichen ASP.NET-Steuerelements, dem DataSource-Element (z.B. XmlDataSource oder SqlDataSource), das von Expression Web 2 automatisch in die jeweilige Seite eingebunden wird.

Das DataSource-Element ist gewissermaßen der Vermittler zwischen der Datenquelle und dem Listenfeld. Es ist ein für den Benutzer unsichtbares Objekt. In der Entwurfsansicht von Expression Web 2 wird es jedoch als graues Kästchen dargestellt. Innerhalb des Kästchens wird der Name des DataSource-Elements angezeigt. Auf diese Weise sehen Sie sofort, dass ein ASP.NET-Steuerelement an eine Datenquelle gebunden wurde.

Das AdRotator-Steuerelement

Führen Sie in der Toolbox unter der Kategorie ASP.NET-Steuerelemente/Standard einen Doppelklick auf dem nebenstehend abgebildeten Symbol AdRotator aus, um dieses Steuerelement an der Position der Einfügemarke anzuordnen.

Es zeigt von Ihnen angegebene Bilder (z.B. Werbeanzeigen) an. Die anzuzeigenden Bilder werden mithilfe einer XML-Datei oder einer Datenbanktabelle festgelegt. Sie werden nach dem Zufallsprinzip ausgewählt und ändern sich mit jeder Seitenaktualisierung.

Eine XML-Datei für das AdRotator-Element verwenden

Um die anzuzeigenden Bilder mithilfe einer XML-Datei anzuzeigen, gehen Sie wie folgt vor:

1. Erstellen Sie innerhalb der Website, in der Sie mit dem AdRotator-Element arbeiten möchten, einen Ordner, in dem Sie die anzuzeigenden Bilder ablegen. In dem Beispiel auf der CD-ROM ist dies der Ordner images, der vier Bilder enthält.
2. Erstellen Sie eine Anzeigenliste als XML-Datei. Diese sollte in einem Ordner der Website gespeichert werden, auf den die Besucher nicht zugreifen können, z.B. im Ordner App_Data oder _private. Verwenden Sie sicherheitshalber anstelle der Dateinamenserweiterung .xml eine andere Erweiterung, z.B. .ads. Im Beispielcode wurde darauf verzichtet.
   
   Sie können eine neue XML-Datei erstellen, indem Sie im Menü Datei den Befehl Neu und dann Seite auswählen. Markieren Sie im rechten Listenfeld des anschließend angezeigten Dialogfeldes den Eintrag XML, und klicken Sie auf OK. Das nachfolgende Beispiel zeigt, wie die Datei aufgebaut sein sollte. Sie können natürlich eigene Bilddateien und Beschreibungen verwenden:
   
   

   <?xml version="1.0" encoding="utf-8" ?>
   <Advertisements xmlns="http://schemas.microsoft.com/AspNet/AdRotator-Schedule-File">
   <Ad>
   <ImageUrl>images/image1.jpg</ImageUrl>
   <NavigateUrl>http://www.microsoft-press.de</NavigateUrl>
   <AlternateText>Das Windows Server-Buch von Microsoft!</AlternateText>
   <Impressions>10</Impressions>
   </Ad>
   <Ad>
   <ImageUrl>images/image2.jpg</ImageUrl>
   <NavigateUrl>http://www.microsoft-press.de</NavigateUrl>
   <AlternateText>Die Richtig einsteigen-Reihe!</AlternateText>
   <Impressions>10</Impressions>
   </Ad>
   ...
   </Advertisements>

   Hinweis: Ausführliche Informationen zu XML finden Sie in Kapitel 14.

   Jedes anzuzeigende Bild muss mit den dazugehörigen Informationen innerhalb der Tags <Ad> und </Ad> angeordnet werden. Besonders wichtig sind die Tags ImageUrl und NavigateUrl. Sie definieren den Speicherort des jeweiligen Bildes und den Hyperlink zu dem Ziel, das nach einem Klick auf das jeweilige Bild aufgerufen werden soll.

   Beachten Sie, dass Sie den Speicherort des Bildes relativ zum Speicherort der XML-Datei angeben können. Befindet sich die XML-Datei z.B. im Hauptverzeichnis der Website, während das erste Bild (image1.jpg) im Ordner images gespeichert ist, können Sie ausgehend vom XML-Dateipfad den Bildpfad images/image1.jpg angeben. Eine weitere Möglichkeit wäre die Verwendung der Tilde: ~/images/image1.jpg. Die Tilde repräsentiert das Hauptverzeichnis der Website.

   Das Tag Impressions gibt an, wie oft ein Bild dargestellt wird. Je höher dieser Wert ist, desto häufiger ist das Bild auf der Webseite zu sehen.

3. Legen Sie mit Expression Web 2 innerhalb der Website, in der Sie das AdRotator-Element verwenden möchten, eine neue ASP.NET-Seite an. Speichern Sie diese Seite, und ordnen Sie darauf ein AdRotator-Steuerelement an.
   
   Wenn Sie dies tun, wird neben dem Steuerelement automatisch ein Aufgabenmenü zu diesem Element angezeigt, aus dem Sie die auf das Element bezogenen Aufgaben auswählen können.
4. Öffnen Sie im Menü AdRotator-Aufgaben das Listenfeld neben Datenquelle auswählen, um die gewünschte Datenquelle anzugeben, die die Bildliste enthält. Dies ist die zuvor erstellte XML-Datei. Sollte das Menü AdRotator-Aufgaben nicht zu sehen sein, markieren Sie das AdRotator-Steuerelement und klicken auf den nach rechts weisenden Pfeil, der daran angeordnet ist.
5. Wählen Sie im Listenfeld neben Datenquelle auswählen den Eintrag Neue Datenquelle aus.
6. Markieren Sie im folgenden Dialogfeld den Typ der Datenquelle, also XML-Datei.
7. Klicken Sie auf OK.
8. Klicken Sie im folgenden Dialogfeld neben Datendatei auf die Schaltfläche Durchsuchen, und navigieren Sie zu der zuvor erstellten XML-Datei.
9. Markieren Sie die Datei, und klicken Sie auf Öffnen.
10. Verlassen Sie das vorherige Dialogfeld mit einem Klick auf OK.

Copyright © 2010 Microsoft Deutschland GmbH Alle Rechte vorbehalten.