I need a solution for jumping to specific dates in an events section, with the initial scroll position set to the first future date.
To achieve this, I have attempted to store the y positions of each date in the state.
renderSectionHeader= (sectionData, sectionID) => (
<View
onLayout={(event) => {
const { y } = event.nativeEvent.layout;
const sectionPosition = { [sectionID]: y };
const sectionPositions = Object.assign({}, this.state.sectionPositions, sectionPosition);
this.setState({ sectionPositions });
}}
...
However, there are issues with lazy rendering and renderSectionHeader not being called for elements further down the list.
Trying to calculate positions mathematically results in sections showing on screen as it moves towards the selected date.
Are there any solutions to address these challenges?
RELATED
React Native ListView: How to scroll to a particular row
https://github.com/facebook/react-native/issues/499
UPDATE
I know that all rows in my app have the same height.
Using contentOffset={{ y: offsetY }} instead of setScroll doesn't work due to needing to render all items up to the given item.
initialListSize={99999999} works but slows down the page significantly, which is discouraged.
UPDATE 2
Is it feasible to provide initial content to the datasource and update data by adding extra items before and after elements on screen?
Alternatively, is there a library that can fulfill these requirements?