callstack / callstack/react-native-pager-view

How I make flatlist with pagerview ?

Open
#561 1 comment 0 reactions 0 assignees View on GitHub
question
Dominant language
TypeScript
Stars
3.4k
Forks
476
Avg merge
10d 21h
Merged PRs (30d)
2

Description

Hello,

I want a flatlist with header with pagerview but I got this error:

`[Encountered an error while measuring a list's offset from its containing VirtualizedList](https://stackoverflow.com/questions/72178734/encountered-an-error-while-measuring-a-lists-offset-from-its-containing-virtual)`

Code:

```
const renderInnerLists = ({ index }) => {
return (
//the pagerview grows to the height of its content, but it is nested inside of the flat list, and it does not cause the flat list to grow.


i + Math.random(1000).toString()}
numColumns={2}
listKey={(item, index) => 'D' + index.toString() + Math.random(1000).toString()}
contentContainerStyle={
s.myGalsContentStyle
}
showsVerticalScrollIndicator={false}
scrollEnabled={false}
/>


i + Math.random(1000).toString()}
listKey={(item, index) => 'S' + index.toString() + Math.random(1000).toString()}
numColumns={2}
contentContainerStyle={
s.myGalsContentStyle
}
showsVerticalScrollIndicator={false}
scrollEnabled={false}
/>


)
}

return (
item.id + Math.random(1000).toString()}
/>
)
```

Contributor guide

Open the contributing guide

Research direction

The issue names no repository file, test, or entry point. Start by reproducing the nested FlatList and PagerView example, then inspect the linked measurement error and the supplied component structure. Done requires a maintainer-confirmed explanation and a working configuration or repository change.

Written by the indexing model from the issue text.

Assessment

Tech stack
javascript, react-native
Domain
mobile
Issue type
Bug
Difficulty
3/5
Estimated time
1-2 days
Activity status
Stale
Clarity
Needs clarification
Newbie friendliness
20/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.