import React, { Component } from 'react'
import { StyleSheet, View, Text, Image, Animated } from 'react-native'
export interface Props {
    headHeight: number
}

export interface State {
    scrollY: Animated.Value
}

export default class CeilingHeader extends React.Component<Props, State> {
    constructor(props: Props | Readonly<Props>) {
        super(props);

    }
    componentDidMount() {

    }

    componentWillUnmount() {
    }

    public readonly state: Readonly<State> = {
        scrollY: new Animated.Value(0)
    }


    render() {
        let { children, headHeight } = this.props;
        let { scrollY } = this.state;
        let translateY = scrollY.interpolate({
            inputRange: [-1, 0, headHeight, headHeight + 1],
            outputRange: [0, 0, 0, 1],
        });
        return (
            <Animated.View style={{ transform: [{ translateY }], zIndex: 99999 }}>
                {children}
            </Animated.View>
        );

    }
}
const styles = StyleSheet.create({
    main: {

    }
})