Added collapsable header

[hrkw00]

Added collapsable header which is able to put on the tabbar.

[shuiRong]

@hrkw00
Do you have an example?
( Here's my code, but the FlatList doesn't show. )

[hrkw00]

@shuiRong
Hello, thank you for sending a message to me.
Here is an example code for using collapsable bar

import { StyleSheet, View, Text, SafeAreaView } from 'react-native'

import ScrollableTabView from 'react-native-scrollable-tab-view'
import TabBar from 'react-native-underline-tabbar'

import LabelView from '../components/label-view'
import MockFlatList from '../components/mock-flatlist'
import MockColorfulList from '../components/mock-colorful-list'

interface State {
  readonly scrollEnabled: boolean
}

export default class ScrollableTabViewScreen extends React.Component<
  {},
  State
> {
  readonly state: State = {
    scrollEnabled: true,
  }
  render() {
    const header = (
      <View
        style={{
          alignSelf: 'stretch',
          height: 200,
          justifyContent: 'center',
          alignItems: 'center',
        }}
      >
        <Text>Header</Text>
      </View>
    )

    return (
      <SafeAreaView style={styles.container}>
        <ScrollableTabView
          collapsableBar={header}
          showsVerticalScrollIndicator={false}
          scrollEnabled={this.state.scrollEnabled}
          renderTabBar={() => (
            <TabBar
              tabBarStyle={{ marginTop: 0 }}
              scrollContainerStyle={{ backgroundColor: '#fff' }}
            />
          )}
        >
          <LabelView tabLabel={{ label: 'First Screen' }}>
            <MockFlatList />
          </LabelView>
          <LabelView tabLabel={{ label: 'Second Screen' }}>
            <MockColorfulList />
          </LabelView>
          <LabelView tabLabel={{ label: 'Third Screen' }}>
            <MockFlatList />
          </LabelView>
          <LabelView tabLabel={{ label: 'Fourth Screen' }}>
            <MockColorfulList />
          </LabelView>
          <LabelView tabLabel={{ label: 'Fifth Screen' }}>
            <MockFlatList />
          </LabelView>
          <LabelView tabLabel={{ label: 'Sixth Screen' }}>
            <MockColorfulList />
          </LabelView>
        </ScrollableTabView>
      </SafeAreaView>
    )
  }
}

const styles = StyleSheet.create({
  container: {
    flex: 1,
    backgroundColor: '#fff',
  },
})

[LevisLuong]

Hi @hrkw00 , I got same issue with @shuiRong, It didn't show the content tab on Android.

[EliYenn]

@hrkw00 How to pull you commit ? lastversion Does not contain，Please help，Thank!!