Passen Sie die Seiten UI Builder mithilfe von Komponenten an
Erfahren Sie, was eine Komponente in UI Builderist. Sehen Sie sich auch an, wie -Komponenten in UI Builder funktionieren.
Komponenten sind die Basiselemente Ihrer Seite UI Builder. Komponenten reichen von Kernelementen wie Schaltflächen und Bezeichnungen bis hin zu Komponenten für komplexere Erfahrungen wie Listen und Formulare.
Sie können diese Komponenten Ihrer Seite UI Builder hinzufügen, um Ihre Arbeitsbereichs- oder Portal-Experience zu erstellen oder anzupassen. Beispiel: Hinzufügen einer Aktivitätenstrom -Komponente zu Ihrer Seite, mit der Anwender ihre Reiseanforderungsaktivität sehen können.
Sie können Ihrer Seite UI Builder wie folgt Komponenten hinzufügen.
| Standort | Beispiel |
|---|---|
| Direkt von einer Seite in UI Builder (Option 1) | Wählen Sie das Symbol zum Hinzufügen von Inhalten (Plus), wählen Sie die Registerkarte Komponenten und dann eine Komponente aus. |
| Direkt von einer Seite in UI Builder (Option 2) | Wählen Sie bei einem Spaltenlayout oder einer Komponente das Symbol „Vor“ (Plus) oder „Nach“ (Plus) hinzufügen, und wählen Sie dann eine Komponente aus. |
| Aus der Inhaltsstruktur in UI Builder | Wählen Sie in der Inhaltsstruktur + Inhalt hinzufügen und anschließend eine Komponente aus. |
| Über das unverankerte Menü über der Seite in UI Builder | Wählen Sie in einem Spaltenlayout oder einer Komponente das Menüsymbol, dann Hinzufügen vor oder Hinzufügen nach, und wählen Sie dann eine Komponente aus. |
Spaltenlayouts in UI Builder
Fügen Sie Ihrer Seite UI Builder zuerst Spaltenlayouts und Spalten hinzu. Fügen Sie dann den Spalten in einem Spaltenlayout Komponenten hinzu, um Ihre Seite zu erstellen und anzupassen. Stellen Sie sich ein Spaltenlayout als einen definierten Teil des Bildschirms vor, dem Sie Komponenten wie Listen und Überschriften hinzufügen. Sie können beliebig viele Spaltenlayouts auf einer Seite UI Builder verwenden, mit bis zu sechs Spalten pro Spaltenlayout. Einer einzelnen Spalte können mehrere Komponenten hinzugefügt werden. Zeigen Sie die Struktur Ihrer Seite in der Inhaltsstruktur an.
Weitere Informationen finden Sie unter Spaltenlayouts.
Konfigurieren Sie Komponenten in UI Builder
- Konfigurieren Sie die Komponenteneigenschaften.
- Fügen Sie CSS-Stilüberschreibungen hinzu.
- Richten Sie Ereignishandler für die Komponenten ein.
- Registerkarte „Konfigurieren“
- Die Komponenteneigenschaften variieren je nach Komponente. Die Konfiguration von Komponenten kann einfach sein, ebenso wie einfache Elemente wie Schaltflächen, Überschriften und Bezeichnungen. Komponenten wie Listen und Formulare erfordern eine umfangreiche Konfiguration. Wählen Sie für Symbol- und Bildkomponenten aus einer Vielzahl von Optionen aus, oder verwenden Sie ein anwenderdefiniertes Symbol oder Bild. Sie können Komponenteneigenschaften mit dem Low-Code-JSON-Editor von UI Builderändern. Weitere Informationen zum Konfigurieren von Komponenten finden Sie unter Next Experience-Komponenten.
- Für jede Eigenschaft auf der Registerkarte „Komponentenkonfiguration“ können Sie aus den folgenden Optionen auswählen.
- Statisch: Verwenden Sie Daten aus einer Liste, oder geben Sie Ihre eigenen Daten ein. Die Daten stellen keine Verbindung zu einer externen Datenquelle her.
- Dynamische Datenbindung: Eine Möglichkeit, eine Komponenteneigenschaft an eine Datenressource, eine Seiteneigenschaft oder einen Clientstatus zu binden.
- Skript: Geben Sie JavaScript-Code ein, um einen Eigenschaftswert auszufüllen.
- Registerkarte „Stile“.
- Sie können die Cascading Style Sheets (CSS)-Stile für einzelne Komponenten ändern. Ändern Sie Rahmenfarben, Schriftgröße usw.
- Registerkarte „Events“
- Konfigurieren Sie Event-Zuordnungenauf Seiten- und Variantenebene. Fügen Sie außerdem gesendete Ereignisse und behandelte Ereignisse für Ihre Variante hinzu. Die komplexeren Experience-Komponenten stützen sich stark auf dynamische Daten, die von einer Datenressourcebereitgestellt werden. Das Binden dynamischer Daten an eine Komponente ist eine wichtige Funktion. Sie stellen Daten aus Tabellen, Datensätzen oder anderen Elementen auf Ihrer Seite dynamisch bereit. Durch das Verfügbarmachen von Daten können Sie Ihre Komponenten wiederverwenden. Außerdem können Sie auf die Konfigurationsfelder zeigen, um Symboldaten oder Skriptoptionen für jedes Feld anzuzeigen.
Während Sie auf der Seite Komponenten hinzufügen und konfigurieren, zeigt die Phase Ihre Arbeit. Wenn Sie Änderungen vornehmen und die Updates nicht in der Phase geladen werden, wählen Sie das Menüsymbol Öffnen und dann Entwickler > Phase neuladen aus. Wenn Sie die Phase neu laden, werden Ihre Änderungen zwar angezeigt, aber nicht gespeichert. Um Ihre Arbeit zu speichern, wählen Sie oben rechts Speichern.
Komponentenvoreinstellungen in UI Builder
Verwenden Sie Komponentenvoreinstellungen, um Komponenten auf kompatiblen Seiten automatisch zu konfigurieren. Die Seitenvorlagen UI Builder enthalten Controller, die von Voreinstellungen zum Definieren von Komponentenkonfigurationswerten verwendet werden. Weitere Informationen finden Sie unter Komponenten mithilfe von Voreinstellungen automatisch konfigurieren.
Abschnitte mit Komponenteneigenschaften
Komponenteneigenschaften sind in Abschnitte mit ähnlichen Eigenschaften gruppiert. Öffnen und schließen Sie Abschnitte, indem Sie die Pfeile rechts neben den Eigenschaftsüberschriften auswählen. UI Builder-Administratoren können auswählen, welche Komponentenkonfigurationseigenschaften basierend auf UI-Richtlinien angezeigt oder ausgeblendet werden.
Komponentenformeleditor
Verwenden Sie den Komponentenformeln-Editor UI Builder im Konfigurationsbereich, um Formeln zu binden oder zu ändern. Sie können Text, Datenbindungen und/oder Formeln eingeben. Formeln können aus einer beliebigen Kombination der drei Eingabetypen bestehen. Der Komponentenformel-Editor unterstützt logische, arithmetische, Vergleichs-, Negations- und funktionale Transformationstypen.
Jede Funktion, die dem Komponentenformel-Editor hinzugefügt wird, wird automatisch vervollständigt. Der Komponentenformel-Editor zeigt eine Bezeichnung für jede Eingabe der Funktion an, damit Sie wissen, welche Parameter jede Funktion benötigt. Weitere Informationen zu den unterstützten Funktionen im Komponentenformeleditor finden Sie unter Unterstützte Funktionen im Formeleditor der Komponente UI Builder.
Komponenten-ID
Verwenden Sie die Komponenten-ID, wenn Sie der Komponente ein Skript hinzufügen oder Daten binden, um auf die Komponente zu verweisen. Eine Komponenten-ID wird automatisch erstellt und basiert auf der Komponentenbezeichnung, wenn Sie einer Seite eine Komponente hinzufügen. Sie können die Komponenten-ID beliebig ändern, solange sie eindeutig ist. Wählen Sie im Konfigurationsbereich den Namen der Komponente aus, um die Komponenten-ID anzuzeigen.
Transparenz der Komponenten
Wählen Sie im Konfigurationsbereich das Augensymbol, um die Sichtbarkeit der Komponenten festzulegen. Die Transparenz der Komponente basiert auf einer Eigenschaft der Komponente selbst, nicht auf der Person, die sie anzeigt. Sie können eine Komponente basierend auf Bedingungen anzeigen oder ausblenden. Beispielsweise können Sie ein Bild ausblenden, wenn es einen defekten Link enthält.
Sie können die Sichtbarkeit basierend auf der dynamischen Datenbindung oder durch Bearbeiten eines geskripteten Eigenschaftswerts festlegen.
Legen Sie den Wert Test fest, um zu testen, was passiert, wenn die Sichtbarkeit auf „true“, „false“ oder „keine“ festgelegt ist.
Doppelte Komponenten
Erstellen Sie eine exakte Kopie einer konfigurierten Komponente auf Ihrer Seite UI Builder, mit Ausnahme des Namens und der ID. Eine duplizierte Komponente kopiert alle Eigenschaften, Bindungen und Ereignisse. Weitere Informationen finden Sie unter Duplizieren Sie eine Komponente.