Runde Fenster? Wie geht denn das? Dieser Workshop soll Ihnen zeigen, wie Sie Formulare beliebiger Form erzeugen können. Anhand eines Beispiels wird Ihnen der genaue Weg gezeigt. Zuvor gibt es noch ein wenig über die Theorie der "magischen" runden Fenster im Windows-System.
Autor:  Jens Brunsen	Bewertung:     [ Jetzt bewerten ]	Views:  23.620

Geben Sie hier Ihre persönliche Bewertung ab! Anzahl Bewertungen bisher: 9 Bewertung insgesamt: nützlich Durchschnittliche Bewertung: 2.8 von 5 Sternen

sehr gut     gut     nützlich     mittelmäßig     mangelhaft

Dieser Workshop soll Ihnen zeigen, wie Sie Formulare beliebiger Form erzeugen können. Anhand eines Beispiels wird Ihnen der genaue Weg gezeigt. Zuvor gibt es noch ein wenig über die Theorie der "magischen" runden Fenster im Windows-System.

Einleitung

Einige Softwareentwickler bieten dem User heutzutage untypische Oberflächenformen für Windowsprogramme an. Solche, oft runde, ovale oder anders gestaltete Fenster sind hauptsächlich bei Multimedia-Anwendungen im Einsatz. Nun ist es natürlich verständlich, daß der private Programmierer zu Hause ebenfalls die Oberflächen seiner Anwendung nach seinen Bedürfnissen anpassen und solche Formen herstellen möchte. Zum Glück wird dem Entwickler hier mit einigen API-Funktionen geholfen.

Fast alle Programme, die heutzutage auf dem Betriebssystem Windows arbeiten, fügen sich dem Standard modaler Dialoge. D.h., es sind die typischen Merkmale wie Titel- und Menüleiste am oberen Fensterrand, OK- und Abbrechen-Button, grauer Fensterhintergrund, usw. Durch diese Standardisierungen wurden über die Jahre sehr positive Auswirkungen erzielt, da das Aussehen verschiedener Programme sich immer ähnelt und die Bedienung nahezu identisch ist. Der Effekt, der damit erzielt wird, ist eine (schnellere) Steigerung der Produktivität, da der Anwender sich nicht erst in diese Anwendungen einarbeiten muß und somit ein sehr zeitraubender Arbeitsschritt entfällt.

Andererseits will man dem Anwender auf Grund der Modernisierung auch immer wieder neue, intiutiv verständliche Oberflächen anbieten. Softwarehersteller weichen daher immer öfter vom Standard ab und stellen dem Anwender Oberflächen zur Verfügung, bei denen das Prinzip „look & klick“ umgesetzt wird. Eigenschaften dieser Oberflächen sind häufig besondere Formen für Buttons oder Fenster, die mit den Standarddialogen nicht realisiert werden können. Als Beispiel für diese Technik soll hier nur einmal kurz der MP3-Player WinAmp genannt werden.

Um Ihnen zu zeigen, daß auch Visual Basic diese Technik beherscht, soll in den folgenden Kapiteln dargestellt werden, wie eine Umsetzung dieser Technik in VB aussieht.

Rechteckige Fenster - der ganz normale Standard

Die Darstellung eines Fensters auf der Windowsoberfläche ist für einen Programmierer das einfachste von der Welt. Man zieht in VB per Drag & Drop ein paar Steuerlemente auf die Form, startet die Anwendung und fertig ist das ausführbare Programm mit Oberfläche. Die realität sieht aber ein wenig anders aus. Windows stellt Fenster dar, indem es Bitmaps, genauer gesagt Teile einer großen Bitmap, „zeichnet“ oder „einfärbt“. Das zeichnen oder darstellen der Fenster wird dabei von Windows übernommen. Der Programmierer braucht sich also nicht damit beschäftigen. Windows verlangt nur, daß für einzelnen Fenster gewisse Parameter definiert werden. Diese Parameter können auch in Form einer vordefinierten Klasse zugewiesen werden. Windows kümmert sich also um die Ausführung Ihrer Wünsche und positioniert ein Fenster mit dem richtigen Aussehen an der richtigen Stelle.

Soweit keine anderen Angaben gemacht werden, sind alle Fenster rechteckig. Dadurch wird die Geschwindigkeit einer Anwendung erhöht, da sich rechteckige Bitmaps einfach schneller aufbauen und bewegen lassen.

Untypische Formen für Fenster - API

Nicht rechteckige Formen lassen sich nicht nur für Fenster einsetzen. Sie können auch auf Steuerelemente angewandt werden. Um diese untypischen Formen zu erzeugen, werden nun sogenannte „Regionen“ definiert. Regionen sind beliebig geformte Bereiche von Fenstern (eigentlich von Bitmaps). Sie können sichtbar oder unsichtbar sein. Ohne weitere Angaben wird standardmäßig eine sichtbare rechteckige Region auf dem Bildschirm belegt. Um dieses zu ändern, hat Microsoft Windows einige API-Funktionen spendiert. Man hat nämlich schon halb gewonnen, wenn man weiß, wo sich die Eckpunkte seines Fensters befinden.

Dazu ein Beispiel:

Abbildung 1: Region mit abgerundeten Ecken

Stellen Sie sich vor, Sie wollen ein Fenster mit abgerundeten Ecken darstellen. Durch die abgerundeten Ecken hat der Umriß dieses Fensters weit aus mehr Ecken, als ein rechteckiges Fenster, da jede Kurve als eine Zusammensetzung unendlich vieler kurzer Geraden dargestellt werden kann. Diese Linie (Umriß) kann nun mathematisch gesehen als ein Polygon beschrieben werden. Polygone sind Vielecke, die überall dort einen Eckpunkt besitzen, wo sich die Richtung der Umrißlinie ändert. Durch dieses Polygon werden jetzt die Eckpunkte unserer Region festgelegt.

Die Windows - API

Wie oben schon erwähnt, hat Microsoft Windows einige API-Funktionen spendiert, um den Bedürfnissen nach unregelmäßig geformten Fenstern nachzukommen. Mit diesen Funktionen lassen sich Regionen in der Form von Kreisen, Rechtecken, Elipsen und Polygonen erzeugen. Eine Kombination dieser Geometrien ist ebenfalls möglich.

Funktion	Beschreibung
CreateEllipticRgn	Region in elliptischer Form
CreateRectRgn	Region in rechteckiger Form
CreateRoundRectRgn	Region in rechteckiger Form mit abgerundeten Ecken
CreatePolygonRgn	Region in polygonaler Form. Dazu wird ein Punkte-Array benötigt.
CombineRgn	Kombiniert mehrere Regionen
SetWindowRgn	Weist eine Region einem Fenster-Handle zu

Tabelle 1: API-Funktionen für Regionen

Desweiteren gibt es noch einige Flags, die definieren, wie die Regionen kombiniert werden. Dadurch können komplexere Regionen zusammengestellt werden. Dabei muß man zwischen zwei Möglichkeiten unterscheiden. Die Addition von Regionen und die Subtraktion von Regionen. Bei der Addition werden zwei Regionen miteinander vereint und bei der Subtraktion wird eine Region aus der Anderen herausgeschnitten.

Flag	Beschreibung
RGN_AND = 1	Verbindet die überlappenden Bereiche zweier Regionen
RGN_OR = 2	Verbindet zwei Regionen
RGN_XOR = 3	Verbindet zwei Regionen und entfernt überlappende Bereiche
RGN_DIFF = 4	Bereiche von Region 1, die nicht Teil von Region 2 sind
RGN_COPY = 5	Erzeugt eine Kopie von Region 1

Tabelle 2: Flags für Regionen

Der Umgang mit Regionen

Der Umgang mit den Regionen soll hier nun etwas genauer dargestellt werden. Es wird an einem Beispiel erklärt, wie Sie Ihrem VB-Formular eine neue Form geben. Im Beispiel wird die Verwendung der geometrischen Grundformen behandelt. Die Verwendung einer Polygon-Region zur Erstellung beliebiger Formen wird in einer späteren Version diesem Workshop hinzugefügt. Die Polygon-Region wird einzeln behandelt, da hierbei beliebig komplexe Formen erzeugt werden können und dieses etwas komplizierter ist.

Regionen aus geometrischen Grundformen

Bevor man sich an die Programmierung setzt, sollte man einige Überlegungen anstellen, wie die Form überhaupt aussehen soll. Versuchen Sie zuerst, Ihre Form in möglichst einfache Grundbestandteile (einfache geometrische Formen) zu zerlegen. Stellen wir uns einmal vor, wir wollen eine Form bestehend aus einem Kreis und einem abgerundeten Rechteck darstellen.

Abbildung 2: Form des ersten Beispiels

Man kann unschwer erkennen, daß sich unser erstes Beispiel aus den Grundformen Kreis und Rechteck mit abgerundeten Ecken zusammensetzt. Dafür werden zur Darstellung des Kreises die API- Funktion CreateEllipticRgn und für das Rechteck die API-Funktion CreateRoundRectRgn eingesetzt.

Sie dürfen sich jetzt nicht wundern, daß die Windows-API nur eine Funktion für die Erzeugung von Kreisen und Ellipsen zur Verfügung stellt, da ein Kreis ja eine spezielle Form der allgemeinen geometrischen Ellipse ist. Ebenfalls ungewöhnlich ist, daß für den Kreis nicht Mittelpunkt und Radius angegeben werden muß, sondern die Eckpunkte des Rechtecks, welches den Kreis umgibt. Diese Angaben müssen in absoluten Pixelwerten gemacht werden.

Abbildung 3: Definition der Eckpunkte des Kreises

Die zweite Grundform unseres Beispiels ist das Rechteck mit abgerundeten Ecken. Dafür wird die API-Funktion CreateRoundRectRgn verwendet, welche als Parameter die absoluten Eckpunkte und den Radius der abgerundeten Ecken erwartet.

 
Abbildung 4: Definition der Eckpunkte des abgerundeten Rechtecks

Nachdem diese ersten Grundüberlegungen geschehen sind, können wir uns jetzt an der Umsetzung unseres Beispieles zu schaffen machen. Hier wird jetzt nur auf die wichtigsten Funktionen und Deklarationen eingegangen. Den kompletten Quellcode finden Sie als Download-Link am Ende des Workshops. Für unsere beiden Grundformen müssen wir zu Begin jeweils eine eigene Region mit einer API-Funktion erzeugen.

Dim RegionA As Long
Dim RegionB As Long
 
RegionA = CreateEllipticRgn(0, 0, 100, 100)
RegionB = CreateRoundRectRgn(90, 0, 150, 101, 10 , 10)

Die Angaben der absoluten Pixelwerte beziehen sich dabei auf ein Koordinatensystem, dessen Ursprung (0,0-Koordinate) in der linken oberen Ecke des Formulars hat, dessen Form verändert werden soll. Die positive X-Achse des Koordinatensystems dehnt sich dabei nach rechts aus und die der Y-Achse nach unten.

Diese beiden einzelnen Regionen können nun wie oben schon beschrieben zu einer Region addiert werden. Dadurch erhält man eine neue Gesamtregion, die aus den beiden einzelnen Regionen A und B besteht. Im Quellcode würde dieser Vorgang folgenermaßen aussehen:

Const RGN_=R = 1
Dim GesamtReg As Long
GesamtRgn = RegionA
CombineRgn GesamtRgn, GesamtRgn, RegionB, RGN_OR

Zum Schluß müssen wir die erzeugte Gesamtregion noch dem Formular zuweisen. Dabei ist zu beachten, daß sich die Region auf das gesamte Formular bezieht, also auch auf die Titelleiste und auf den Rahmen. Deshalb ist es sinnvoller, in den Formulareinstellungen die Eigenschaft Borderstyle auf „0“ zu setzen.

SetWindowRgn Me.hWnd, GesamtRgn, True

Der Bereich, der anschließend vom Formular noch sichtbar ist, sieht folgendermaßen aus:

Abbildung 5: Ergebnis des ersten Beispiels

So, das wars!
Grundsätzlich lassen sich auf diese Weise alle erdenklichen Formen herstellen, da sich die einzelnen unterschiedlichen Regionen beliebig zusammensetzen lassen. Es ist sogar möglich, mit dem RGN_DIFF-Flagg Teile aus einem vorhandenen Formular herauszuschneiden.