How to use react-native-tab-view - 10 common examples

inputStyle={{
                backgroundColor: '#30353B',
                color: Colors.fontColor,
              }}
              containerStyle={{
                backgroundColor: '#30353B',
                borderTopWidth: 0,
                borderBottomWidth: 0,
              }}
          />
          {this.state.searching ?
              !this.props.loading.SEARCH ?
                  this.props.searchResults.releases.length > 0 || this.props.searchResults.artists.length > 0 ?
                       this.setState({index, route: this.state.routes[index].key})}
                          initialLayout={{width: Layout.window.width, height: Layout.window.height}}
                      /> :

render() {
      return (
         (
            
          )}
        />
      )
    }
  }

render() {
    return (
      
         }
          renderTabBar={props =>
            
          }
          onIndexChange={index => this.setState({index})}
          initialLayout={{width: Dimensions.get('window').width}}
        />

color: [244, 67, 54],
      },
      {
        key: 'contacts',
        icon: 'ios-people',
        color: [0, 132, 255],
      },
      {
        key: 'albums',
        icon: 'ios-albums',
        color: [76, 175, 80],
      },
    ],
  });

  const renderScene = SceneMap({
    article: Article,
    contacts: Contacts,
    albums: Albums,
  });

  return (
     null}
      onIndexChange={index => {
        setNavigation({ ...navigation, index: index });
      }}
      renderPager={props => (
        
      )}

render() {
    const renderScene = SceneMap({
      threads: this.renderThreadsRoute,
      communities: this.renderCommunitiesRoute,
      people: this.renderPeopleRoute,
    });

    return (
      
    );
  }

import WorkoutScreen from 'app/features/workout/WorkoutScreen';
import SettingsTab from 'app/features/settings/SettingsTab';
import AnalysisScreen from 'app/features/analysis/AnalysisScreen';
import HistoryScreen from 'app/features/history/HistoryScreen';

export const initialIndex = 3;

export const routes = [
    { key: '0', title: 'WORKOUT' },
    { key: '1', title: 'HISTORY' },
    { key: '2', title: 'ANALYSIS'},
    { key: '3', title: 'SETTINGS' },       
];

export const sceneMap = SceneMap({
    '0': () => ,
    '1': () => ,
    '2': () => ,
    '3': () => 
});

))}
			
		
	)

	const [routes] = React.useState([
		{ key: 'medias', title: 'Medias' },
		{ key: 'links', title: 'Links' },
		{ key: 'docs', title: 'Documents' },
	])

	const renderScene = SceneMap({
		medias: mediaView,
		links: linksView,
		docs: documentsView,
	})

	return (

iconText: "info_outline",
                action: this.toggleModal,
              },
              {
                iconText: "sync",
                action: this._onRefresh,
              },
            ],
          }}
          color={color.module().gpa[1]}
        />

         null}
          onIndexChange={index => this.setState({ index })}
          initialLayout={{ width: Dimensions.get("window").width }}
        />
      
    )
  }
}

const [navigation, setNavigation] = useState({
    index: 0,
    routes: [
      {
        key: 1,
      },
      {
        key: 2,
      },
      {
        key: 3,
      },
    ],
  });

  const renderScene = SceneMap({
    1: () => ,
    2: () => ,
    3: () => ,
  });

  return (
     null}
      onIndexChange={index => {
        setNavigation({ ...navigation, index: index });
      }}
      renderPager={props => (
        
      )}

const [navigationState, setNavigationState] = useState({
    index: 0,
    routes: [{key: 'first', title: 'First'}, {key: 'second', title: 'Second'}],
  });
  const setNavigationCallback = useCallback(
    index =>
      setNavigationState(state => ({
        ...state,
        index,
      })),
    [],
  );
  return (
    
  );
}