In Reaktion Ureinwohner, gibt es mindestens drei Möglichkeiten , einen Knopf zu machen: TouchableNativeFeedback
, TouchableHighlight
und TouchableOpacity
. In TouchableWithoutFeedback
der Dokumentation heißt es außerdem eindeutig, dass Sie diese nicht verwenden sollten, da "alle Elemente, die auf die Presse reagieren, bei Berührung ein visuelles Feedback erhalten sollten".
- TouchableNativeFeedback ist nur für Android verfügbar und "ersetzt die Ansicht durch eine andere Instanz von RCTView"
- TouchableHighlight "fügt der Ansichtshierarchie eine Ansicht hinzu"
- TouchableOpacity funktioniert "ohne die Ansichtshierarchie zu ändern"
Gibt es noch andere signifikante Unterschiede zwischen den drei? Ist einer von ihnen die goto-Komponente? In welchem Fall sollten Sie TouchableHighlight
über verwenden TouchableOpacity
? Gibt es irgendwelche Auswirkungen auf die Leistung?
Ich schreibe gerade eine Anwendung und stelle fest, dass alle drei eine erhebliche Verzögerung zwischen dem Tippen und der Aktion haben (in diesem Fall eine Navigationsänderung). Gibt es eine Möglichkeit, es schneller zu machen?
quelle
Antworten:
Quelle: https://medium.com/differential/better-cross-platform-react-native-components-cb8aadeba472 , von Nick Wientge
TouchableHighlight
• Was es tut: Verdunkelt oder hellt den Hintergrund des Elements auf, wenn es gedrückt wird.
• Verwendungszweck: Unter iOS für berührbare Elemente oder Schaltflächen mit fester Form oder Hintergrund und bei ListView-Elementen.
TouchableOpacity
• Was es tut: Hellt die Deckkraft des gesamten Elements auf, wenn es gedrückt wird.
• Verwendungszweck: Unter iOS für berührbare Elemente, bei denen es sich um eigenständigen Text oder Symbole ohne Hintergrundfarbe handelt.
TouchableNativeFeedback
• Was es tut: Fügt dem Hintergrund beim Drücken einen Welleneffekt hinzu.
• Wann es verwendet werden soll: Unter Android für fast alle berührbaren Elemente.
quelle
So entscheide ich normalerweise, was ich verwenden soll:
TouchableNativeFeedback
TouchableHighlight
. (TouchableOpacity
hat einige seltsame Teile, wenn Sie die Deckkraft selbst steuern).TouchableOpacity
weil es "nackter" ist alsTouchableHighlight
quelle
Ich denke, der wesentliche Hauptunterschied, wie in den Dokumenten angegeben:
TouchableHighlight must have one child (not zero or more than one). If you wish to have several child components, wrap them in a View.
VerknüpfungTouchableHighlight
TouchableOpacity
quelle
Wenn du möchtest
TouchableHighlight
TouchableOpacity
quelle
<TouchableHighlight underlayColor="transparent" />
... und Facebook mischt alle in ihrer F8-App github.com/fbsamples/f8app/blob/master/js/common/F8Touchable.js