TouchableHighlight
Ta strona została przetłumaczona przez PageTurner AI (beta). Nie jest oficjalnie zatwierdzona przez projekt. Znalazłeś błąd? Zgłoś problem →
Jeśli szukasz bardziej rozbudowanego i przyszłościowego sposobu obsługi wprowadzania danych za pomocą dotyku, zapoznaj się z API Pressable.
Opakowanie umożliwiające widokom prawidłową reakcję na dotyk. Po naciśnięciu zmniejsza się przezroczystość opakowywanego widoku, co pozwala prześwitywać kolorowi podkładu, przyciemniając lub barwiąc widok.
Podkład powstaje poprzez opakowanie dziecka w nowy widok View, co może wpływać na układ i czasem powodować niepożądane artefakty wizualne przy nieprawidłowym użyciu, np. gdy backgroundColor opakowywanego widoku nie jest jawnie ustawiony na kolor nieprzezroczysty.
TouchableHighlight musi mieć dokładnie jedno dziecko (ani zero, ani więcej). Jeśli chcesz użyć kilku komponentów potomnych, opakuj je w widok View.
function MyComponent(props: MyComponentProps) {
return (
<View {...props} style={{flex: 1, backgroundColor: '#fff'}}>
<Text>My Component</Text>
</View>
);
}
<TouchableHighlight
activeOpacity={0.6}
underlayColor="#DDDDDD"
onPress={() => alert('Pressed!')}>
<MyComponent />
</TouchableHighlight>;
Przykład
Dokumentacja
Właściwości
Właściwości TouchableWithoutFeedback
Dziedziczy właściwości TouchableWithoutFeedback.
activeOpacity
Określa przezroczystość opakowywanego widoku podczas aktywnego dotyku. Wartość powinna być między 0 a 1. Domyślnie 0.85. Wymaga ustawienia underlayColor.
| Type |
|---|
| number |
onHideUnderlay
Wywoływane natychmiast po ukryciu podkładu.
| Type |
|---|
| function |
onShowUnderlay
Wywoływane natychmiast po pokazaniu podkładu.
| Type |
|---|
| function |
style
| Type |
|---|
| View.style |
underlayColor
Kolor podkładu widoczny podczas aktywnego dotyku.
| Type |
|---|
| color |
hasTVPreferredFocus iOS
(Tylko Apple TV) Preferowany fokus TV (patrz dokumentacja komponentu View).
| Type |
|---|
| bool |
nextFocusDown Android
Następny fokus TV w dół (patrz dokumentacja komponentu View).
| Type |
|---|
| number |
nextFocusForward Android
Następny fokus TV do przodu (patrz dokumentacja komponentu View).
| Type |
|---|
| number |
nextFocusLeft Android
Następny fokus TV w lewo (patrz dokumentacja komponentu View).
| Type |
|---|
| number |
nextFocusRight Android
Następny fokus TV w prawo (patrz dokumentacja komponentu View).
| Type |
|---|
| number |
nextFocusUp Android
Następny fokus TV w górę (patrz dokumentacja komponentu View).
| Type |
|---|
| number |
testOnly_pressed
Przydatne w testach migawkowych.
| Type |
|---|
| bool |