реакции-навигация, как установить поле tabBar, используя scrollView Value

Question

Я хочу установить tabBar margin, соответствующий Animated.Value, но, похоже, он не работает.В tabBarOptions я установил marginTop на this.AnimatedHeaderValue, однако, он не отвечает, когда я прокручиваю вид.Ниже мой код:

const Header_Maximum_Height = 40;
const Header_Minimum_Height = 0;

class HomeScreen extends Component{
          constructor()
          {
              super();
              this.AnimatedHeaderValue = new Animated.Value(0);
          }
        render() {
        const AnimateHeaderHeight = this.AnimatedHeaderValue.interpolate(
                  {
                      inputRange: [ 0, ( Header_Maximum_Height - Header_Minimum_Height ) ],
                      outputRange: [ Header_Maximum_Height, Header_Minimum_Height ],
                      extrapolate: 'clamp'
                  });
        return (
         <SafeAreaView style={{flex:1}}>
          <Animated.ScrollView
                              scrollEventThrottle = { 16 }
                              onScroll = { Animated.event(
                                [{ nativeEvent: { contentOffset: { y: this.AnimatedHeaderValue }}}]
                          )}>
           <ImageBackground
                    style={{width:375, height:400}}
                    source={require('./assets/pizza.jpg')}>
           <Animated.View style={{ backgroundColor:'gray',height:AnimateHeaderHeight,opacity:0.5, marginTop:0}}>

           </Animated.View>
          </Animated.ScrollView>
         </SafeAreaView>

const AppTabNavigator = createMaterialTopTabNavigator({

  Home:{
  screen:HomeScreen,
  navigationOptions: {
      header: null,
      tabBarVisible:true,
      activeTintColor: '#e91e63',
    }
  },{
    tabBarOptions: {
     showLabel: true,
      style: {
          backgroundColor: 'gray',
          position: 'absolute',
          Top:  Dimensions.get('window').height-tabBarHeight,
          left:0,
          right:0,
          opacity:0.5,

//Here I set the value to this.AnimatedHeaderValue
          marginTop:this.AnimatedHeaderValue
      },
      labelStyle:{
        fontSize:15,
        color:"white"
      }
    }
   }
  )

Я думаю, что это правильный способ установить значение поля, если я хочу, чтобы оно соответствовало значению прокрутки.но не похоже на работу.Есть идеи почему?комментарии или советы будут действительно полезны, спасибо заранее :))