Wie kann ich Textfarben in UI5-Steuerelementen mithilfe des Attributs „class“ binden?

Binding in Control mit dem Attribut „class“

Das Binden der Farbe von Textwerten in UI5 kann schwierig sein, da die Klasse direkt über gebunden wird XML wird nicht unterstützt. Es gibt jedoch eine Problemumgehung mit benutzerdefinierten Daten:

Ansatz für benutzerdefinierte Daten:

1. Fügen Sie in Ihrem Steuerelement ein CustomData-Element hinzu, dessen Eigenschaft „writeToDom“ auf festgelegt ist Ihr verbindlicher Ausdruck. Dadurch wird ein HTML-Attribut basierend auf dem Bindungsergebnis hinzugefügt:

   <code class="xml"><Text class="myControl">
     <customData>
    <core:CustomData writeToDom="{= ${HintTable>IS_ENABLED} === 'TRUE' ? 'green' : 'red'}" key="green" value="" />
     </customData>
   </Text></code>

2. Zielen Sie in Ihrem CSS das Steuerelement nach seiner Klasse und dem HTML-Attribut:

   <code class="css">.myApp .sapText.myControl[data-green='green'] { color: green; }  </code>

Beispiel:

https://embed.plnkr.co/LAv1qfsUjX0Anu7S/

Zusätzliche Überlegungen:

• UI5 warnt vor der Verwendung von benutzerdefiniertem CSS aufgrund möglicher Breaking Changes in zukünftigen Versionen.
• Für bestimmte Steuerelemente, wie z. B. sap.m.ObjectStatus oder sap.m.FormattedText, semantische oder branchenspezifische Es werden bereits spezifische Farben angewendet, sodass kein benutzerdefiniertes CSS erforderlich ist.
• Bedenken Sie immer die Auswirkungen der Verwendung von benutzerdefiniertem CSS und konsultieren Sie die Beteiligten, um die Konsistenz der Benutzeroberfläche sicherzustellen und technische Schulden zu reduzieren.

Das obige ist der detaillierte Inhalt vonWie kann ich Textfarben in UI5-Steuerelementen mithilfe des Attributs „class“ binden?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!