Tutorial
2D UI-Elemente
Erstellen Sie reichhaltige Benutzeroberflächen
Textlabels
Fügen Sie Textanmerkungen hinzu, um Ihre 3D-Szene zu verbessern.
Text-Element
Type | Text | X | Y | FontSize | Color text | Gesamt: 500€ | 20 | 30 | 18 | #333333
Parameter
Beschreibung
Beispiel
type
Elementtyp
text
text
Label-Inhalt
"Breite: 100mm"
x, y
2D-Position in Pixeln
50, 100
fontSize
Textgröße
16
color
Textfarbe
#333333
Maßlinien
Zeigen Sie Messungen direkt auf Ihrem 3D-Modell an.
Maß-Element
Parameter
Beschreibung
Beispiel
type
Elementtyp
dimension
start
Startpunkt-Koordinaten
0,0,0
end
Endpunkt-Koordinaten
100,0,0
offset
Linienversatz vom Modell
20
GUI-Elemente
Erstellen Sie interaktive Steuerelemente für Benutzereingaben.
Schaltflächen
Type | Label button | Berechnen
Schieberegler
Type | Min | Max slider | 10 | 500
Dropdowns
Type | Options dropdown | A,B,C
Eingabefelder
Type | Value input | 250
Info-Panels
Zeigen Sie Zusammenfassungen in gestylten Panels an.
Panel-Element
Type | Title | Content | X | Y
panel | Zusammenfassung | Breite: {Breite}mm | 10 | 10
Dynamischer Inhalt
Verwenden Sie Formeln für Live-Updates.
Formelgesteuerter Text
Type | Text | X | Y text | ="Preis: " & Gesamt & "€" | 20 | 30 text | =WENN(Lagernd;"Auf Lager";"Nicht verfügbar") | 20 | 60
Positionierung
Platzieren Sie Elemente präzise auf dem Bildschirm.
X-Position
Pixel vom linken Rand
Y-Position
Pixel vom oberen Rand
Responsive
Prozentsätze: x: 50%
Styling-Optionen
Passen Sie das Aussehen Ihrer UI-Elemente an.
Eigenschaft
Beschreibung
Beispiel
backgroundColor
Hintergrundfarbe
#FFFFFF
borderColor
Rahmenfarbe
#CCCCCC
borderRadius
Eckenrundung
8
padding
Innenabstand
10
opacity
Transparenz (0-1)
0.9
Gruppieren
Zusammengehörige Eingaben bündeln
Mobil testen
Verschiedene Bildschirmgrößen prüfen
Platz lassen
Die 3D-Ansicht nicht überladen