Kureev / react-native-navbar

Navbar component for React Native

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

How do I use react-native-vector-icons with this navbar?

PanicIsReal opened this issue · comments

commented

I'd like to create a settings button in the top right of the home screen, just a settings cog

I've tried this

class HomeIndexScreen extends Component {

  render() {
    const titleConfig = {
      title: "reddit"
    };

    const rightButtonConfig = {
        title: Icon.getImageSource('user', 20, 'red').then((source) => { return source } )
    }

    return (
      <ViewContainer>
        <NavigationBar
          title={titleConfig}
          style={navStyles.nav}
          rightButton={rightButtonConfig}
          />
        <Text>Hi</Text>
      </ViewContainer>
    )
  }
}

But no luck, it says on the react-native-vector-icons page I'm better off using react-native-navbar which I'm trying to but I can't seem to get it to work. Thanks!

Instead of

const rightButtonConfig = {
  title: Icon.getImageSource('user', 20, 'red').then((source) => { return source } )
}

you may consider using something like this:

const rightButtonConfig = (
  <TouchableOpacity>
    <Icon ... />
  </TouchableOpacity>
);