Tutorial 4: Panels
Im vorhergehenden Tutorial behandelten wir die Buttons. In diesem Tutorial werden wir ein schwierigeres MaxGUI-Gadget anschauen, die Panels.
Zum Panel erstellen benutzen wir die CreatePanel-Funktion mit folgender Syntax:
Function CreatePanel:TGadget(x,y,w,h,group:TGadget,style=0,title$="") |
Lass uns sehen, wie das einfachste Panel aussieht.
SuperStrict
|
Nicht sehr überraschend, wie du unten sehen kannst. Eigentlich schaut es genau gleich aus wie in unserem ersten Tutorial über CreateWindow.
|
Ein Panel kann drei Styles haben:
Konstante | Bedeutung |
---|---|
PANEL_BORDER | Das Panel ist mit einem Rand gezeichnet |
PANEL_ACTIVE | Das Panel generiert Mausevents |
PANEL_GROUP | Das Panel ist mit einem Text und einem viereckigen Rand gezeichnet |
Lass uns einen Rand um das Panel ziehen, indem wir den PANEL_BORDER Style benutzen.
SuperStrict
|
Jetzt hat unser Panel einen 3D-Rand.
|
Der nächste Style, PANEL_GROUP, erlaubt uns einen Namen auf unserem Panel anzuzeigen.
SuperStrict
|
Das Panel hat jetzt einen hübschen Rahmen und oben links einen Namen.
|
Abgesehen dass Panels unsere Fenster schöner machen, haben sie auch einen andern Nutzen. Das Gruppieren von Radiobuttons ist einer davon.
Lass uns unser Radiobutton-Beispiel vom vorherigen Tutorial nochmals benutzen, jetzt aus einem anderen Grund.
SuperStrict
|
Das Problem hier ist, dass wir nur einen Radiobutton von den vier auswählen können. Wie können wir machen, dass der Benutzer seine favorisierte 2D und 3D-Sprache auswählen kann?
|
Hier ist es, wo uns die Panels entgegen kommen. Unser Programm kann wie folgt umgeschrieben werden:
SuperStrict
|
Jetzt können wir sehen, dass die Panels uns erlauben, für jede Gruppe eine Antwort auszuwählen.
|
Bevor wir zum letzten Style, PANEL_ACTIVE, übergehen, lass und eine andere interessante Fähigkeit von Panels erforschen. Ich meine damit das ändern der Hintergrundfarbe und das setzten eines Hintergrundbildes.
Lass uns mit dem Ändern der Hintergrundfarbe beginnen.
SuperStrict
|
Wenn du dieses Programm ausführst, solltest du das folgende bekommen:
|
Wie du sehen kannst, haben wir infolge von SetPanelColor nun ein farbiges Panel. Die Parameter für SetPanelColor sind
- Der Name des Panels, das farbig werden soll
- Der RGB-Wert der Farbe. Wenn du nicht weisst was das ist, experimentiere mit 3 Zahlen zwischen 0 und 255 => probiere 255,255,255 oder 0,0,0 oder 200,154,0 etc.
Die Syntax ist:
Function SetPanelColor( panel:TGadget,r,g,b ) |
Ein interessanteres Feature ist die SetPanelPixmap-Funktion. Anstatt einer Hintergrundfarbe kann man ein Hintergrundbild setzen. Die Syntax sieht so aus:
Function SetPanelPixmap( panel:TGadget,pixmap:TPixmap,flags=PANELPIXMAP_TILE) |
Lass uns an einem simplen Beispiel ausprobieren, wie es aussehen würde:
SuperStrict
|
Jetzt zeigt unser Panel ein sich wiederholendes BlitzMax-Logo an.
|
Local image:TPixmap=LoadPixmap("D:My Documents on E_TutorialsB-max.png") |
Die obige Codezeile lädt ein Bild von einer Datei. Du musst deinen eigenen Bildpfad angeben, dass dieses Beispiel funktioniert. Sonst bekommst du nur ein leeres Panel mit keinem Bild drin.
Die SetPanelPixmap funktion hat verschiedene Flags um das zu beeinflussen, was wir vorhin gesehen haben:
Konstante | Bedeutung |
---|---|
PANELPIXMAP_TILE | Das Bild wird wiederholt. (Standard) |
PANELPIXMAP_CENTER | Das Bild wird in der Mitte des Panels angezeigt. |
PANELPIXMAP_FIT | Das Bild wird skaliert, um am Besten in das Panel zu passen. |
PANELPIXMAP_STRETCH | Das Bild wird gestreckt, um das Panel auszufüllen. |
Der TILE-Style ist der normalerweise eingeschaltete Style. Dieser Style arbeitet so, wie man es auch manchmal auf Webseiten sehen kann. Lass uns sehen wie der STRETCH-Style aussehen würde:
SuperStrict
|
Unser BlitzMax-Logo ist nun gestreckt um das Panel auszufüllen.
|
Ich will es als deine Übung belassen, dass du ausprobierst, wie die anderen Styles arbeiten.
Zum Schluss...
Das ist das Ende dieses Tutorials. Im Nächsten, werden wir die Mausevents behandeln, den Style PANEL_ACTIVE von CreatePanel.
So, bevor wir dieses Tutorial abschliessen, lass uns nochmals überdenken, was wir gelernt haben.
- Panels sind Gadgets, die uns erlauben unsere Gadgets zu gruppieren
- Panels können einen Rand, eine Hintergrundfarbe oder ein Hintergrundbild haben
Das Tollste an den Panels ist, ihre Fähigkeit Mausevents auszulösen, was wir als nächstes behandeln.