SSG-Ruledesigner-Konfigurator/wiki/Schulung2.md

2. Schulung - Einführung das Graphical Studio

2.1. Thematische Gliederung

Session 1 von Schulung 2: Einrichtung und Konfiguration eines Graphical Studios

• WebEditor2d-> Types (Baustein -> Userinterface)
• Verknüpfung von WebEditor2d mit Editor2DOption zur Verwaltung der Configuration der Umgebung

Session 2 von Schulung 2: Aufbau einer eigenen Library

• ab 1:45 Kopie der Library
• Erzeugung eines eigenen Shapes am Beispiel der Säule

2.2. Video des Mitschnitts

\\195.243.223.8\allgemein\RuleDesigner\2023-11-06-RuleDesigner-Configurator-Schulung_2.mp4

2.3. Inhalte je Zeitstempel

Hier zählt immer der angezeigte Zeitstempel von Teams im im Recording in der linken oberen Ecke.

Zeit [h:mm]	Thema
0:22	WebEditor2d-> Types (Baustein, Userinterface)
0:23	Anlegen der Globalenvariable ShapeList vom Typ Editor2DShapeTypeList zur Verwaltung alle Shapes
0:25	verknüpfung von WebEditor2d mit Editor2DOption zur Verwaltung der Configuration der Umgebung
0:26	Befüllung der Editor2dOption mit der Bibliothek ShapeLibrary (liegt in RDConfigurator/WebApi/Editor2D/DefaultLibrary)
0:28	Web Graphical Editor Library Wizard zur Definition der Bibliothek
0:30	Start der Defaultsession mit Baum aus der Defaultlibrary
0:31	Einschränkung der Shapes im Graphical Editor
0:32	Aktivierung aller Eigenschaften der Defaultlibrary. Visualisierung der aktivierten
0:34	Editing PageShowToolsOnToolbar, UndoRedo: Pfeile, DrawTools: (Polyline, Line, ...), SmartlineCopy
0:39	Button Pressed: Aufruf einer Callbackfunktion
0:42	Grid button tool: Erzeugung von Mustern in 2D/3D, siehe auch Muster
0:45	Dreieck in 2D ist eine Verschiebung in 3D
0:46	Grouptools: OnEditor2dGrouped als Callbackfunktion
0:48	Beispiel für Gruppierung: Callbackfunktion: drop von WebMessage in Regrouped Funktion
0:51	Suche im WebGraphical Editor Library Wizard nach der Callbackfunktion
0:52	Beispiel für Callback an Ctrl-V: Änderung der Einstellung am OBjekt
0:53	Beispiel für Callback von Doppelklick:
0:54	Freigabe an ShapeEvents in den Options für alle Events für die Reaktionen die man will. Zusätzlich am Shape selbst
0:58	Help button: HTML Seiten, welche auch in der Default Library liegen (siehe auch 0:57)
1:00	Neues Shape anlegen im WebGraphical Editor Library
1:02	Erklärung der Inhalte von RDConfigurator/WebApi/Editor2D/DefaultLibrary
1:02:30	Pfad zur Ablage der .html Datei mit der Hilfe
1:07	Frage von Simon: Das Objekt wird nach der Bestätigung mit OK in die Variable Shapelist geschrieben
1:12	Pause
1:18	Vergabe einer id in der Library bzw. in der Session
1:24	Umrechnung pixel, inch, mm am Shape
1:25	Erklärung weiterer Element im Editor2dOption
1:27	Frage zur Kollisionsprüfung: Nur Check der BoundingBox des Objektes gegeneinander, siehe Boundingbox
1:30	Editor2dOption: Autosave, DoExportImage2D
1:33	Editor2dOption: EnterBehaviour (für Polyline, z.B. bei der Angabe von FINISH/CLOSE)
1:43	Umgebung: Erstellung der Sesssion aus dem Git Repo.
1:45	Erklärung des Konzeptes der Trennung der Pfade git Repo und Installation
1:52	Kreisels als Assembly von Motor-/Spannstation und Bändern
1:58	Erklärung der Buttons FAB: Speziell Button Raster
1:59	Callbackfunktion zum Raster
2:03	Callbackfunktion zum Import
2:08	Beispiel: Eigene Library erstellen. Kopieren der DefaultLibrary im Explorer für Gerüst
2:09	Kopierte Default-Library aufräumen, nicht benötigtes löschen
2:11	Definiere 1 Zoll Säule
2:15	Zeichnen der Säule im Inkscape
2:21	Speichern der Säule als svg
2:24	Export als 32/64 pixel grosses Icon
2:26	Erstellung eines Verweises auf die Pfade der Icons im Shape
2:29	Angabe der echten Größe
2:33	Definition der Connection Points
2:37	Korrektur des Zeichnungsbereichs und der Zeichnung selbst
2:40	Neue 1 Zoll Säule
2:44	RE-Import in den RD Configurator
2:46	neue Connection Points definiert im Web Graphical Editor
2:47	Reparatur des svg Files und neu laden im RD Configurator
2:53	Erzeugung der Säule im SolidEdge
2:56	Export als .stl und .prt
2:57	Import der 3d Information in RD Configurator (Festlegung des Centers in 3D und im Graphical Studio)
2:59	Koordinatensystem in 3D und 2D

2.4 Integration einer SVG-Datei als Shape

Am Beispiel der Bügelträgerbeladung wird die Integration eines Shapes in den RDC gezeigt. Zunächst müssen die Grenzmaße in x und y-Richtung und nach Möglichkeit auch in z-Richtung bekannt sein.

In Inkscape wird nun eine Vektorgrafik (SVG) erstellt. Das Shape als vereinfachte Grafik der Baugruppe kann nun gezeichnet werden. Alle Vektoren und Teilelemente sollten am Schluss gruppiert werden (Strg + G). Die Größe des gezeichneten Shapes muss nun auf die Grenzmaße der Baugruppe angepasst werden.

Um eine Maßstabsgetreue Wiedergabe im RDC zu ermöglichen, muss die Seitengröße der SVG-Datei ebenfalls auf die Grenzmaße angepasst werden. Die Maße des Dokuments werden dabei auf die Grenzmaße des Objekts festgelegt. Unter "Datei -> Dokumenteneinstellungen..." kann die Seitengröße konfiguriert werden.

Das Zeichnungsobjekt wird ausgewählt und über die Schaltfläche "Seitengröße auf Zeichnungs-/Auswahlgröße" wird die Seitengröße auf die Shapegröße angepasst und das Shape zentriert. Damit ist die Bearbeitung des Shapes in Inkscape abgeschlossen.

Im "Web Graphical Editor Library Wizard" wird nun die SSG-Library geöffnet und zum vorher angelegten Shape navigiert. Unter dem Reiter "Main" werden die Abmessungen der Breite (W) und Länge bzw. Höhe (H) eingetragen. Hier kann der Wert in Millimetern eingegeben werden, eine Umrechnung in Pixel erfolgt automatisch. Die Werte für die Breite und Höhe in Pixeln können hier ebenfalls später für die Berechnung abgerufen werden.

Unter dem Reiter "2D" kann die zuvor erstellte SVG-Datei importiert werden.

Über die Schaltfläche "Deploy Library" wird nun eine XML-Datei aus der ausgewählten SVG-Datei erzeugt. Dafür muss die Library überschrieben werden.

Anschließend ist ein Speichern der gesamten Library über die Schaltfläche "Save Library" erforderlich. Dadurch wird die entsprechende XML-Datei in folgendem Verzeichnis überschrieben: "C:\Program Files\RuleDesigner\RDConfigurator Fusion\WebApi\Editor2D\SSG\shapes\svg"

Zuletzt muss das neu erzeugte Library-Verzeichnis in das von Git verwaltete Verzeichnis kopiert werden. Hierbei wird das gesamte SSG-Verzeichnis kopiert und geänderte Dateien werden überschrieben: Quellverzeichnis: C:\Program Files\RuleDesigner\RDConfigurator Fusion\WebApi\Editor2D\SSG Zielverzeichnis: C:\Users\USERNAME\Documents\SSG-Ruledesigner-Konfigurator\Editor2DLibrary\SSG

2.5 Positionierung eines Connection-Points

Um einen Connection-Point maßstabsgetreu positionieren zu können, wird dieser Punkt in Inkscape ermittelt. Dazu wird mit dem Vektor-Tool ("Bezierkurven und gerade Linien") durch zweifaches Klicken an verschiedenen Positionen eine Vektor zwischen zwei Punkten gebildet. Beim Positionieren der beiden Punkte ist einer der beiden Verbindungspunkte an die Soll-Position des Connection-Points zu platzieren. Sind beide Punkte platziert, kann die Eingabe mit der rechten Maustaste abgeschlossen werden.

Mit dem Werkzeug "Bearbeiten der Knoten oder der Anfasser eines Pfades" können die Anfasser nachträglich verschoben werden und die Endposition des Connection-Points korrigiert werden.

Anschließen wird mit dem selben Werkzeug der Knotenpunkt mit der Position des Connection-Points ausgewählt. Die Koordinaten des Punktes werden in der Oberfläche angezeigt. Die Anzeigeeinheit muss auf Pixel ("px") einstellt sein. um die Koordinaten auslesen zu können. Der Ursprung (x=0 px, y=0 px) der Seite liegt oben links. Die Koordinaten für den ausgewählten Knotenpunkt können nun in der Oberfläche abgelesen werden.

Nun erfolgt eine Umrechnung der Pixelgrößen für die Position des Connection-Points des Shapes in der RDC Library:

Die Werte für die Koordinaten werden anschließend im Library Wizard im jeweiligen Shape unter dem Reiter "Connection Points" eingetragen.

Abschließend muss die Aktualisierung der Shape Daten durch "Deploy Library", "Save Library" und Kopieren des SSG-Verzeichnisses in das verwaltete Verzeichnis des RDC übertragen werden (s.o.).