feat: 引入手势组件

This commit is contained in:
jinyaqiu 2025-07-30 16:16:16 +08:00
parent 8969e45d6b
commit e74622b009
2 changed files with 54 additions and 46 deletions

View File

@ -4,6 +4,7 @@ import YesSvg from "@/assets/icons/svg/yes.svg";
import { TFunction } from "i18next"; import { TFunction } from "i18next";
import React from "react"; import React from "react";
import { FlatList, Image, Modal, StyleSheet, TouchableOpacity, View } from "react-native"; import { FlatList, Image, Modal, StyleSheet, TouchableOpacity, View } from "react-native";
import { Gesture, GestureDetector } from 'react-native-gesture-handler';
import { ThemedText } from "../ThemedText"; import { ThemedText } from "../ThemedText";
import { mergeArrays } from "./utils"; import { mergeArrays } from "./utils";
@ -16,7 +17,11 @@ interface SelectModelProps {
t: TFunction; t: TFunction;
} }
const SelectModel = ({ modalDetailsVisible, setModalDetailsVisible, insets, setSelectedImages, selectedImages, t }: SelectModelProps) => { const SelectModel = ({ modalDetailsVisible, setModalDetailsVisible, insets, setSelectedImages, selectedImages, t }: SelectModelProps) => {
const longPressGesture = Gesture.LongPress().onEnd((e, success) => {
if (success) {
console.log(`Long pressed for ${e.duration} ms!`);
}
});
return ( return (
<Modal <Modal
animationType="fade" animationType="fade"
@ -63,6 +68,7 @@ const SelectModel = ({ modalDetailsVisible, setModalDetailsVisible, insets, setS
style={detailsStyles.gridItemContainer} style={detailsStyles.gridItemContainer}
key={item.id} key={item.id}
> >
<GestureDetector gesture={longPressGesture}>
<View style={detailsStyles.gridItem}> <View style={detailsStyles.gridItem}>
<ThemedText style={detailsStyles.imageNumber}> <ThemedText style={detailsStyles.imageNumber}>
{selectedImages?.map((image, index) => { {selectedImages?.map((image, index) => {
@ -89,6 +95,7 @@ const SelectModel = ({ modalDetailsVisible, setModalDetailsVisible, insets, setS
{isSelected && <YesSvg width={16} height={16} />} {isSelected && <YesSvg width={16} height={16} />}
</TouchableOpacity> </TouchableOpacity>
</View> </View>
</GestureDetector>
</TouchableOpacity> </TouchableOpacity>
); );
}} }}

View File

@ -1,6 +1,7 @@
import { I18nextProvider } from "react-i18next"; import { I18nextProvider } from "react-i18next";
import { Platform } from 'react-native'; import { Platform } from 'react-native';
import { GestureHandlerRootView } from "react-native-gesture-handler";
import Toast, { BaseToast, ErrorToast, ToastConfig } from 'react-native-toast-message'; import Toast, { BaseToast, ErrorToast, ToastConfig } from 'react-native-toast-message';
import { Provider as ReduxProvider } from "react-redux"; import { Provider as ReduxProvider } from "react-redux";
import { AuthProvider } from "./contexts/auth-context"; import { AuthProvider } from "./contexts/auth-context";
@ -70,7 +71,7 @@ const toastConfig: ToastConfig = {
export function Provider({ children }: { children: React.ReactNode }) { export function Provider({ children }: { children: React.ReactNode }) {
return ( return (
<GestureHandlerRootView style={{ flex: 1 }}>
<I18nextProvider i18n={i18n}> <I18nextProvider i18n={i18n}>
<LanguageProvider> <LanguageProvider>
<ReduxProvider store={store}> <ReduxProvider store={store}>
@ -88,6 +89,6 @@ export function Provider({ children }: { children: React.ReactNode }) {
</ReduxProvider> </ReduxProvider>
</LanguageProvider> </LanguageProvider>
</I18nextProvider> </I18nextProvider>
</GestureHandlerRootView>
); );
} }