New V Needed, improves cache and image handling

This commit is contained in:
Adolfo Reyna
2024-10-04 01:34:24 -04:00
parent dc52f57424
commit 461b8c98ed
7 changed files with 4149 additions and 123 deletions

View File

@@ -1,31 +1,36 @@
import React from 'react';
import { StyleSheet, TouchableHighlight, Image, TouchableWithoutFeedback, View } from 'react-native';
import { StyleSheet, View } from 'react-native';
import { Text, List, RadioButton } from "react-native-paper";
import { Image } from 'expo-image'; // Import Image from expo-image
let Slideshow = (props) => {
//console.log(route.params.postid)
//return <SinglePostComponent postId={route.params.postid} />;
console.log(props)
//console.log('RenderSlideSHow', props)
const images = props.route.params.images;
[imageIndex, setImageIndex] = React.useState(props.route.params.startIndex);
//images.length
console.log(imageIndex);
console.log(images[imageIndex][1], images.length);
// images.length
// console.log(imageIndex);
// console.log(images[imageIndex][1], images.length);
let touchY = 0;
let touchX = 0;
return (
<View
style={{ padding: 10, paddingTop: 20, flex: 1, justifyContent: "center" }}
onTouchStart={e => {
this.touchY = e.nativeEvent.pageY
this.touchX = e.nativeEvent.pageX
//console.log(e.nativeEvent)
touchY = e.nativeEvent.pageY
touchX = e.nativeEvent.pageX
}}
onTouchEnd={e => {
if ((this.touchX - e.nativeEvent.pageX > 20) && (images.length - 1 > imageIndex))
if ((touchX - e.nativeEvent.pageX > 20) && (images.length - 1 > imageIndex))
setImageIndex(imageIndex + 1)
if ((this.touchX - e.nativeEvent.pageX < -20) && (imageIndex > 0))
if ((touchX - e.nativeEvent.pageX < -20) && (imageIndex > 0))
setImageIndex(imageIndex - 1)
}}
>
<Image source={{ uri: images[imageIndex][1] }} key={images[imageIndex][1]} style={styles.image} />
<Text style={styles.countText}>{imageIndex+1}/{images.length}</Text>
<Image source={{ uri: images[imageIndex][1] }} key={images[imageIndex][1]} style={styles.image} cachePolicy="memory-disk"/>
</View>
)
};
@@ -36,6 +41,11 @@ const styles = StyleSheet.create({
height: "100%",
resizeMode: "contain",
},
countText: {
position: 'absolute',
left: '50%',
bottom: 10
}
});
export default Slideshow;