Animation and flex space-between layout - react-native

Question

I have 3 blocks disposed using justifyContent: 'space-between'.
The bottom block should be animated (bounce in loop) in height for 100 units in the grey area. The problem is I can't edit margins of the bottom block because justifyContent prop causes the middle block moves (first and middle block should be fixed).
import React, { Component } from 'react';
import { StyleSheet, Text, View, Easing, Animated, // Button,
ScrollView } from 'react-native';
import Button from 'react-native-button';
export default class App extends Component {
constructor () {
super()
this.animatedValue = new Animated.Value(0)
this.animate(Easing.bounce)
}
animate (easing) {
this.animatedValue.setValue(0)
Animated.timing(
this.animatedValue,
{
toValue: 1,
duration: 1000,
easing
}
).start( ()=> this.animate(Easing.bounce))
}
render () {
const marginBottom = this.animatedValue.interpolate({
inputRange: [0, 1],
outputRange: [0, 100]
})
return (
<View style={{flex: 1,flexDirection: 'column',alignItems:"center",justifyContent: 'space-between' }}>
<View style={styles.block}><Text>top</Text></View>
<View style={styles.block}>><Text>second</Text></View>
<View style={{textAlign: "center",height:150,backgroundColor:"#555"}}>
<Animated.View style={[styles.block2, {marginBottom} ]}>
<Text style={{position:"absolute"}} >bottom</Text>
</Animated.View>
</View>
</View>
);
}
}
var styles = StyleSheet.create({
block: {
width: 50,
height: 50,
backgroundColor: 'red',
},
block2: {
width: 50,
height: 50,
backgroundColor: 'red',
}
});
https://snack.expo.io/#alfredopacino/animations-easing
To be more clear about what I'm trying to accomplish. It is just this plain and simple animation https://drive.google.com/open?id=1_nunJMjdsAkjvbE4_URc4GIsoDw8M7KN

Answer 1

Just change your marginBottom to marginTop
<View style={{ textAlign: "center", height: 150, backgroundColor: "#555" }}>
<Animated.View style={[styles.block2, { marginTop:marginBottom }]}>//<-changes--
<Text style={{ position: "absolute" }}>bottom</Text>
</Animated.View>
</View>