Skip to content

mesandigital/react-native-tabbed-view

Repository files navigation

React Native Starter UI Kit (Tabbed Application)

React Native Tabbed View For iOS and Android Apps

Tabbed applications are used to support user interfaces where multiple screens can be accessed in no particular order.

Dependencies Used

  1. React Native Router
  2. React Native Vector Icons

Installation

npm install
react-native link

Setting the tabs for each section

  let iconColor = (Platform.OS === "ios") ? "#9A9A9A" : "rgba(255,255,255,.8)";
  let iconSelectedColor = (Platform.OS === "ios") ? "#2D303C" : "#fff";

  let FirstIcon = {type: Icons.Entypo, name: "home", title: "Home", size: 20, color: iconColor, selected: iconSelectedColor};

  .....

  <Scene key="tab1" initial title="First" icon={TabIcon} iconInfo={FirstIcon}>
        <Scene key="first_view" component={First} title={FirstIcon.title}/>
  </Scene>

Demo

iOS
Android

Screenshots

iOS

Android