|
|
|
|
@ -39,8 +39,8 @@ import CloseIcon from "../components/CloseIcon";
|
|
|
|
|
import CheckmarkIcon from "../components/CheckmarkIcon"; |
|
|
|
|
import { getSubjectTransLanguage } from "../utils/languageUtils"; |
|
|
|
|
import useUserStore from "../store/user"; |
|
|
|
|
import * as ImagePicker from 'expo-image-picker'; |
|
|
|
|
import * as FileSystem from 'expo-file-system'; |
|
|
|
|
import * as ImagePicker from "expo-image-picker"; |
|
|
|
|
import * as FileSystem from "expo-file-system"; |
|
|
|
|
// 为图标定义类型
|
|
|
|
|
type IconProps = { |
|
|
|
|
name: string; |
|
|
|
|
@ -88,16 +88,28 @@ const LazyImage = React.memo(
|
|
|
|
|
<View style={[style, { overflow: "hidden" }]}> |
|
|
|
|
{/* Show placeholder while image is loading */} |
|
|
|
|
{!isLoaded && !hasError && ( |
|
|
|
|
<View style={[style, styles.imagePlaceholder, { position: 'absolute', zIndex: 1 }]} /> |
|
|
|
|
<View |
|
|
|
|
style={[ |
|
|
|
|
style, |
|
|
|
|
styles.imagePlaceholder, |
|
|
|
|
{ position: "absolute", zIndex: 1 }, |
|
|
|
|
]} |
|
|
|
|
/> |
|
|
|
|
)} |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
{/* Show error state if image failed to load */} |
|
|
|
|
{hasError && ( |
|
|
|
|
<View |
|
|
|
|
style={[style, styles.imagePlaceholder, { position: 'absolute', zIndex: 1 }]} |
|
|
|
|
style={[ |
|
|
|
|
style, |
|
|
|
|
styles.imagePlaceholder, |
|
|
|
|
{ position: "absolute", zIndex: 1 }, |
|
|
|
|
]} |
|
|
|
|
> |
|
|
|
|
<IconComponent name="image-outline" size={24} color="#999" /> |
|
|
|
|
<Text style={{ fontSize: fontSize(12), color: "#999", marginTop: 4 }}> |
|
|
|
|
<Text |
|
|
|
|
style={{ fontSize: fontSize(12), color: "#999", marginTop: 4 }} |
|
|
|
|
> |
|
|
|
|
加载失败 |
|
|
|
|
</Text> |
|
|
|
|
</View> |
|
|
|
|
@ -120,7 +132,7 @@ const LazyImage = React.memo(
|
|
|
|
|
const ProductSkeleton = React.memo(() => { |
|
|
|
|
// 创建动画值
|
|
|
|
|
const shimmerAnim = useRef(new Animated.Value(0)).current; |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
// 设置动画效果
|
|
|
|
|
useEffect(() => { |
|
|
|
|
const shimmerAnimation = Animated.loop( |
|
|
|
|
@ -130,14 +142,14 @@ const ProductSkeleton = React.memo(() => {
|
|
|
|
|
useNativeDriver: true, |
|
|
|
|
}) |
|
|
|
|
); |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
shimmerAnimation.start(); |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
return () => { |
|
|
|
|
shimmerAnimation.stop(); |
|
|
|
|
}; |
|
|
|
|
}, []); |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
// 定义动画插值
|
|
|
|
|
const shimmerTranslate = shimmerAnim.interpolate({ |
|
|
|
|
inputRange: [0, 1], |
|
|
|
|
@ -167,7 +179,7 @@ const ProductSkeleton = React.memo(() => {
|
|
|
|
|
]} |
|
|
|
|
/> |
|
|
|
|
</View> |
|
|
|
|
<View style={[styles.skeletonTitle, { width: '60%' }]}> |
|
|
|
|
<View style={[styles.skeletonTitle, { width: "60%" }]}> |
|
|
|
|
<Animated.View |
|
|
|
|
style={[ |
|
|
|
|
styles.shimmer, |
|
|
|
|
@ -470,7 +482,7 @@ export const HomeScreen = () => {
|
|
|
|
|
<IconComponent name="image-outline" size={24} color="#999" /> |
|
|
|
|
</View> |
|
|
|
|
)} |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
{userStore.user?.user_id && ( |
|
|
|
|
<View style={styles.vipButtonContainer}> |
|
|
|
|
<TouchableOpacity style={styles.vipButton}> |
|
|
|
|
@ -514,12 +526,12 @@ export const HomeScreen = () => {
|
|
|
|
|
</View> |
|
|
|
|
</TouchableOpacity> |
|
|
|
|
); |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
// 渲染骨架屏网格
|
|
|
|
|
const renderSkeletonGrid = useCallback(() => { |
|
|
|
|
// 创建骨架屏数组
|
|
|
|
|
const skeletonArray = Array(8).fill(null); |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
return ( |
|
|
|
|
<View style={styles.skeletonContainer}> |
|
|
|
|
<FlatList |
|
|
|
|
@ -529,7 +541,7 @@ export const HomeScreen = () => {
|
|
|
|
|
numColumns={2} |
|
|
|
|
columnWrapperStyle={styles.productCardGroup} |
|
|
|
|
scrollEnabled={false} |
|
|
|
|
contentContainerStyle={{paddingBottom: 15}} |
|
|
|
|
contentContainerStyle={{ paddingBottom: 15 }} |
|
|
|
|
/> |
|
|
|
|
</View> |
|
|
|
|
); |
|
|
|
|
@ -538,33 +550,78 @@ export const HomeScreen = () => {
|
|
|
|
|
// 清理expo-image-picker临时文件
|
|
|
|
|
const cleanupImagePickerCache = async () => { |
|
|
|
|
try { |
|
|
|
|
// Skip cache cleanup on web platform
|
|
|
|
|
if (Platform.OS === 'web') { |
|
|
|
|
console.log('Cache cleanup skipped on web platform'); |
|
|
|
|
setGalleryUsed(false); |
|
|
|
|
return; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
// 相册选择后清理临时缓存
|
|
|
|
|
const cacheDir = `${FileSystem.cacheDirectory}ImagePicker`; |
|
|
|
|
await FileSystem.deleteAsync(cacheDir, { idempotent: true }); |
|
|
|
|
console.log('已清理ImagePicker缓存'); |
|
|
|
|
|
|
|
|
|
console.log("已清理ImagePicker缓存"); |
|
|
|
|
|
|
|
|
|
// 立即重置状态，无需用户干预
|
|
|
|
|
setGalleryUsed(false); |
|
|
|
|
} catch (error) { |
|
|
|
|
console.log('清理缓存错误', error); |
|
|
|
|
console.log("清理缓存错误", error); |
|
|
|
|
// Even if cleanup fails, reset the state
|
|
|
|
|
setGalleryUsed(false); |
|
|
|
|
} |
|
|
|
|
}; |
|
|
|
|
|
|
|
|
|
// 将图片URI转换为FormData
|
|
|
|
|
const uriToFormData = async (uri: string) => { |
|
|
|
|
try { |
|
|
|
|
// 创建FormData对象
|
|
|
|
|
const formData = new FormData(); |
|
|
|
|
|
|
|
|
|
// 获取文件名
|
|
|
|
|
const filename = uri.split("/").pop() || "image.jpg"; |
|
|
|
|
|
|
|
|
|
// 判断文件类型（mime type）
|
|
|
|
|
const match = /\.(\w+)$/.exec(filename); |
|
|
|
|
const type = match ? `image/${match[1]}` : "image/jpeg"; |
|
|
|
|
|
|
|
|
|
// 处理iOS路径前缀
|
|
|
|
|
const imageUri = Platform.OS === "ios" ? uri.replace("file://", "") : uri; |
|
|
|
|
|
|
|
|
|
// 将图片转换为Blob
|
|
|
|
|
const imageFetchResponse = await fetch(imageUri); |
|
|
|
|
const imageBlob = await imageFetchResponse.blob(); |
|
|
|
|
|
|
|
|
|
// 添加图片到FormData
|
|
|
|
|
formData.append("image", imageBlob, filename); |
|
|
|
|
|
|
|
|
|
console.log("FormData 详情:"); |
|
|
|
|
console.log("- 图片URI:", uri); |
|
|
|
|
console.log("- 文件名:", filename); |
|
|
|
|
console.log("- 文件类型:", type); |
|
|
|
|
|
|
|
|
|
return formData; |
|
|
|
|
} catch (error) { |
|
|
|
|
console.error("创建FormData错误:", error); |
|
|
|
|
throw error; |
|
|
|
|
} |
|
|
|
|
}; |
|
|
|
|
|
|
|
|
|
// 处理从相册选择
|
|
|
|
|
const handleChooseFromGallery = useCallback(async () => { |
|
|
|
|
console.log('handleChooseFromGallery'); |
|
|
|
|
console.log("handleChooseFromGallery"); |
|
|
|
|
setShowImagePickerModal(false); |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
// 等待模态窗关闭后再执行
|
|
|
|
|
setTimeout(async () => { |
|
|
|
|
try { |
|
|
|
|
// 请求相册权限
|
|
|
|
|
const permissionResult = await ImagePicker.requestMediaLibraryPermissionsAsync(); |
|
|
|
|
if (permissionResult.status !== 'granted') { |
|
|
|
|
console.log('相册权限被拒绝'); |
|
|
|
|
const permissionResult = |
|
|
|
|
await ImagePicker.requestMediaLibraryPermissionsAsync(); |
|
|
|
|
if (permissionResult.status !== "granted") { |
|
|
|
|
console.log("相册权限被拒绝"); |
|
|
|
|
return; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
// 打开相册
|
|
|
|
|
const result = await ImagePicker.launchImageLibraryAsync({ |
|
|
|
|
mediaTypes: ImagePicker.MediaTypeOptions.Images, |
|
|
|
|
@ -572,70 +629,75 @@ export const HomeScreen = () => {
|
|
|
|
|
aspect: [4, 3], |
|
|
|
|
quality: 1, |
|
|
|
|
}); |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
if (!result.canceled && result.assets && result.assets.length > 0) { |
|
|
|
|
console.log('相册选择成功:', result.assets[0].uri); |
|
|
|
|
// 这里可以添加后续处理代码，如图片上传等
|
|
|
|
|
|
|
|
|
|
// 相册选择完成后，立即清理缓存并重置状态
|
|
|
|
|
console.log("相册选择成功:", result.assets[0].uri); |
|
|
|
|
|
|
|
|
|
await cleanupImagePickerCache(); |
|
|
|
|
navigation.navigate("ImageSearchResultScreen", { |
|
|
|
|
image: result.assets[0].uri, |
|
|
|
|
type: 1, |
|
|
|
|
}); |
|
|
|
|
} |
|
|
|
|
} catch (error: any) { |
|
|
|
|
console.error('相册错误:', error); |
|
|
|
|
console.error("相册错误:", error); |
|
|
|
|
// 出错时也清理缓存
|
|
|
|
|
await cleanupImagePickerCache(); |
|
|
|
|
} |
|
|
|
|
}, 500); |
|
|
|
|
}, []); |
|
|
|
|
|
|
|
|
|
}, [userStore.user]); |
|
|
|
|
|
|
|
|
|
// 处理相机拍照 - 简化版本，不再需要处理galleryUsed
|
|
|
|
|
const handleTakePhoto = useCallback(async () => { |
|
|
|
|
console.log('handleTakePhoto'); |
|
|
|
|
console.log("handleTakePhoto"); |
|
|
|
|
setShowImagePickerModal(false); |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
// 等待模态窗关闭后再执行
|
|
|
|
|
setTimeout(async () => { |
|
|
|
|
try { |
|
|
|
|
const permissionResult = await ImagePicker.requestCameraPermissionsAsync(); |
|
|
|
|
if (permissionResult.status !== 'granted') { |
|
|
|
|
console.log('相机权限被拒绝'); |
|
|
|
|
const permissionResult = |
|
|
|
|
await ImagePicker.requestCameraPermissionsAsync(); |
|
|
|
|
if (permissionResult.status !== "granted") { |
|
|
|
|
console.log("相机权限被拒绝"); |
|
|
|
|
return; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
const result = await ImagePicker.launchCameraAsync({ |
|
|
|
|
mediaTypes: ImagePicker.MediaTypeOptions.Images, |
|
|
|
|
allowsEditing: true, |
|
|
|
|
aspect: [4, 3], |
|
|
|
|
quality: 1, |
|
|
|
|
}); |
|
|
|
|
|
|
|
|
|
console.log(result); |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
if (!result.canceled && result.assets && result.assets.length > 0) { |
|
|
|
|
console.log('拍照成功:', result.assets[0].uri); |
|
|
|
|
// 这里可以添加后续处理代码，如图片上传等
|
|
|
|
|
console.log("拍照成功:", result.assets[0].uri); |
|
|
|
|
|
|
|
|
|
// 使用后清理缓存
|
|
|
|
|
await cleanupImagePickerCache(); |
|
|
|
|
// 将图片URI转换为FormData
|
|
|
|
|
navigation.navigate("ImageSearchResultScreen", { |
|
|
|
|
image: result.assets[0].uri, |
|
|
|
|
type: 1, |
|
|
|
|
}); |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
// 使用后清理缓存
|
|
|
|
|
await cleanupImagePickerCache(); |
|
|
|
|
} catch (error: any) { |
|
|
|
|
console.error('相机错误:', error); |
|
|
|
|
console.error("相机错误:", error); |
|
|
|
|
// 出错时也清理缓存
|
|
|
|
|
await cleanupImagePickerCache(); |
|
|
|
|
} |
|
|
|
|
}, 500); |
|
|
|
|
}, []); |
|
|
|
|
|
|
|
|
|
}, [userStore.user]); |
|
|
|
|
|
|
|
|
|
// 重置应用状态函数
|
|
|
|
|
const resetAppState = useCallback(() => { |
|
|
|
|
// 重置标记
|
|
|
|
|
setGalleryUsed(false); |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
// 清理缓存
|
|
|
|
|
cleanupImagePickerCache(); |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
// 提示用户
|
|
|
|
|
Alert.alert('已重置', '现在您可以使用相机功能了'); |
|
|
|
|
Alert.alert("已重置", "现在您可以使用相机功能了"); |
|
|
|
|
}, []); |
|
|
|
|
|
|
|
|
|
// 渲染列表头部内容
|
|
|
|
|
@ -695,7 +757,7 @@ export const HomeScreen = () => {
|
|
|
|
|
> |
|
|
|
|
<IconComponent name="search-outline" size={20} color="#999" /> |
|
|
|
|
<Text style={styles.searchPlaceholder}>搜索商品</Text> |
|
|
|
|
<TouchableOpacity
|
|
|
|
|
<TouchableOpacity |
|
|
|
|
style={styles.cameraButton} |
|
|
|
|
onPress={() => setShowImagePickerModal(true)} |
|
|
|
|
> |
|
|
|
|
@ -815,7 +877,7 @@ export const HomeScreen = () => {
|
|
|
|
|
) : null} |
|
|
|
|
</> |
|
|
|
|
); |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
return ( |
|
|
|
|
<SafeAreaView style={styles.safeArea}> |
|
|
|
|
<StatusBar barStyle="dark-content" backgroundColor="#fff" /> |
|
|
|
|
@ -855,7 +917,7 @@ export const HomeScreen = () => {
|
|
|
|
|
} |
|
|
|
|
/> |
|
|
|
|
)} |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
{/* Categories Modal */} |
|
|
|
|
<Modal |
|
|
|
|
visible={showCategoryModal} |
|
|
|
|
@ -913,7 +975,7 @@ export const HomeScreen = () => {
|
|
|
|
|
</View> |
|
|
|
|
</View> |
|
|
|
|
</Modal> |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
{/* Image Picker Modal */} |
|
|
|
|
<Modal |
|
|
|
|
visible={showImagePickerModal} |
|
|
|
|
@ -921,7 +983,7 @@ export const HomeScreen = () => {
|
|
|
|
|
transparent={true} |
|
|
|
|
onRequestClose={() => setShowImagePickerModal(false)} |
|
|
|
|
> |
|
|
|
|
<TouchableOpacity
|
|
|
|
|
<TouchableOpacity |
|
|
|
|
style={styles.imagePickerOverlay} |
|
|
|
|
activeOpacity={1} |
|
|
|
|
onPress={() => setShowImagePickerModal(false)} |
|
|
|
|
@ -929,35 +991,43 @@ export const HomeScreen = () => {
|
|
|
|
|
<View style={styles.imagePickerContent}> |
|
|
|
|
{!galleryUsed ? ( |
|
|
|
|
// 正常状态，显示相机选项
|
|
|
|
|
<TouchableOpacity
|
|
|
|
|
<TouchableOpacity |
|
|
|
|
style={styles.imagePickerOption} |
|
|
|
|
onPress={handleTakePhoto} |
|
|
|
|
> |
|
|
|
|
<IconComponent name="camera-outline" size={24} color="#333" /> |
|
|
|
|
<IconComponent |
|
|
|
|
name="camera-outline" |
|
|
|
|
size={24} |
|
|
|
|
color="#333" |
|
|
|
|
/> |
|
|
|
|
<Text style={styles.imagePickerText}>拍照</Text> |
|
|
|
|
</TouchableOpacity> |
|
|
|
|
) : ( |
|
|
|
|
// 已使用相册状态，显示重置选项
|
|
|
|
|
<TouchableOpacity
|
|
|
|
|
<TouchableOpacity |
|
|
|
|
style={styles.imagePickerOption} |
|
|
|
|
onPress={resetAppState} |
|
|
|
|
> |
|
|
|
|
<IconComponent name="refresh-outline" size={24} color="#333" /> |
|
|
|
|
<IconComponent |
|
|
|
|
name="refresh-outline" |
|
|
|
|
size={24} |
|
|
|
|
color="#333" |
|
|
|
|
/> |
|
|
|
|
<Text style={styles.imagePickerText}>重置相机功能</Text> |
|
|
|
|
</TouchableOpacity> |
|
|
|
|
)} |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<View style={styles.imagePickerDivider} /> |
|
|
|
|
|
|
|
|
|
<TouchableOpacity
|
|
|
|
|
|
|
|
|
|
<TouchableOpacity |
|
|
|
|
style={styles.imagePickerOption} |
|
|
|
|
onPress={handleChooseFromGallery} |
|
|
|
|
> |
|
|
|
|
<IconComponent name="images-outline" size={24} color="#333" /> |
|
|
|
|
<Text style={styles.imagePickerText}>从相册选择</Text> |
|
|
|
|
</TouchableOpacity> |
|
|
|
|
|
|
|
|
|
<TouchableOpacity
|
|
|
|
|
|
|
|
|
|
<TouchableOpacity |
|
|
|
|
style={styles.imagePickerCancelButton} |
|
|
|
|
onPress={() => setShowImagePickerModal(false)} |
|
|
|
|
> |
|
|
|
|
@ -974,15 +1044,15 @@ export const HomeScreen = () => {
|
|
|
|
|
const styles = StyleSheet.create<StylesType>({ |
|
|
|
|
safeArea: { |
|
|
|
|
flex: 1, |
|
|
|
|
backgroundColor: '#fff', |
|
|
|
|
backgroundColor: "#fff", |
|
|
|
|
}, |
|
|
|
|
safeAreaContent: { |
|
|
|
|
flex: 1, |
|
|
|
|
paddingTop: Platform.OS === 'android' ? 0 : 0, |
|
|
|
|
paddingTop: Platform.OS === "android" ? 0 : 0, |
|
|
|
|
}, |
|
|
|
|
container: { |
|
|
|
|
flex: 1, |
|
|
|
|
backgroundColor: '#fff', |
|
|
|
|
backgroundColor: "#fff", |
|
|
|
|
}, |
|
|
|
|
swpImg: { |
|
|
|
|
width: "100%", |
|
|
|
|
@ -1359,53 +1429,53 @@ const styles = StyleSheet.create<StylesType>({
|
|
|
|
|
paddingTop: 0, |
|
|
|
|
}, |
|
|
|
|
skeletonImage: { |
|
|
|
|
width: '100%', |
|
|
|
|
paddingBottom: '100%', |
|
|
|
|
width: "100%", |
|
|
|
|
paddingBottom: "100%", |
|
|
|
|
borderRadius: 10, |
|
|
|
|
backgroundColor: '#e1e1e1', |
|
|
|
|
overflow: 'hidden', |
|
|
|
|
position: 'relative', |
|
|
|
|
backgroundColor: "#e1e1e1", |
|
|
|
|
overflow: "hidden", |
|
|
|
|
position: "relative", |
|
|
|
|
}, |
|
|
|
|
skeletonTitle: { |
|
|
|
|
height: 16, |
|
|
|
|
borderRadius: 4, |
|
|
|
|
marginTop: 8, |
|
|
|
|
marginBottom: 4, |
|
|
|
|
width: '100%', |
|
|
|
|
backgroundColor: '#e1e1e1', |
|
|
|
|
overflow: 'hidden', |
|
|
|
|
position: 'relative', |
|
|
|
|
width: "100%", |
|
|
|
|
backgroundColor: "#e1e1e1", |
|
|
|
|
overflow: "hidden", |
|
|
|
|
position: "relative", |
|
|
|
|
}, |
|
|
|
|
skeletonPrice: { |
|
|
|
|
height: 24, |
|
|
|
|
width: 80, |
|
|
|
|
borderRadius: 4, |
|
|
|
|
marginTop: 8, |
|
|
|
|
backgroundColor: '#e1e1e1', |
|
|
|
|
overflow: 'hidden', |
|
|
|
|
position: 'relative', |
|
|
|
|
backgroundColor: "#e1e1e1", |
|
|
|
|
overflow: "hidden", |
|
|
|
|
position: "relative", |
|
|
|
|
}, |
|
|
|
|
skeletonSales: { |
|
|
|
|
height: 14, |
|
|
|
|
width: '40%', |
|
|
|
|
width: "40%", |
|
|
|
|
borderRadius: 4, |
|
|
|
|
marginTop: 8, |
|
|
|
|
backgroundColor: '#e1e1e1', |
|
|
|
|
overflow: 'hidden', |
|
|
|
|
position: 'relative', |
|
|
|
|
backgroundColor: "#e1e1e1", |
|
|
|
|
overflow: "hidden", |
|
|
|
|
position: "relative", |
|
|
|
|
}, |
|
|
|
|
shimmer: { |
|
|
|
|
width: '30%', |
|
|
|
|
height: '100%', |
|
|
|
|
backgroundColor: 'rgba(255, 255, 255, 0.3)', |
|
|
|
|
position: 'absolute', |
|
|
|
|
width: "30%", |
|
|
|
|
height: "100%", |
|
|
|
|
backgroundColor: "rgba(255, 255, 255, 0.3)", |
|
|
|
|
position: "absolute", |
|
|
|
|
top: 0, |
|
|
|
|
left: 0, |
|
|
|
|
}, |
|
|
|
|
imagePlaceholder: { |
|
|
|
|
backgroundColor: '#EAEAEA', |
|
|
|
|
justifyContent: 'center', |
|
|
|
|
alignItems: 'center', |
|
|
|
|
backgroundColor: "#EAEAEA", |
|
|
|
|
justifyContent: "center", |
|
|
|
|
alignItems: "center", |
|
|
|
|
borderRadius: 8, |
|
|
|
|
}, |
|
|
|
|
productImage: { |
|
|
|
|
@ -1416,40 +1486,40 @@ const styles = StyleSheet.create<StylesType>({
|
|
|
|
|
// Image Picker Modal Styles
|
|
|
|
|
imagePickerOverlay: { |
|
|
|
|
flex: 1, |
|
|
|
|
backgroundColor: 'rgba(0, 0, 0, 0.5)', |
|
|
|
|
justifyContent: 'flex-end', |
|
|
|
|
backgroundColor: "rgba(0, 0, 0, 0.5)", |
|
|
|
|
justifyContent: "flex-end", |
|
|
|
|
}, |
|
|
|
|
imagePickerContent: { |
|
|
|
|
backgroundColor: '#fff', |
|
|
|
|
backgroundColor: "#fff", |
|
|
|
|
borderTopLeftRadius: 20, |
|
|
|
|
borderTopRightRadius: 20, |
|
|
|
|
paddingTop: 20, |
|
|
|
|
}, |
|
|
|
|
imagePickerOption: { |
|
|
|
|
flexDirection: 'row', |
|
|
|
|
alignItems: 'center', |
|
|
|
|
flexDirection: "row", |
|
|
|
|
alignItems: "center", |
|
|
|
|
paddingVertical: 16, |
|
|
|
|
paddingHorizontal: 20, |
|
|
|
|
}, |
|
|
|
|
imagePickerText: { |
|
|
|
|
fontSize: fontSize(16), |
|
|
|
|
marginLeft: 12, |
|
|
|
|
color: '#333', |
|
|
|
|
color: "#333", |
|
|
|
|
}, |
|
|
|
|
imagePickerDivider: { |
|
|
|
|
height: 1, |
|
|
|
|
backgroundColor: '#f0f0f0', |
|
|
|
|
backgroundColor: "#f0f0f0", |
|
|
|
|
marginHorizontal: 20, |
|
|
|
|
}, |
|
|
|
|
imagePickerCancelButton: { |
|
|
|
|
alignItems: 'center', |
|
|
|
|
alignItems: "center", |
|
|
|
|
paddingVertical: 16, |
|
|
|
|
marginTop: 8, |
|
|
|
|
borderTopWidth: 1, |
|
|
|
|
borderTopColor: '#f0f0f0', |
|
|
|
|
borderTopColor: "#f0f0f0", |
|
|
|
|
}, |
|
|
|
|
imagePickerCancelText: { |
|
|
|
|
fontSize: fontSize(16), |
|
|
|
|
color: '#999', |
|
|
|
|
color: "#999", |
|
|
|
|
}, |
|
|
|
|
}); |
|
|
|
|
}); |
|
|
|
|
|
Mac
3 weeks ago