PedroBern / react-native-collapsible-tab-view

A cross-platform Collapsible Tab View component for React Native
MIT License
827 stars 160 forks source link

Slide Flickering in Android also the state changing every index #399

Open Ritik5Prasad opened 1 month ago

Ritik5Prasad commented 1 month ago

I want to render my Custom Tab but im chaning the index its keep setting the each index in between and feels like flickering like if I got 1 to 4 the state change like 1 --> 2 --> 3 --> 4 but I want only 4 and in android it swipes to each screen

` const CustomTab: FC = ({ Header, tabs }) => { const containerRef = useRef(null); const { colors } = useTheme(); const [focusedIndex, setFocusedIndex] = useState(0); const handleSetIndex = (newIndex: number) => { containerRef.current?.setIndex(newIndex); setFocusedIndex(newIndex); };

return (

} ref={containerRef} headerContainerStyle={styles.noOpacity} renderTabBar={(props) => ( handleSetIndex(index)} /> )} containerStyle={{ backgroundColor: colors.background, paddingVertical: 0, }} onIndexChange={(i) => { setFocusedIndex(i); }} > {tabs.map((item, index) => { return ( {item.component} ); })}

);

https://github.com/PedroBern/react-native-collapsible-tab-view/assets/90846926/0c953485-153d-4bc9-8e33-6b182ed2f17a

};`