fix onEndReached called on incorrect index

This commit is contained in:
ammarahm-ed
2021-02-23 11:06:02 +05:00
parent e9e9a3fdf6
commit 850d3585d0

View File

@@ -22,6 +22,7 @@ import Heading from '../Typography/Heading';
import Paragraph from '../Typography/Paragraph'; import Paragraph from '../Typography/Paragraph';
import Icon from 'react-native-vector-icons/MaterialCommunityIcons'; import Icon from 'react-native-vector-icons/MaterialCommunityIcons';
import {DDS} from '../../services/DeviceDetection';
const features = [ const features = [
{ {
@@ -59,13 +60,14 @@ const features = [
link: 'https://discord.gg/zQBK97EE22', link: 'https://discord.gg/zQBK97EE22',
}, },
]; ];
let currentIndex = 0;
const SplashScreen = () => { const SplashScreen = () => {
const [state, dispatch] = useTracked(); const [state, dispatch] = useTracked();
const {colors} = state; const {colors} = state;
const [visible, setVisible] = useState(false); const [visible, setVisible] = useState(false);
const carouselRef = useRef(); const carouselRef = useRef();
const [isNext, setIsNext] = useState(true); const [isNext, setIsNext] = useState(true);
const opacity = useValue(0); const opacity = useValue(0);
const translateY = useValue(20); const translateY = useValue(20);
const translateY2 = useValue(0); const translateY2 = useValue(0);
@@ -130,7 +132,7 @@ const SplashScreen = () => {
}, },
], ],
}}> }}>
<View style={{}}> <View>
<Carousel <Carousel
ref={carouselRef} ref={carouselRef}
data={features} data={features}
@@ -138,11 +140,6 @@ const SplashScreen = () => {
sliderWidth={dWidth} sliderWidth={dWidth}
loop={false} loop={false}
shouldOptimizeUpdates shouldOptimizeUpdates
autoplayInterval={5000}
autoplayDelay={3000}
onEndReached={() => {
setIsNext(false);
}}
renderItem={({item, index}) => ( renderItem={({item, index}) => (
<View <View
style={{ style={{
@@ -205,7 +202,7 @@ const SplashScreen = () => {
fontWeight: 'normal', fontWeight: 'normal',
textAlign: 'center', textAlign: 'center',
alignSelf: 'center', alignSelf: 'center',
maxWidth:"80%" maxWidth: DDS.isTab ? 350 : '80%',
}}> }}>
{item.description} {item.description}
</Paragraph> </Paragraph>
@@ -259,6 +256,10 @@ const SplashScreen = () => {
onPress={async () => { onPress={async () => {
if (isNext) { if (isNext) {
carouselRef.current?.snapToNext(); carouselRef.current?.snapToNext();
currentIndex++;
if (currentIndex === 4) {
setIsNext(false);
}
} else { } else {
await hide(); await hide();
await Storage.write('introCompleted', 'true'); await Storage.write('introCompleted', 'true');