1. Advisor
  2. react-native-vector-icons
  3. functions
  4. react-native-vector-icons/Ionicons.TabBarItem
View all react-native-vector-icons analysis

How to use the react-native-vector-icons/Ionicons.TabBarItem function in react-native-vector-icons

To help you get started, we’ve selected a few react-native-vector-icons examples, based on popular ways it is used in public projects.

Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.

github surmon-china / surmon.me.native / src / pages / home.js View on Github external
const InitPage = ({navigator}) => {
  let itemId = 0;
  const androidIconSize = 18;
  const iOSiconSize = 30;

  return (
    <menu title="Home">,
          androidIcon: ,
          itemComponent: Ionicon.TabBarItem,
          iconName: 'ios-paper-outline',
          selectedIconName: 'ios-paper',
          iconSize: iOSiconSize,
          androidBackground: (TouchableNativeFeedback.Ripple) ? TouchableNativeFeedback.Ripple('grey', false) : null,
          badge: 8,
          badgeColor: 'black'
        },
        {
          id: itemId++,
          title: 'News',
          element: ,
          androidIcon: ,
          itemComponent: Ionicon.TabBarItem,
          iconName: 'ios-time-outline',
          selectedIconName: 'ios-time',
          iconSize: iOSiconSize,</menu>
github surmon-china / surmon.me.native / src / pages / home.js View on Github external
id: itemId++,
          title: 'News',
          element: ,
          androidIcon: ,
          itemComponent: Ionicon.TabBarItem,
          iconName: 'ios-time-outline',
          selectedIconName: 'ios-time',
          iconSize: iOSiconSize,
          androidBackground: (TouchableNativeFeedback.Ripple) ? TouchableNativeFeedback.Ripple('grey', false) : null
        },
        {
          id: itemId++,
          title: 'Favorite',
          element: ,
          androidIcon: ,
          itemComponent: Ionicon.TabBarItem,
          iconName: 'ios-heart-outline',
          selectedIconName: 'ios-heart',
          iconSize: iOSiconSize,
          androidBackground: (TouchableNativeFeedback.Ripple) ? TouchableNativeFeedback.Ripple('grey', false) : null
        },
        {
          id: itemId++,
          title: 'Popular',
          element: ,
          androidIcon: ,
          itemComponent: Ionicon.TabBarItem,
          iconName: 'ios-star-outline',
          selectedIconName: 'ios-star',
          iconSize: iOSiconSize,
          androidBackground: (TouchableNativeFeedback.Ripple) ? TouchableNativeFeedback.Ripple('grey', false) : null
        }
github surmon-china / surmon.me.native / src / layouts / layout.js View on Github external
id: itemId++,
            title: 'Home',
            element: ,
            androidIcon: ,
            itemComponent: Ionicon.TabBarItem,
            iconName: 'ios-home-outline',
            selectedIconName: 'ios-home',
            iconSize: iOSiconSize,
            androidBackground: (TouchableNativeFeedback.Ripple) ? TouchableNativeFeedback.Ripple('grey', false) : null,
          },
          {
            id: itemId++,
            title: 'Projects',
            element: ,
            androidIcon: ,
            itemComponent: Ionicon.TabBarItem,
            iconName: 'logo-github',
            selectedIconName: 'logo-github',
            iconSize: iOSiconSize,
            androidBackground: (TouchableNativeFeedback.Ripple) ? TouchableNativeFeedback.Ripple('grey', false) : null
          },
          {
            id: itemId++,
            title: 'About Me',
            element: ,
            androidIcon: ,
            itemComponent: Ionicon.TabBarItem,
            iconName: 'ios-person-outline',
            selectedIconName: 'ios-person',
            iconSize: iOSiconSize,
            androidBackground: (TouchableNativeFeedback.Ripple) ? TouchableNativeFeedback.Ripple('grey', false) : null
          }
github surmon-china / surmon.me.native / src / layouts / layout.js View on Github external
const iOSiconSize = 30;
    const navigator = this.props.navigator;
    const userInfo = this.state.userInfo

    return (
      <menu title="SURMON.ME">,
            androidIcon: ,
            itemComponent: Ionicon.TabBarItem,
            iconName: 'ios-home-outline',
            selectedIconName: 'ios-home',
            iconSize: iOSiconSize,
            androidBackground: (TouchableNativeFeedback.Ripple) ? TouchableNativeFeedback.Ripple('grey', false) : null,
          },
          {
            id: itemId++,
            title: 'Projects',
            element: ,
            androidIcon: ,
            itemComponent: Ionicon.TabBarItem,
            iconName: 'logo-github',
            selectedIconName: 'logo-github',
            iconSize: iOSiconSize,
            androidBackground: (TouchableNativeFeedback.Ripple) ? TouchableNativeFeedback.Ripple('grey', false) : null
          },</menu>
github surmon-china / surmon.me.native / src / pages / home.js View on Github external
title: 'Home',
          element: ,
          androidIcon: ,
          itemComponent: Ionicon.TabBarItem,
          iconName: 'ios-home-outline',
          selectedIconName: 'ios-home',
          iconSize: iOSiconSize,
          androidBackground: (TouchableNativeFeedback.Ripple) ? TouchableNativeFeedback.Ripple('grey', false) : null,
          badgeColor: 'black'
        },
        {
          id: itemId++,
          title: 'Archive',
          element: ,
          androidIcon: ,
          itemComponent: Ionicon.TabBarItem,
          iconName: 'ios-archive-outline',
          selectedIconName: 'ios-archive',
          iconSize: iOSiconSize,
          androidBackground: (TouchableNativeFeedback.Ripple) ? TouchableNativeFeedback.Ripple('grey', false) : null
        },
        {
          id: itemId++,
          title: 'Projects',
          element: ,
          androidIcon: ,
          itemComponent: Ionicon.TabBarItem,
          iconName: 'ios-chatboxes-outline',
          selectedIconName: 'ios-chatboxes',
          iconSize: iOSiconSize,
          androidBackground: (TouchableNativeFeedback.Ripple) ? TouchableNativeFeedback.Ripple('grey', false) : null
        },
github surmon-china / surmon.me.native / src / pages / home.js View on Github external
const InitPage = ({navigator}) =&gt; {
  let itemId = 0;
  const androidIconSize = 18;
  const iOSiconSize = 30;

  return (
    <menu title="SURMON.ME">,
          androidIcon: ,
          itemComponent: Ionicon.TabBarItem,
          iconName: 'ios-home-outline',
          selectedIconName: 'ios-home',
          iconSize: iOSiconSize,
          androidBackground: (TouchableNativeFeedback.Ripple) ? TouchableNativeFeedback.Ripple('grey', false) : null,
          badgeColor: 'black'
        },
        {
          id: itemId++,
          title: 'Archive',
          element: ,
          androidIcon: ,
          itemComponent: Ionicon.TabBarItem,
          iconName: 'ios-archive-outline',
          selectedIconName: 'ios-archive',
          iconSize: iOSiconSize,
          androidBackground: (TouchableNativeFeedback.Ripple) ? TouchableNativeFeedback.Ripple('grey', false) : null</menu>

react-native-vector-icons

Customizable Icons for React Native with support for NavBar/TabBar, image source and full styling.

GitHub
MIT
Latest version published 4 months ago

Package Health Score

83 / 100
Full package analysis

Popular react-native-vector-icons functions

Similar packages