Zombie - Immediate Mode GUI

Kommentare anzeigen Worklog abonnieren
Gehe zu Seite Zurück  1, 2

Worklogs Zombie - Immediate Mode GUI

10. Und es ward Weihnachten

Samstag, 26. Dezember 2009 von ComNik
Moin,

zu erst einmal hoffe ich ihr hattet ein paar schöne Feiertage.
Nun zum eigentlichen Sinn hinter diesem Eintrag:

Die WarpGui ist seit gestern morgen wieder in Arbeit. Ich habe das Update und Zeichensystem neu geschrieben und eingebaut. Das ganze ist sehr abstrakt gehalten.
Was heisst das?

Alle Gadgets können auf alles abgefragt werden. Also könnte man, wenn mal wollte, eine ImageBox auf einen Mausklick abfragen und entsprechend reagieren.

Arrow Gadgets haben ein neues Field, welches im Moment noch "drag" heisst. Agiert in etwa wie ein Schalter. Jedesmal wenn das Gadget geklickt wird verändert sich das Field. Somit kann man I/O Schalter realisieren. Oder eben für Drag'n'Drop...

Ich bin auch das Problem losgeworden das wenn man das Menü auf einen Klick abfragt (zum Beispiel um es an die Maus zu heften) und einen drauf platzierten Button auch, so bewegt sich natürlich das Menü owohl es ja streng genommen nicht geklickt wurde, sondern nur der Button.
Ich frage also einfach nach der Update Funktion eines jeden Gadgets ab ob sich sein Status geändert hat.
Wenn das der Fall ist wird der Parent einfach normalisiert.

Soweit so gut.

Gadgets:
Implementiert:
Arrow Menu - Das oberste Parent Gadget
Arrow Button - is klar
Arrow Textarea - Input Box
Arrow Tabber - Verändern einfach nur die Sichtbarkeit eines Gadgets
Arrow Label - Zeigt einen Text an
Arrow CheckBox - Eine Art Schalter (eig nur das "drag" Field eines Buttons)

Geplant:
Arrow Interface - öfters erklärt, ist aber nun kein Parent mehr sondern wird an ein Menü gehängt
Arrow Icon - auch öfters erklärt
Arrow TabGroup - mehrere Tabber die sich gegenseitig beeinflussen
Arrow ImageBox- Trivial, mach ich heute noch rein
Arrow ListBox - besteht nur aus einem Tabber, einem Menü, einem Label und ein paar Buttons

Sobald die drinn sind und getestet, kommt ein erstes Release. Danach nutze ich die GUI solange bis mir ein Gadget fehlt (sollte jemand außer mir die GUI nutzen kann der natürlich auch Anregungen geben).
Dann füge ich es hinzu und mach hier ein neues Release. McGUIver muss noch ein kleines Weilchen länger warten.

lg
und guten Rutsch noch,
ComNik

9.Resurrection - Schöner Code, keine Bugs

Sonntag, 29. November 2009 von ComNik
Howdy,

Schlüsselsatz des letzten Eintrags: "Der Code ist in sich zusammengefallen"
Das gilt erfreulicherweise nicht mehr Smile

Arrow Viele überflüssige Gadgets wurden durch Kombination vorhandener ersetzt
Arrow Flags werden jetzt sogar vom system beachtet...
Arrow Gadgets werden jetzt sinnvollerweise standardmässig an ihre Parents geheftet

Weiterhin wurde der Code in sinnvollere Includes eingeteilt. Die Gadgets werden nach und nach wieder implementiert.

Arrow SubMenus entfallen komplett. Sie waren totaler Blödsinn und können nichts was Menus nicht auch können

Ansonsten wie gesagt alles im Aufbau aber es geht rasend voran, dafür das ich vor 2 Stunden angefangen habe.

lg und frohen ersten Advent,
ComNik

8. Nein er hat nicht aufgegeben

Samstag, 24. Oktober 2009 von ComNik
Wie immer guten Abend,

Nein natürlich habe ich die GUI nicht aufgegeben, wäre sehr dumm von mir ich brauche sie in vielen Projekten.
Durch unmotivation und ein kleines privates Problem ging es aber nicht so schnell weiter wie sonst.

Der Code ist leider in sich zusammengefallen. Ich möchte jeden der das hier liest darauf aufmerksam machen wie wichtig Planung ist. Neu schreiben muss ich zwar aber es eilt nicht aus folgendem Grund: Ich weiss genau wie ich ihn neu schreiben muss, die Planung ist fertig ( Rolling Eyes ). Ich nutze die Zeit um alle geplanten Gadgets einzeln zum Funktionieren zu bringen. Wenn alle klappen werden sie direkt in den neuen Code mit rein fliessen und das Dingen sollte fertig sein Smile

In diesem (nunmehr vierten) Rewrite achte ich vor allem darauf, vorhandene und gesetzte Flags auch in der Update Funktion zu berücksichtigen... Außerdem wird der ganze Code verstärkt auf OOP ausgelegt. Zusätzlich wende ich zwei liebgewonnene Techniken ein. Einmal das Test-Driven-Development sowie Code Reviews. Ersters implementiere ich, indem McGuiver "fertig" geschrieben wird, ohne alle Funktionen zu haben. Wen dies geschehen und der Rewrite (zu Version 2.0 8) ) fertig ist, kompilier ich den Editor und schau obs Fehler gibt. Ich versuche wenn möglich alle geplanten Funktionen im McGuiver irgendwie zu verwenden.

Letzteres ist eigentlich nur zum debuggen gut, ich drucke nach ca. 200 neuen Zeilen den Code einmal aus und lese ihn mir durch um nach Fehlern zu suchen und die ganzen Schritte durchzugehen etc.. (klingt vielleicht blöd aber ich mags).

Außerdem wurde ich durch Silver_Knee zu einer interressanten kleinen Idee inspiriert diese verlangt aber noch ein bisschen Zeit und wird hier nur bei Erfolg vorgestellt Wink

So was will ich mit diesem Eintrag sagen?
- Es wird lange nichts von mir zu hören sein. Wahrscheinlich so bis Weihnachten. Eventuell mal ein vorgestelltes Gadget aber keine großen Neuerungen. Das liegt nicht daran das ich für einen Editor 2 Monate brauche sondern an verschiedenen anderen Projekten und der Planung zu einem Spiel.

Wünscht mir ein bisschen Erfolg und gute Nacht,

ComNik

7. Von Pointern und Bugs

Samstag, 19. September 2009 von ComNik
Guten Abend (merkwürdig immer nur Abends Wlog Einträge...),

Zu allererst möchte ich Mark Sibly in höchsten Tönen loben, dass er seinem BlitzMax Pointer spendiert hat. Das Toolsystem von McGUIver wäre soweit fertig (:
Bei einem Klick auf ein Icon in der Toolbox wird ActiveFunc() (ein globaler Funktionspointer) auf eine der Tool Funktionen gesetzt. Die Tool Funktionen werden jetzt noch fertiggestellt, aber es klappt eigentlich alles.
Soviel zu den erfreulichen Neuigkeiten.

"Bei einem Klick..." erwähnte ich im oberen Absatz. Mir ist ein schwerwiegendes Problem aufgefallen was mich zu drastischen Überlegungen führt. Sobald ich MouseHit()/Down() für etwas anderes als das Klicken von Buttons/Icons verwende wird das Klicken ignoriert. Blöd wa? Meine Idee: Buttons (z.B) nur updaten wenn der Mauszeiger überhaupt im Parent Menu drinne ist. Super direkt umgesetzt. Nächstes Problem...
Da die WP_UpdateButtons() Funktion nur aufgerufen wird wenn der Zeiger im Menü ist werden die Buttons auch logischerweise nicht gezeichnet wenn der Zeiger ausserhalb des Menüs ist.
Ich habe mich also entschlossen die WP_Update-Funktionen zu teilen. In einmal "WP_Update<Gadget>()" und in "WP_Draw<Gadget>()". Dieses System erleichtert einiges. Sobald das läuft bin ich glücklich...

Die im letzten Eintrag angekündigten Änderungen/Neuerungen sind eigentlich alle umgesetzt. Halbleiter muss sich nur nochmal von seinem C++ Flash absehen und mir ein kleines SubMenu Image pinseln.
Dann gibts wieder was zu sehen und evtl eine kleine McGUIver Demo.

Résumé:
Wer BlitzMax hat und es noch nicht getan hat: Schaut euch Pointer an. So toll wie in C++ und so einfach wie von BlitzMax gewöhnt

Das war die Moral und gleichsam das Wort zum Sonntag, auf Bald.

6. Zwischenreport

Montag, 7. September 2009 von ComNik
Guten Abend,
die Arbeit des heutigen Tages ist eigentlich keinen Eintrag Wert... Aber trotzdem. Die Schule hat wieder angefangen aber jetzt wo der Bcc Beitrag so gut wie fertig ist, habe ich eigentlich genügend Zeit. Nun ja heute wollts irgendwie nicht so. Ich habe einige Ideen gesammelt über die letzten Wochen.

Arrow SubMenus und Tabber:
Zwei, wie ich finde, sehr wichtige Gadgets. Das SubMenu ist eigentlich nur ein Menu das ein Menu als Parent hat. Es kann genauso Buttons etc.. enthalten. Aber: Es kann an einen Tabber gehängt werden. Wenn dieser Tabber angeklickt wird, wird "unter ihm" das SubMenu eingezeichnet. Natürlich können SubMenus auch ohne Tabber existieren... Fügt man den Tabber einer Gruppe von Tabbern hinzu, so "minimiert" er automatisch alle anderen Tabber in dieser Gruppe wenn er aktiv geschaltet wird. Somit ist die Grundlage für ein paar andere Sachen gelegt:

Arrow ListBox
Absolutes Standardgadget. Ich habe mir die Realisierung so vorgestellt: Ein Label mit einem Tabber am Ende (oder Anfang). Klickt man auf diesen Tabber so wird ein SubMenu ausgeklappt (die ListBox). In dieser sind nun die einzelnen Möglichkeiten in Form von Buttons aufgelistet (Natürlich ist auch hier alles skinbar). Klickt man auf einen der "Buttons", wird die Caption des Labels mit der Caption des Buttons überschrieben. Was fliessend zum nächsten Punkt führt...

Arrow Kleine Erweiterungen bei Captions
Einmal haben Captions nun ein Offset (X und Y) um nicht immer zentrierte Beschriftung haben zu müssen. Außerdem ist der Bug mit eben dieser Zentrierung nun behoben und alles ist toll...
Zweite "Neuerung" ist die Möglichkeit die Farbe der Caption zu bestimmen.

Arrow Tool Tipps
Is klar was das sein soll. Klappt auch ganz gut. Allerdings gibt es noch Probleme mit dem ToolTipp Bild und dessen einbinden ins Programm Confused


Auf meiner Liste steht sonst noch:

Arrow Runde Buttons
Arrow Fonts
Arrow Eine NextGadget() Funktion, um mit der Tastatur durch die Gadgets zu schalten
Arrow Hot Keys

...und natürlich noch viele Gadgets.

Apropos Gadgets: Die Message Box wurde einer Änderung unterzogen. Es wird nun intern einfach ein SubMenu verwendet. Danke Halbleiter Wink

Bugs gibt es im Moment keine. Allerdings wurde auch erst ca. 50% aller Funktionen mithilfe von McGUIver getestet.

Ich hoffe ich kann alle diese Dinge innerhalb der Woche umsetzen und dann wieder einen richtigen Eintrag mit Bildchen etc.. zu machen. Dann gehts an das erstellen einer Demo und an McGUIver, und damit ich nicht alles jetzt erzähle was ich beim nächsten Eintrag erzählen will,

Gute Nacht,
ComNik

5. McGUIver die Dritte

Sonntag, 30. August 2009 von ComNik
Guten Abend,

Zuallererst: Halbleiter ist wieder voll bei der Sache. Produziert am laufenden Band Icons und Grafiken(siehe Screenshot weiter unten).

Zu McGUIver: Ich hab heute die neuen Icons von Halbleiter ins Interface eingebaut. Außerdem hab ich mir ein paar Gedanken zu McGUIver gemacht.

Arrow Wie löst man das Auswählen von Tools und dann das erstellen von Gadgets damit?
Nun ich habe mir soetwas wie eine Tool-Klasse überlegt. Je nachdem auf welches Gadget gerade
geklickt wurde wird ActiveTool:TTool gesetzt. Wenn ich nun irgendwo auf die Arbeitsfläche klicke wird ein neues Gadget an diesen Koordinaten und mit Defaults erstellt (je nach Tool). Wenn ich dieses Gadget nun anklicke wird der (aus VC++ bekannte) Objekt Manager aufgerufen, der die Eigenschaften des Gadgets anzeigt. Diese kann man nun gannz einfach bearbeiten. Standardmässig wird erst ein Rechteck für die Gadgets gezeichnet. Sobald man im Objekt Manager dem Gadget eine "Textur" zugewiesen hat, wird diese gezeichnet.

Arrow Wie speichere ich die entstandene Gui?
Das dürfte sich eigentlich einfacher gestalten. Wenn man das Projekt zum erstenmal speichert wird eine neue .bmx Datei angelegt. Für jedes Gadget wird nun die Funktion die es erstellt mit den richtigen Werten in die Datei geschrieben.
Zum Beispiel für einen Button an 100,250 50px breit und 20px hoch und mit den Werten VISIBLE, ENABLED,"Ich bin ein Button" der Grafik ButtonImage sowie dem Parent TollesMenü: WriteLine("WP_AddButton("+B.X+","+B.Y+","+B.Width+","+B.Height+","+B.Caption+","B.Parent+","+B.Image+")")

(und ja ich hab jetzt den Stream weggelassen..)
Einigermassen verständlich? Ich denke schon. Wenn jetzt die Eigenschaften wie VISIBLE oder ENABLED von Standardwerten abweichen, wird das natürlich auch reingeschrieben.

Das entstehende .bmx File kann man dann in der Theorie einfach mit Include/Import einbinden.

Das wars soweit erstmal an Aufgaben (hoffentlich...).

Zum Schluss nochmal einen Screenshot des neuen Designs (hellgrüner Hintergrund wird noch geändert...):
user posted image

Ich hoffe man erkennt die Icons.
Nächstes mal geht es wieder um zwei neue Gadgets, bis dann.

ComNik

4.McGUIver + Renovierung

Mittwoch, 26. August 2009 von ComNik
Guten Abend,
nein Heute kein Gadget aber dafür ein paar andere Sachen. Der Basis Code wurde nochmal aufgeräumt, optimiert sowie strukturiert. Ich kann jetzt wirklich perfekt mit arbeiten. Viele kleine Funktionen wurden eingespart, so werden Gadgets jetzt nichtmehr mit WP_MoveButton()/Icon()/etc... sondern mit WP_MoveGadget() bewegt, und viele Dinge dieser Art. Alle Gadgets können auf einen Mausklick abgefragt werden, mann weiss ja nie.
Kommen wir zu McGUIver:

Es macht sehr viel Spass ein Projekt mit einer selbstgeschriebenen GUI zu machen musste ich erfahren. Gleichzeitig kann ich ale Funktionen testen und Bugs finden. Im Moment habe ich nur einen kleinen gefunden, der die Schrift auf den Buttons ein bisschen nach oben-links zieht^^

Ansonsten bin ich sehr zufrieden mit Schnelligkeit und Stabilität. Allerdings ist sie auch noch überhaupt nicht beansprucht. Hier erstmal ein kleiner Screen des derzeitigen Entwicklungsstandes von McGUIver.
Anmerkung: Halbleiter hat gerade mit RL-Problemen zu ringen, entschuldigt das unschicke Äußere...
user posted image

Ja was sieht man hier?
Ein paar Buttons und ein hässliches Gitter. Daran kann ich aber eigentlich das komplette System veranschaulichen. Die Buttons gehören zu dem (hier unsichtbaren) Menü, oben am Fenster. Mit einem Tastendruck kann ich das komplette Menü ausblenden. Buttons können selbstverständlich disabled werden, das Menü selbst auch. Alle Gadgets können eine DONT_DRAW Flag verpasst bekommen. Dann werden sie( im Gegensatz zu WP_HideGadget()) weiterhin geupdatet, aber nicht gezeichnet.

Wie schon vor langer Zeit gesagt, kann das Button Image beliebig angepasst werden, das menü natürlich ebenso. Kommen wir zu dem hässlichen Gitter: Das ist das Interface Gadget (nicht vom Äußeren täuschen lassen!). Dieses merkwürdige Ok! Fenster ist ein Icon. Icons können ganz normal geclickt werden. Drag und Drop geht im Moment nur als Workaround, ist aber einfach zu implementieren. Das Interface kann ich auch auf Knopfdruck aus/einblenden. Ansonsten kann es nicht viel. Muss es auch nicht. Seine einzige Aufgabe ist Icons zu beinhalten.

Ich hoffe man konnte sich darunter ein bisschen was vorstellen. Bis Halbleiter wieder auf dem Damm is, mach ich mit meinen untertalentierten Grafiken weiter, und tausche dann am Ende einfach alle aus.

So das wars auch schon, ach nein halt eine kleine Liste geplanter Gadgets:

    SubMenu
    Tabber
    Label
    MessageBox
    Combo/Checkbox
    Listbox
    und einige weitere...


Das wars jetz aber wirklich, gute Nacht!

3.Gadgets #2: ImageBox + McGUIver Planung

Donnerstag, 20. August 2009 von ComNik
Morgen mal wieder.
Nur kurz, ImageBoxes sind keine grosse Sache nur halt eben auch ein Gadget. Also es gibt sie und alles funktioniert. Ich starte jetzt auch mit den Arbeiten an McGUIver womit ich gleich ein bisschen das Test-Driven-Development üben kann. Ich schreib einfach mal wie ich mir McGUIver geplant hab.

Also McGUIver wird natürlich noch mit der WarpGUI geschrieben. Danach mache ich selbstverständlich alle GUI arbeiten nur noch mit dem Editor *träum*. Nun ja also es gibt ein simples Interface um (Paint-Like...) die "Werkzeuge" auszuwählen. Dann einfach wie in Visual Studio auf der Arbeitsfläche herumziehen und sobald man losgelassen hat kann man die Eigenschaften des Gadgets in einem Fenster bearbeiten. Soweit so einfach. Sobald man die GUI speichert, werden alle Daten als Parameter auf die verschieden Funktionen übertragen und in einer .bmx Datei gespeichert. Diese einfach einbinden. Anschliessend hat man (wie In VC++...) zugriff auf die einzelnen Gadgets, und muss sich nur noch mit Funktionen alá WP_ButtonClicked() herumschlagen.

So in der Theorie steht das natürlich alles schon. Die Toolbox wartet noch auf Grafiken meines vielbeschäftigtem n-halbleiters Wink

Der nächste Eintrag wird erst kommen sobald ich entweder McGUIver grafisch zeigen kann oder ein paar von den Gadgets.

Danke für die Aufmerksamkeit, ComNik

2.Gadgets #1: Textarea

Donnerstag, 13. August 2009 von ComNik
Guten Abend.

Also eins nach dem anderen.

1. Da ich nun ein Team zusammen mit Halbleiter gegründet habe, werden sämtliche Projekte natürlich ein bisschen umgewurstet. Für WarpGui heisst das nichts Besonderes. Halbleiter fertigt ein paar schöne Grafiken für McGUIver (auch mit Blick auf unsere weiteren Projekte) an und ich habe das Ziel am Ende alle eingebaut und in Aktion sehen zu können. Im Moment bin ich also dabei eine Liste aller Gadgets zu erstellen die in Planung sind. Diese wird dann hier natürlich auch erscheinen.

Diese Arbeitsweise spart viel Zeit, da ja sozusagen Parallell entwickelt wird.


Zur Überschrift:
Nun wie versprochen ein Eintrag über ein neues Gadget. Es ist ganz wichtig in jeder Gui und auch ziemlich umfangreich. Nun ich habe heute mal (nach 3 Tagen Urlaub) alle Textarea Funktionen umgeschrieben. Das Resultat ist natürlich nicht vollkommen fertig aber schon gut benutzbar.

Jeder Textarea kann eine eigene Font zugewiesen werden, sowie einen "Background" in Form eines Bildes. Alle Grundfunktionen wie schreiben(!) und sogar löschen(!!) funktionieren ein und mehrzeilig sehr gut. Im Moment arbeite ich an einer Zwischenablagen-Funktion sowie dem Markieren von Zeilen etc...

Die Textareas habe ich jetzt einfach wie sie sind eingebunden. Sie werden je nachdem wie sie benötigt werden erweitert.

Bilder kommen sobald der neue Style fertig ist. Dann kann ich auch mal eine kleine Demo rausbringen die die Interface Gadgets sowie Buttons etc.. besser erläutert.

Soweit so gut,
ComNik

1. Wieeeder ne Gui...

Donnerstag, 6. August 2009 von ComNik
Zum xten mal guten Abend liebes Forum!

1.Warum denn wieeeeder ne Gui??
2.Schon wieder ein Worklog von ComNik, machste doch eh nich fertig!

Zu 1: Ja es ist wieder eine Gui (für BMax). Spezialisiert auf Spiele, also nix Fenster sondern mehr so Ingame Gui.
Was ist dann da nu das besondere?
Nichts. Besonders ist nur der "MacGUIver" getaufte Editor. Der hat die Aufgabe dem Anwender das
erstellen eines Ingame-Menüs zu erleichtern. Wie in Visual Studio platziert man seine Gadgets und bindet die
entstehende .bmx Datei in sein Spiel ein. Ich persönlich fand das erstellen eines Menüs mit absoluten
Koordinaten im Code immer ziemlich mühsam.

Zu 2: Ja es ist wieder ein Worklog. Aber die Gui ist fertig. Dieser Worklog dient nur dazu die einezelnen und
neu eingefügten Gadgets vorgestellt. Solltet ihr eine Gadget Idee haben, bitte in den Kommentaren
erwähnen.

-----------------------

Zur Gui:
Das ganze basiert auf der WP_Gadget Klasse. Alle anderen Gadgets erben von ihr.
Dann gibt es noch zwei "parent"-Gadgets. "WP_Menu" und "WP_Interface". Menus
können Buttons, Input Felder etc... enthalten. Sie können verschoben und versteckt werden.
Interfaces heissen so weil ich nicht wusste wie ich das benennen soll...
Sie eignen sich für das klassische RPG-Inventar. Sie enthalten nichts weiter als Icons. Icons
können geklickt und verschoben werden. So ein Gadget hab ich für meinen Teil schon öfters benötigt
deshalb habe ich es auch implementiert.

Die Gui ist komplett skinnbar. Jedem Gadget kann ein eigenes Bild zugewiesen werden. Gadgets können
an ihre Menüs/Interfaces "angeheftet" werden. Sie bewegen sich dann mit dem Menü.

Zu MacGUIver:
MacGUIver ist der Editor für die WarpGui. Er wird selber in der WarpGui geschrieben. Er erzeugt
.bmx Dateien, die man nur noch einbinden muss. Die Bedienung wird sich stark an Visual C++/C#
orientieren. WIRD, weil der Editor das einzige ist was noch nicht fertig ist.

In den nächsten Tagen/Wochen werde ich immer über die neuen Gadgets berichten. Der modulare Aufbau
des Codes macht es für mich ziemlich einfach neue Gadgets einzubinden. Wenn ich eine akzeptable Anzahl
Gadgets implementiert habe, mache ich mich an den Editor. Ich hoffe das Projekt bis zum Ende der
Sommerferien beendet zu haben. Viele meiner aktuellen Projekte benörigen dringend eine Gui.

Hier noch ein Screenshot (sieht ein wenig blöd aus, aber ich hab mich erstmal nicht um eine tolle Skin gekümmert):

user posted image

Der Button ist gerade im HOVER zustand. Daher etwas dunkler. Das aussehen des Buttons und des Menüs ist wie gesagt komplett anpassbar.

Das wars für heute. Bis bald.
ComNik






Gehe zu Seite Zurück  1, 2