52 lines
1.7 KiB
JavaScript
52 lines
1.7 KiB
JavaScript
import React from 'react';
|
|
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('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);
|
|
let touchY = 0;
|
|
let touchX = 0;
|
|
return (
|
|
<View
|
|
style={{ padding: 10, paddingTop: 20, flex: 1, justifyContent: "center" }}
|
|
onTouchStart={e => {
|
|
//console.log(e.nativeEvent)
|
|
touchY = e.nativeEvent.pageY
|
|
touchX = e.nativeEvent.pageX
|
|
}}
|
|
onTouchEnd={e => {
|
|
if ((touchX - e.nativeEvent.pageX > 20) && (images.length - 1 > imageIndex))
|
|
setImageIndex(imageIndex + 1)
|
|
if ((touchX - e.nativeEvent.pageX < -20) && (imageIndex > 0))
|
|
setImageIndex(imageIndex - 1)
|
|
}}
|
|
>
|
|
<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>
|
|
)
|
|
};
|
|
|
|
const styles = StyleSheet.create({
|
|
image: {
|
|
width: "100%",
|
|
height: "100%",
|
|
resizeMode: "contain",
|
|
},
|
|
countText: {
|
|
position: 'absolute',
|
|
left: '50%',
|
|
bottom: 10
|
|
}
|
|
});
|
|
|
|
export default Slideshow;
|