Datenstrukturierung für dynamische Programminhalte



  • Hallo zusammen,
    ich habe den Auftrag bekommen eine Bediensimulation eines Touchpanels von einer unserer Produktionsmaschinen für unsere Schulungsabteilung zu erstellen. Unsere Grafikerin fotografiert mir jedes Menü ab - basierend darauf soll die Navigation durch die Maschinensoftware simuliert werden. Die Buttons auf den Bildern werde ich über X und Y Koordinaten anklickbar machen - dies funktioniert auch schon wunderbar und kann anhand des Klicks auf einen dargestellten Button das nächste Bild in das Darstellungsformular laden.

    Jedes Menü, bzw. jedes Bild kann unterschiedliche Buttons aufweisen. Jetzt gilt es eine Datenstruktur zu erstellen die beim Laden eines Bildes die Koordinaten aller dargestellten Buttons und deren Navigationsaufruf mitbringt. In der Praxis habe ich mir es wie folgt vorgestellt:

    //---Hauptmenu.png
    int Xmin = 25, Xmax = 45, Ymin = 12, Ymax = 20;   //Koordinaten Button "Settings" 
    String onclick_load = "Appdir\\Simpics\\Settings.png";
    ..
    .....//Button 2
    ........ // Button 3.....
    
    //---Settings.png
    int Xmin = 38, Xmax = 48, Ymin = 18, Ymax = 26;   //Koordinaten Button "Kalibrierung" 
    String onclick_load = "Appdir\\Simpics\\Calib.png";
    ..
    .....//Button 2
    ........ // Button 3.....
    

    In Summe sind es ca. 30 Einzelbilder. Wie würdet ihr vorgehen um beim Laden eines Bildes die Positionskoordinaten der dargestellten Buttons und deren OnClick Aktion mitzuliefern? Pro Bild eine eigene Klasse, eine struct...etc. Ich bin mir absolut unschlüssig wie es am besten zu Lösen wäre. Compiler ist der C++ Builder XE 6 was aber eigentlich nebensächlich ist. Hier geht es mir nur um das theoretische Vorgehen und nicht um konkreten Quelltext.

    Glaubt mir, diese Gui auf dem Bedienertouchscreen ohne die Bildmethode 1:1 nachzubauen ist 100x mehr Aufwand.


  • Mod

    Du hast das in deinem Beispiel doch schon selber schön als zusammengehörige Datenpakete aufgeschrieben. Dann setz das doch auch in deinen Datenstrukturen so um. Also Button besteht aus Xmin, Xmax, Ymin, Ymax und onclick_load. Ein Menü besteht aus Buttons.



  • freund von mir hat fuer schulungen auch sowas gebastelt. er ist kein graphiker und auch kein programmierer, deswegen hat er es mit HTML gemacht.

    http://www.w3schools.com/tags/tag_map.asp

    damit kannst du flaechen definieren und angeben wohin ein click fuehren soll. es gibt tools die dir helfen soeine html seite zu erstellen (also clickbare flaechen zu selektieren usw.).

    das fand ich eine sehr gute loesung, falls da 0 logik rein muss, sondern es wirklich nur walkthrough ist.



  • Richtig, ein Menu besteht aus mehreren Buttons. Jetzt ist nur die Frage der Datenstruktur. Bestenfalls wäre doch eine Art Objektcontainer wo ich bei einem Onclick-Ereignis durchitterieren muss, um den angeklickten Button zu identifizieren und das entsprechende weiterführende Bild zu laden.

    Hier mal etwas Pseudocode:

    void __fastcall TForm1::OnKeyDown(int X, int X)
    {
    
        if(Key == mbLeft)
       {
           for(int i = 0; i < Buttoncontainer->Count; i++)
          {
             if(Buttoncontainer->Items->Item[i].Xmin >= X && 
                Buttoncontainer->Items->Item[i].Xmax <= X &&
                Buttoncontainer->Items->Item[i].Ymin >= Y &&
                Buttoncontainer->Items->Item[i].Ymin <= Y)
             Canvas->LoadImage(Buttoncontainer->Items->Item[i].onclick_action);   
    
          }
    
       }
    
    }
    

    Ich steh allerdings total auf dem Schlauch wie ich diese Datenstruktur anhand eines Containers programmieren soll. Oder besser Hartcodiert? ich bin echt ratlos oder sehe den Wald vor lauter Bäumen nicht.

    Edit: Danke Rapso, allerdings gibt es ein Szenario wo der Trainer Bildinhalte vordefinieren können muss da die Fehlerausgabe auf dem Screen auch simuliert werden soll. Daher scheidet HTML aus, Kollege wollte es mit Powerpoint machen aber das klappt dann leider auch nicht.


  • Mod

    Zero01 schrieb:

    Richtig, ein Menu besteht aus mehreren Buttons. Jetzt ist nur die Frage der Datenstruktur.

    Die Antwort hängt von der späteren Anwendung der Daten ab.

    Bestenfalls wäre doch eine Art Objektcontainer wo ich bei einem Onclick-Ereignis durchitterieren muss, um den angeklickten Button zu identifizieren und das entsprechende weiterführende Bild zu laden.

    Für ein Durchiterieren böte sich ein Vektor an. Cleverer wäre eine Datenstruktur mit einer räumlichen Ordnung, da dann das Finden des angeklickten Elements effizienter ist als dumpfes Durchprobieren aller Möglichkeiten. Da bei deiner Anwendung aber vermutlich höchstens ein paar Dutzend oder Hundert Buttons pro Menü zu erwarten sind, lohnt sich der Zusatzaufwand aber wohl kaum, es sei denn, du hast direkt einen passenden Container bereit liegen. Aus deiner Frage schließe ich, dass dies wahrscheinlich nicht der Fall ist.

    Ich steh allerdings total auf dem Schlauch wie ich diese Datenstruktur anhand eines Containers programmieren soll.

    Du willst einfache Container selber programmieren? Warum? Welche Sprache benutzt du denn, in der es nicht einmal etwas wie einen Vektor gibt?

    Oder besser Hartcodiert?

    Was meinst du in diesem Zusammenhang mit "Hartcodiert"? Egal, es klingt auch ohne Erklärung nach einer schlechten Idee.



  • Vielen Dank Sepp für deine Ausführungen!

    In der Tat existieren maximal 7 Buttons pro Menü. Dies finde ich aber eher nebensache da es mich brennend Interessiert wie Profis an eine solche Lösung rangehen würden. Die eingesetzte Sprache ist C++ in Verbindung mit der VCL. Hartcodiert wäre z.B. eine Stringliste wie folgendes Beispiel zeigt:

    OnPictureLoad blabla
    
    if (Picturename == "Mainmenu.png")
    {
      mystringlist->Clear();
    
      //---Button1
      mystringlist->Add("Xmin=25;Xmax=35;Ymin=18;Ymax=24;Action=nextpic.png");
    
      //---Button2
      mystringlist->Add("Xmin=35;Xmax=45;Ymin=28;Ymax=34;Action=anothernextpic.png");
    
     // usw....
    }
    

    Die for-Schleife im Onclick würde dann durchklappern und die Koordinaten herausfiletieren und dumpf vergleichen...aber es bedarf sicher keiner weiteren Ausführung wie ineffektiv es ist obwohl es sicher funktionieren würde.

    Vektor...mhhhhh....welchen Vorteile hätte ich damit? Ich würde gerne einen Container selbst programmieren wenn ich wüsste wie. Was hälst du davon die Daten wie eine XML-Struktur a la Node, Key, Value im Speicher zu halten falls der Vektor ungeeignet für dieses Vorhaben ist?


  • Mod

    Zero01 schrieb:

    Vektor...mhhhhh....welchen Vorteile hätte ich damit?

    Es wäre eine einfache Datenstruktur, die das geforderte Verhalten (Iteration) ohne unnötiges Drumherum unterstützt. Ein Vektor sollte immer die erste Wahl für einen Container sein, es sei denn, man hat Gründe, etwas anderes zu wählen. Hier wäre ein Grund für eine andere Wahl die räumliche Sortierung der Daten, aber es sieht bei maximal 7 Buttons nicht nach einem lohnenden Grund aus.

    Ich würde gerne einen Container selbst programmieren wenn ich wüsste wie.

    Dann tu das, aber vermisch nicht zwei Projekte. Warum willst du deine Containerexperimente in Produktivcode einsetzen? Das hat da nichts verloren.

    Was hälst du davon die Daten wie eine XML-Struktur a la Node, Key, Value im Speicher zu halten falls der Vektor ungeeignet für dieses Vorhaben ist?

    Das ist keine Datenstruktur, sondern eine Beschreibung von etwas, das man dann mittels geeigneter Datenstrukturen umsetzt. Diese Umsetzung wäre ziemlich die gleiche, die schon vorgeschlagen wurde.

    Dies finde ich aber eher nebensache da es mich brennend Interessiert wie Profis an eine solche Lösung rangehen würden.

    Hab ich ja schon quasi gesagt, außer dass ich noch class und ein paar Klammern um meine Worte setzen müsste, damit ein Computer es versteht.



  • Ich habe mich erneut in die Thematik STL bzw. Vector eingelesen und meine einen Lösungsweg via Struct und Vector gefunden zu haben. So gibt es Ordnung und mehr Effizienz in der Datenstruktur statt stupiden Spaghetticode.

    Ich werde sehr bald mit der Umsetzung anfangen und die Ausarbeitung vorstellen.

    Vielen lieben Dank Sepp!


Log in to reply