Bedingte Formatierung
Die Anwendung einer bedingten Formatierung auf Ihre App kann das Benutzererlebnis verbessern. Denken Sie daran: Jedes Steuerelement weist etwas andere Eigenschaften auf. Das bedeutet, dass die bedingte Formatierung für ein Steuerelement möglicherweise nicht die gleiche wie für ein anderes Steuerelement ist. Sie können die bedingte Formatierung z. B. für Folgendes verwenden: Festlegen der Visible-Eigenschaft eines Bild-Steuerelements, um es auszublenden, wenn bestimmte Benutzer angemeldet sind, oder Ändern der DisplayMode-Eigenschaft einer Schaltfläche zu Deaktiviert, bis in alle Felder in einem Formular-Steuerelement Daten eingegeben wurden. Die bedingte Formatierung kann das Benutzererlebnis mit visuellen Hinweisen und je nach Bedingung veränderter Funktionalität erheblich verbessern.
Bedingte Formatierung der Textfarbe
Setzen wir das vorherige Beispiel mit der Funktion Sum fort, erstellen wir eine Formel, um die bedingte Formatierung auf die Eigenschaft lblSum Color anzuwenden. Gehen Sie zum ersten Bildschirm in Ihrer Übungs-App zurück, den wir in Übung 3 erstellt haben (siehe Screenshot).
Hinweis
Wenn Sie die Schritte durchgehen und Ihre Formel einen Fehler zurückgibt, denken Sie bitte daran, dass die Spracheinstellung Ihrer Power Apps-Umgebung (oder Lokalisierung) einige Trennzeichen und Operatoren beeinflussen kann. Beispielsweise wird die Formel Text(ThisItem.Price, "$ ##.00") in einer Sprache und Region ausgedrückt, in der Punkte als Dezimaltrennzeichen verwendet werden, z. B. in Japan oder im Vereinigten Königreich. Für eine Sprache und Region, in der ein Komma als Dezimaltrennzeichen verwendet wird, z. B. in Frankreich oder Spanien, muss die Formel jedoch wie folgt lauten: Text(ThisItem.Price; "$ ##,00")
Der Eigenschaftsauswahloperator (Punkt) in „ThisItem.Price“ ist immer gleich, unabhängig vom Dezimaltrennzeichen. Beachten Sie jedoch, dass sich das Dezimaltrennzeichen und das Trennzeichen für Verkettungsvorgänge in Komma bzw. Semikolon ändern. Intern ändert sich die Formel nicht. Alles, was sich ändert, ist, wie sie vom Autor angezeigt und bearbeitet wird.
Wechseln Sie zur Eigenschaft Color, wenn lblSum ausgewählt ist. Wenn Sie das Formelfeld auswählen, sehen Sie, Informationen direkt unter dem Feld, dass der Wert
RGBA(0, 0, 0, 1)ein schwarzes Quadrat und der Datentyp Color ist.
Löschen Sie den aktuellen Wert, und geben Sie in das Eingabefeld Power fx Folgendes für Color ein:
If(Sum(Value(TextInput2.Text)*Value(TextInput3.Text))>50,Color.Green,Color.Blue)Die Eigenschaft Color definiert die Farbe des Texts im Beschriftung-Steuerelement. Wenn in diesem Beispiel die Summe der beiden TextInput-Steuerelemente größer als 50 ist, ist die Farbe Grün, andernfalls ist sie Blau. Wenn Sie den Cursor in die Formelleiste setzen, nachdem Sie die Formel geändert haben, beachten Sie, dass der Ausgabedatentyp Color ist.
Beim Festlegen der Eigenschaft „Color“ in Power Apps sind verschiedene Optionen verfügbar. Sie können ein Farbobjekt in Ihrer Formel bereitstellen, wie in diesem Beispiel gezeigt, indem Sie Color.Green oder Color.Blue (oder eine der anderen vordefinierten Farben in Power Apps) auswählen. Zudem sind ColorValue (der CSS-Farbnamen und 6‑ und 8-stellige Hex-Farbwerte verwendet) und eine RGBA-Funktion verfügbar, um jedes denkbare Farbschema zu erstellen.
Zum Aktualisieren der Eigenschaft Color auf die Eigenschaft Text verweisen
Sie können auch zum Festlegen der Eigenschaft Color auf die Eigenschaft Text verweisen.
Stellen wir uns vor, wir möchten unseren Kunden Feedback zu dem von ihnen bestellten Artikel zukommen lassen. Wenn ein bestimmtes Produkt eingegeben wird, ändern wir die Farbe des Textes der Zusammenfassung.
Wenn Sie Text als Wert in Ihrer Formel verwenden, ist die Groß-/Kleinschreibung des Textes wichtig. Daher können wir eine Funktion wie Lower für unsere Formel verwenden, wie z.B Lower(yourtextvalue), die Ihren Textwert stets in Kleinbuchstaben zurückgeben würde.
Versuchen Sie, die Formel in der Eigenschaft Color für Ihre Transaktionszusammenfassung durch Folgendes zu ersetzen:
If(Lower(TextInput1.Text) = "apples", Color.YellowGreen, Color.Blue)
Beachten Sie, wie sich der Text sofort zu blau verändert. Versetzen Sie nun Ihre App in den Vorschaumodus, und geben Sie in das Eingabefeld Produkt „Apples” ein, und Sie können sehen, wie sich die Textfarbe Ihrer Transaktionszusammenfassung zu gelb-grün verändert. Wir haben „Apples” mit großem A eingegeben, dennoch hat die Formel funktioniert. Die Groß-/Kleinschreibung unseres Eintrags spielt keine Rolle, nur die Schreibweise.
Sie beginnen hoffentlich zu erkennen, wie die bedingte Formatierung in Ihrer Canvas-App zur Verbesserung der Benutzererfahrung führen kann. Lassen Sie Ihre Übungs-App geöffnet. Wir werden sie wieder verwenden, wenn wir etwas über Datenvalidierungs-Funktionen lernen.