Dynamic Tab View - React Native

gistfile1.txt

import React, { Component } from 'react';
import { View, StyleSheet, Text } from 'react-native';
import { TabViewAnimated, TabBar } from 'react-native-tab-view';

const styles = StyleSheet.create({
  container: {
    flex: 1,
    marginTop: 20,
  },
  tabbar: {
    backgroundColor: '#222',
  },
  page: {
    flex: 1,
    alignItems: 'center',
    justifyContent: 'center',
  },
  indicator: {
    backgroundColor: '#ffeb3b',
  },
  label: {
    color: '#fff',
    fontWeight: '400',
  },
});

export default class DynamicExample extends Component {

  static title = 'Dynamic tab load';
  static appbarElevation = 0;

  static propTypes = {
    style: View.propTypes.style,
  };

  state = {
    index: 0,
    routes: [],
    loading: true,
    data: {},
  };

  componentDidMount() {
    fetch('https://facebook.github.io/react-native/movies.json')
      .then((response) => response.json())
      .then((responseJson) => {
        const routes = [];
        responseJson.movies.forEach((movie) => {
          routes.push({
            title: movie.title,
            key: movie.releaseYear,
          });
        });

        this.setState({
          data: responseJson,
          routes,
          loading: false,
        });

      });
  }

  _handleChangeTab = (index) => {
    this.setState({ index });
  };

  _renderHeader = (props) => {
    return (
      <TabBar
        {...props}
        scrollEnabled
        indicatorStyle={styles.indicator}
        style={styles.tabbar}
        labelStyle={styles.label}
      />
    );
  };

  _renderScene = ({ route }) => {
    return (
      <View style={[ styles.page, { backgroundColor: '#673ab7' } ]}>
        <Text>{route.key} - {route.title}</Text>
      </View>
    );
  };

  renderScreen () {
    if (this.state.loading) {
      return (
        <View>
          <Text>Loading...</Text>
        </View>
      );
    } else {
      return (
        <TabViewAnimated
          style={styles.container}
          navigationState={this.state}
          renderScene={this._renderScene}
          renderHeader={this._renderHeader}
          onRequestChangeTab={this._handleChangeTab}
        />
      );
    }
  }

  render() {
    return (
      <View style={styles.container}>
        {this.renderScreen()}
      </View>
    );
  }
}

It shows an error "undefined is not an object (evaluating '_reactNative.View.propTypes.style')"

Must be because of outdated dependancy , please be aware that this script was written 2 years back :)