React Native: Set horizontal scrollView height according to its absolute positionned childs

Question

I'm currently trying to create a React native screen that displays a week summary. I have a scroolView with a header component and my week. Each selected day is displayed as a tile with the day on it ("monday" or "sunday"), which can be expanded or collapsed to show the day's content. This can be thought of as a week, let's call it dayWrapper. I wrapped several dayWrapper in a horizontal scrollView to let the user switch between weeks (one week is one windowWidth). And I would like to remind you that this horizontal scrollView is inside the vertical scrollView. However, I need these dayWrapper to be absolutely positionned in order to animate them, but the problem is that I need to set a fixed height to my horizontal scrollView if I want my components to be displayed. So either my dayWrapperis cut off, or my vertical scrollView can scroll too low. I expect this scrollView to end at the bottom of the last day.

Here is a simplified piece of code that may illustrate the problem:

<ScrollView>
  <HeaderComponent />
  <ScrollView
    horizontal
    pagingEnabled
    contentContainerStyle={{
      width: numberOfComponent*windowWidth,
      height: // ????, I want this height to be relative to the height of the currently displayed week
    }}
  >
    {weeksList.map(_ => (
      <dayWrapperstyle={{position: 'absolute'}} /> // fixed width but height can vary
    ))}
  </ScrollView>
</ScrollView>

// dayWrapper

{days.map(_ => {
  <Day expanded={false} />
})}

I tried to create an array containing the height of each dayWrapper (with onLayout) and set the horizontal scrollView height accordingly (with the currently selected week index). But the latency of a few milliseconds results in a really bad animation during the expansion. I'm running out of solutions, so I'd love a little help.