Kursinhalt
Grundlagen von React Native
Grundlagen von React Native
3. Gemeinsame Prinzipien
TouchableOpacity-Komponente
Theorie
Der TouchableOpacity
-Komponente bietet dem Benutzer eine Rückmeldung bei Berührung. Es ist ein Wrapper, der Berührungen oder Klicks erkennt und eine visuelle Reaktion bietet. Diese Komponente wird häufig verwendet, um interaktive Elemente wie Schaltflächen zu erstellen. So können wir damit arbeiten:
Warum TouchableOpacity verwenden
- Berührungsrückmeldung: Es bietet eine visuelle Reaktion (Änderung der Opazität), wenn der Benutzer die Komponente drückt, und gibt eine Rückmeldung, dass seine Berührung erkannt wurde;
- Berührungsbereich: Definiert einen Bereich, der auf Berührungen reagiert, was ihn geeignet macht, um interaktive Elemente wie Schaltflächen zu erstellen;
- Konsistentes Verhalten: Sorgt für ein konsistentes Berührungserlebnis auf verschiedenen Geräten.
Arbeiten mit TouchableOpacity
- Wir umschließen den Inhalt, den wir berührbar machen möchten, mit der
TouchableOpacity
-Komponente; - Der
onPress
-Prop wird verwendet, um die Funktion anzugeben, die ausgeführt werden soll, wenn die Komponente gedrückt wird.
Beispiel
Wir haben einen Button erstellt, der "Press Me" anzeigt. Wenn er gedrückt wird, wird eine Warnung mit der Meldung "Button pressed" ausgelöst.
Ergebnis
In der Praxis
War alles klar?
Danke für Ihr Feedback!
Abschnitt 2. Kapitel 7