Schatten für Gorhom-Unterseite in React Native anzeigen.
<p>Ich verwende die Bibliothek gorhom/react-native-bottom-sheet. Ich möchte das Schattenfeld anzeigen, wenn der Benutzer das untere Formular nach oben oder unten bewegt. Wie erreicht man das? Ist es möglich? Derzeit ist es so eingestellt, dass es angezeigt wird, wenn „isOpen“ ist, aber ich möchte, dass es beim Wischen angezeigt wird. Ich habe auch versucht, es in eine Touchable-Komponente zu packen, um die Schattenbox anzuzeigen, wenn isPressed wahr ist, aber beim Verschieben des unteren Formulars hat es nicht funktioniert. </p>
<pre class="brush:php;toolbar:false;">Standardfunktion exportieren BottomSheet() {
const [isPressed, setIsPressed] = useState(false);
const { t } = useTranslation();
const [isOpen, setIsOpen] = useState(false);
const bottomSheetModalRef = useRef(null);
const snapPoints = ["50%"];
Funktion handlePresentModal() {
bottomSheetModalRef.current?.present();
setTimeout(() => {
setIsOpen(true);
}, 100);
}
zurückkehren (
<>
<Button title="Present Modal" onPress={handlePresentModal} />
<BottomSheetModalProvider>
<StatusBar style="auto" />
<BottomSheetModal
ref={bottomSheetModalRef}
index={0}
snapPoints={snapPoints}
handleComponent={CustomHandler}
onDismiss={() => setIsOpen(false)}
>
<Spacer size={30} />
<BottomSheetScrollView contentContainerStyle={styles.contentContainer}>
//Inhalt hier
</BottomSheetScrollView>
</BottomSheetModal>
</BottomSheetModalProvider>
{isOpen && <ShadowBox />}
</>
);
}
const Styles = StyleSheet.create({
contentContainer: {
PolsterungHorizontal: 16,
Polsterung unten: 100,
},
});</pre>
<p><br /></p>