很严重的bug

[xiaoxiaodemeng]

在我的小米10上计算有问题 HScroll这几个组件

代码

import * as React from 'react'
import { View, StyleSheet, Dimensions, ScrollView } from 'react-native'
import { SceneMap } from 'react-native-tab-view'
import { HScrollView } from 'react-native-head-tab-view'
import { CollapsibleHeaderTabView } from 'react-native-tab-view-collapsible-header'
// const HScrollView = HPageViewHoc(ScrollView)

const FirstRoute = () => (
  <HScrollView index={0}>
    <View style={[styles.scene, { backgroundColor: '#ff4081' }]} />
  </HScrollView>
)

const SecondRoute = () => (
  <HScrollView index={1}>
    <View style={[styles.scene, { backgroundColor: '#673ab7' }]} />
  </HScrollView>
)

const initialLayout = { width: Dimensions.get('window').width }

export default function TabViewExample() {
  const [index, setIndex] = React.useState(0)
  const [routes] = React.useState([
    { key: 'first', title: 'First' },
    { key: 'second', title: 'Second' }
  ])

  const renderScene = SceneMap({
    first: FirstRoute,
    second: SecondRoute
  })

  return (
    <>
      <View style={{ height: 50, backgroundColor: '#444' }}></View>
      <CollapsibleHeaderTabView
        makeHeaderHeight={() => 200}
        renderScrollHeader={() => (
          <View style={{ height: 200, backgroundColor: 'red' }} />
        )}
        navigationState={{ index, routes }}
        renderScene={renderScene}
        onIndexChange={setIndex}
        initialLayout={initialLayout}
      />
      <View style={{ height: 50, backgroundColor: '#444' }}></View>
    </>
  )
}

const styles = StyleSheet.create({
  scene: {
    flex: 1
  }
})

问题 HScrollView高度不见了---只有内部给足了高度才能显示出来

[xiaoxiaodemeng]

在组件CollapsibleHeaderTabView上面加这一段代码就会出现计算问题，从而高度没了

[xiaoxiaodemeng]

[zyslife]

在组件CollapsibleHeaderTabView上面加这一段代码就会出现计算问题，从而高度没了

请问你的版本是多少?

[xiaoxiaodemeng]

见图二

[xiaoxiaodemeng]

都是最新版本

[xiaoxiaodemeng]

"react-native-tab-view-collapsible-header": "^2.0.1",
    "react-native-head-tab-view": "^4.0.0-rc.8",
        "react-native-gesture-handler": "^1.10.3",
            "react-native-tab-view": "^3.0.1",

[zyslife]

@xiaoxiaodemeng 请到createCollapsibleScrollView.tsx文件中，加一句打印.

const _onContentSizeChange = useCallback((contentWidth: number, contentHeight: number) => {
    console.log('height==>',contentHeight,expectHeight);
}

[xiaoxiaodemeng]

打印顺序
LOG height==> 48.727272033691406 200
LOG height==> 248 950
LOG height==> 248 950
LOG height==> 949.8181762695312 950
LOG height==> 949.8181762695312 950

[xiaoxiaodemeng]

就是CollapsibleHeaderTabView计算在哪一步出现了问题，只有在给他外面包一层固定高度才可以

[xiaoxiaodemeng]

包了一层800高度的view 打印出来
LOG height==> 48.727272033691406 200
LOG height==> 248 1000
LOG height==> 248 1000
LOG height==> 1000 1000
LOG height==> 1000 1000

[zyslife]

@xiaoxiaodemeng 恩 我知道了，我现在发个新版本

[xiaoxiaodemeng]

感谢

[zyslife]

@xiaoxiaodemeng 试试v4.0.0-rc9

[xiaoxiaodemeng]

可以了