Ergebnis 1 bis 9 von 9

Thema: Web GUIs

  1. #1
    Quantenmechaniker
    Registriert seit
    Aug 2002
    Beiträge
    1.997
    Renommee
    283

    Web GUIs

    Moinsen again.

    Ich arbeite momentan u.a. an einer eigenen "Engine" für GUIs im Web-Browser. Im Sinne der Effizienz verwende ich dazu "<canvas>" (SVG
    mag zwar auch nett sein, skaliert aber nicht so gut bei einer großen Anzahl gezeichneter Objekte - ist ja alles zusätzlicher DOM-Code nötig).

    Einfache Sache, ich muss nur die Größen/Positionen in einer DB halten bzw. dort zu Schlüsseln machen, um bspw. beim "onmouseclick" so
    die jew. Pointer-Koordinate zu finden - bzw. eben => "where" ( Mouse.X >= LEFT && Mouse.X <= ( LEFT + WIDTH ) && Mouse.Y (...) // etc.).
    Ich würde weitergehend mit jedem neuen Zeichnen die alten Pixel-Daten ("getImageData()") sichern (als eine Form von "Z-Buffer" o.ä. quasi),
    und wo immer möglich auch nur Differenzen codieren, statt immer die gesamte Fläche neu zu zeichnen oder zu sichern, wo es garnicht nötig
    ist.

    Ich sehe nun nur das Problem, dass ich u.a. auch das "Aufspannen" eines Rahmens mit der Maus selbst zeichnen muss - was entweder so
    gelöst werden kann, dass ich ein Rechteck allein mit dem äußeren Rahmen, also "strokeRect()" zeichne, oder indem ich selbst 4x Striche
    entlang zeichne; was mir lieber wäre, um letztlich beliebige "Vektoren aufspannen" zu können (nehmen wir Polygone/Triangles o.ä.). Jeden-
    falls scheint mir die Verwendung von Punkten und Linien "universeller(/abstrakter)" und somit "zukunftsweisender".


    Nun muss ich aber für den Moment, wo der Rahmen wieder verschwindet oder auch sich erstmal bewegt, die alten Pixel-Daten mit vorliegen
    haben. Regulär würde das "getImageData()" ja für einen Rechteck-Bereich gelten - im Sinne der Effizienz purer Differenzen aber (o.ä.) wäre es
    viel zu viel Overhead, direkt den im Rahmen enthaltenen Bereich mit sichern zu müssen.

    Fragt sich: muss ich hier der Reihe nach den Rahmen umfahren, um Pixel für Pixel - alle einzeln quasi - zu sichern? Oder wie stelle ich dieses
    am besten an? Ansonsten ist die Theorie eines "Z-Buffer" (weiß momentan nicht, was wirklich hinter dem Wort steckt - habe es nur so für mich
    interpretiert ;-)° doch nicht verkehrt, stimmt?

    Evtl. habt ihr ja v.a. Web-Links zu dieser Thematik? Habe schon hunderte Seiten durchgeackert und immer noch verstehe ich 3D-Grafik nicht so
    ganz; aber 2D-GUI ist relativ einfach ... siehe "Create a Game UI with the HTML5 CANVAS".

    Ich hatte auch schon überlegt, einfach ( 3840 x 2160 ) "Zellen" (Objekte) zu verwenden, wo zuerst jede(s) nur den einzelnen ARGB-Farbwert enthält, dann aber
    jede solche Veränderung je Koordinate mit zu sichern, also die Farbwerte in einem Array vorzugeben. Sonst müsste ich mir überlegen, dass ich dennoch sowas
    wie Objekte verwende evtl. oder Layer irgendwie selbst konstruiere, damit für jedes Objekt dessen eigene Zeichnung ergänzt wird um die vorhergehenden, also
    darunter liegenden Farbpixel - und dann irgendwie auf die nächsten (Tiefen-/Z-)Ebenen weitere Objekte mit Pixel-Farb-Differenzen o.ä. ...

    OffTopic:

    Eine zweite Frage noch: gibt es Alternativen dazu, dass die "<canvas>"-Zeichnung direkt mit im JavaScript-Code integriert ist - also überall aus
    kleinen "drawRect()" o.ä. gezeichnet wird - oder gibt es irgendwelche Code-Formate dazu (wie CSS als HTML-Ergänzung)? Bzw. wäre es sinn-
    voll in euren Augen, hier eine eigene Vektor-Zeichnungs-Sprache zu codieren, also sowas wie "<SVG>"-Code, um evtl. die Zeichnungs-Daten
    in zusätzlichen Dateien vorzugeben, statt direkt im JS-Code? Es geht nicht um die vollständige "Erreichbarkeit" aller Zeichnungs-Elemente o.ä.,
    das wäre ja wie SVG ineffizient. Ich denke eher in eine Richtung "LOGO(-Turtle)" o.ä., so dass einerseits zusätzliche Dateien, andererseits ein
    WebSocket für die Anweisungen zur Zeichnung verwendbar werden.

    PS: Wer sich fragt, warum ich das extra selbst implementieren möchte, statt Browser-Formulare o.ä. zu verwenden: einerseits der Spaß daran sowie
    das Wissen um die Hintergründe, andererseits möchte ich komplett von Grund auf eine Art "Library-Software" aufbauen, mitsamt (Document- wie auch IDE-
    Modellierungs-Werkzeugen uvm., weil ich ziemlich viele Software-Ideen habe, für die ich eine solide Grundlage schaffen möchte. Stichwort "agile Codierung"
    bspw., damit ich möglichst wenig Code investieren muss, um daraus möglichst umfangreiche Ergebnisse zu erhalten [irgendwann hab' ich 'ne SW-Schmiede ;-]´
    Geändert von kuchen (05.06.2017 um 23:08 Uhr)

    1 2 3 4 5 6 7 8
    2 1 4 3 6 5 8 7
    3 4 1 2 7 8 5 6
    4 3 2 1 8 7 6 5
    5 6 7 8 1 2 3 4
    6 5 8 7 2 1 4 3
    7 8 5 6 3 4 1 2
    8 7 6 5 4 3 2 1

  2. #2
    Registered User
    Registriert seit
    Sep 2008
    Beiträge
    403
    Renommee
    270

    AW: Web GUIs

    Die effizienteste GUI-"Codierung", die ich kenne, ist ImGui: https://github.com/ocornut/imgui/

    Kannst du ja mal in Visual Studio testen, ob es dir gefällt.

    Die Bibliothek läuft auch im Browser über WebAssembly, aber dazu musste ich noch einiges an Arbeit investieren, bis es brauchbar war. Schließlich wird da viel mit Pointer gearbeitet, und die muss man erstmal "wrappen".

    Das sieht dann z.B. so aus:

    PHP-Code:
    PointerBool = function(value) {
        
    this.pointer _malloc(1);
        
    HEAP8[this.pointer] = value;
    }

    PointerBool.prototype.toString = function() {
        return 
    "PointerBool(" this.deref() + ") at 0x" this.pointer.toString(16);
    }

    PointerBool.prototype.set = function(value) {
        
    HEAP8[this.pointer] = value;
    }

    PointerBool.prototype.deref = function() {
        return 
    HEAP8[this.pointer];
    }

    PointerBool.prototype.free = function() {
        
    _free(this.pointer);
        
    this.pointer 0;

    ImGui Funktionen:


    PHP-Code:
    igDragFloat = function(labelfloatpointer) {
        var 
    c_label alloc_string(label);
        var 
    speed 1;
        var 
    v_min 0;
        var 
    v_max 0;
        var 
    ret _imgui_drag_float(c_labelfloatpointer.pointerspeedv_minv_max);
        
    _free(c_label);
        return 
    ret;
    }

    igCheckbox = function(labelboolpointer) {
        var 
    c_label alloc_string(label);
        var 
    ret _imgui_checkbox(c_labelboolpointer.pointer);
        
    _free(c_label);
        return 
    ret;

    Und die Benutzung so:

    PHP-Code:

    // irgendwo in einem Object ablegen, dass man nicht jeden Frame _malloc() / _free() aufrufen muss
    var boolPtr = new PointerBool(false);

    igCheckbox("Bla Test Checkbox"boolPtr); 
    Über das neue Zeitalter der Gehirne eines Menschen!
    echo 'main() { char z[] = "ping "; for(;printf(z);z[1]^=6); }' > a.c; gcc a.c -o a; ./a # 16.11.2011 02:51

  3. #3
    Registered User
    Registriert seit
    Jul 2003
    Beiträge
    1.508
    Renommee
    642

    AW: Web GUIs

    Könntest Du endlich mal aufhören diesen lernbefreiten Troll zu füttern? Danke.
    Code:
    /* Christian 'strcat' Schneider <http://www.strcat.de/> */
    int y,z;main(x){x=(x>0?-9:x);z=((z=(x+5))>0?z:-z);printf
    (!x&&++y?"\n":z?z>y%3+y/3?" ":x<-5?"/":"\\":y?"|":"*")
    ;y-9?main(++x):puts("  _|_|_")&&puts("  \\___/");}

  4. #4
    Registered User
    Registriert seit
    Sep 2008
    Beiträge
    403
    Renommee
    270

    AW: Web GUIs

    Nein.

    buffet.jpg
    Über das neue Zeitalter der Gehirne eines Menschen!
    echo 'main() { char z[] = "ping "; for(;printf(z);z[1]^=6); }' > a.c; gcc a.c -o a; ./a # 16.11.2011 02:51

  5. #5
    Registered User
    Registriert seit
    Jul 2003
    Beiträge
    1.508
    Renommee
    642

    AW: Web GUIs

    Noch einer auf /ignore *PLONK*
    Code:
    /* Christian 'strcat' Schneider <http://www.strcat.de/> */
    int y,z;main(x){x=(x>0?-9:x);z=((z=(x+5))>0?z:-z);printf
    (!x&&++y?"\n":z?z>y%3+y/3?" ":x<-5?"/":"\\":y?"|":"*")
    ;y-9?main(++x):puts("  _|_|_")&&puts("  \\___/");}

  6. #6
    Quantenmechaniker
    Registriert seit
    Aug 2002
    Beiträge
    1.997
    Renommee
    283

    AW: Web GUIs

    *hrhr "Pointer wrappen" *gg*

    strcat, ich lerne relativ viel. Auch wenn Smartie ebenso was anderes behauptet. Kannste mir glauben,
    problematisch ist nur, dass ich viel Grundlage-"Forschung" betreibe, daher sieht das so aus. Ich bin
    kein Troll. Auch wenn ich hier schon PHP-Mod war, was ja nur eine sehr einfache Sprache ist.

    Im übrigen, fühl dich mal in meine Situation ein. Autodidakt ohne jede Ausbildung. Und alles wissen
    wollen. So viele Themen, die ich auch im Web recherchier und mir alles durchlese. Da wird mir nicht
    einfach was vom Professor vorgegeben oder so. Ich bin sehr fleißig dabei, wirklich.

    Danke, gruena.

    PS: Mein "Quantenzeugs" habe ich auch schon ad acta gelegt. Das war nur pure Software-/Informations-
    Theorie und ich kann da nicht viel neues beitragen, weil es das meiste schon gibt. Also insofern gibt's keine
    oder kaum noch Troll-Posts von mir zu lesen.

    1 2 3 4 5 6 7 8
    2 1 4 3 6 5 8 7
    3 4 1 2 7 8 5 6
    4 3 2 1 8 7 6 5
    5 6 7 8 1 2 3 4
    6 5 8 7 2 1 4 3
    7 8 5 6 3 4 1 2
    8 7 6 5 4 3 2 1

  7. #7
    Registered User
    Registriert seit
    Aug 2000
    Beiträge
    1.079
    Renommee
    448

    AW: Web GUIs

    Zitat Zitat von kuchen Beitrag anzeigen
    PS: Mein "Quantenzeugs" habe ich auch schon ad acta gelegt. Das war nur pure Software-/Informations-
    Theorie und ich kann da nicht viel neues beitragen, weil es das meiste schon gibt. Also insofern gibt's keine
    oder kaum noch Troll-Posts von mir zu lesen.
    wow! es geschehen noch wunder!
    Signatur sowie alle persönlichen Informationen entfernt.

  8. #8
    Registered User
    Registriert seit
    Jul 2003
    Beiträge
    1.508
    Renommee
    642

    AW: Web GUIs

    Nein. Ein Wunder zieht Erstaunen bzw. Verwunderung nach sich. Das eine Person - egal wie dumm, ignorant, borniert, .. sie auch sein mag - nach Monaten/Jahren feststellt, dass er ausschließlich TOTALEN BULLSHIT in ein Forum gekotzt hat, der fernab jeglicher Realität logiert, hat nichts mit Wunder zu tun. Das ist ein ganz normaler Lernprozess, der bei != Dampfplauderen schon viel früher eingesetzt hätte.
    Code:
    /* Christian 'strcat' Schneider <http://www.strcat.de/> */
    int y,z;main(x){x=(x>0?-9:x);z=((z=(x+5))>0?z:-z);printf
    (!x&&++y?"\n":z?z>y%3+y/3?" ":x<-5?"/":"\\":y?"|":"*")
    ;y-9?main(++x):puts("  _|_|_")&&puts("  \\___/");}

  9. #9
    Registered User
    Registriert seit
    Aug 2000
    Beiträge
    1.079
    Renommee
    448

    AW: Web GUIs

    Geil! Dampfplauderern! hahahhaha muss ich mir merken!
    Signatur sowie alle persönlichen Informationen entfernt.

Aktive Benutzer

Aktive Benutzer

Aktive Benutzer in diesem Thema: 1 (Registrierte Benutzer: 0, Gäste: 1)

Ähnliche Themen

  1. Ruby: Multi-Plattform-GUIs / Compiler
    Von Henning im Forum Algorithmen und sonstige Programmiersprachen
    Antworten: 4
    Letzter Beitrag: 19.05.2007, 01:03
  2. Moderne GUIs
    Von W00dSt0ckz im Forum VisualBasic / VBScript
    Antworten: 3
    Letzter Beitrag: 18.08.2005, 23:44
  3. GUIs mit Perl
    Von thodi im Forum PHP, Perl und ASP
    Antworten: 15
    Letzter Beitrag: 22.10.2001, 11:13

Berechtigungen

  • Neue Themen erstellen: Nein
  • Themen beantworten: Nein
  • Anhänge hochladen: Nein
  • Beiträge bearbeiten: Nein
  •