Событие Drawer Navigator (открыть, закрыть) для анимации меню - PullRequest
0 голосов
/ 19 октября 2018

Мой ящик:

const AppDrawerNavigator = createDrawerNavigator({

    Home: {
        screen: HomeScreen,
    },
}, {
    contentComponent: Sidebar
}
 )

Здесь компонент "Моя боковая панель": (уточнен, чтобы быть более четким)

render() {
  const routes = [{
      title: "Home",
      icon: "home",
      route: "HomeScreen",
  },
  {
      title: "Settings",
      icon: "cog",
      route: "Settings",
  }]

  handleViewRef = ref => this.view = ref;
  bounce = () => this.view.bounce(80000)

return (
    <Animatable.View animation="fadeInDown" iterationCount="infinite" direction="alternate">
     <View style={ styles.tab}>
     {
         routes.map(e => (
             <TouchableOpacity key={e.route} style={ styles.link } onPress={_ => this.navigate(e.route)}> 
                <Icon style={styles.ico} name={e.icon} size={20}/>
               <Text style={styles.txt}> {e.title}  </Text>
              </TouchableOpacity>
        ) 
)}
   </Animatable.View>

Как вы можете видеть, я использую анимируемый вид из https://github.com/oblador/react-native-animatable

эта библиотека получила onAnimationBegin, так что я хотел бы архивировать, чтобы получить «событие» из ящика с надписью «im open», чтобы я мог вызвать onAnimationBegin для запуска моей анимации.Потому что в моем примере это цикл, просто чтобы посмотреть, работает ли анимация.

Большое спасибо за вашу помощь

1 Ответ

0 голосов
/ 19 октября 2018

Я думаю, поскольку боковая панель является компонентом полного реагирования, вы можете использовать метод componentDidMount ().Итак, что вы можете сделать:

componentDidMount(){
    onAnimationBegin()
}

Полная ссылка о методе componentDidMount () может быть найдена здесь: https://reactjs.org/docs/react-component.html#componentdidmount

...