title: react-native-navigation Tab Bar Icon from Android Drawables and iOS xcassets
body: <p>I am using react-native-navigation as a preferred navigation approach in our react-native application. We are planning on using the hybrid approach for icons where we still add icons in xcassets and drawables. </p>
  
  <p>I am seeing a specific issue with icons for tab-bar on android when loading them from drawables. My code is below which works perfectly fine for iOS:</p>
  
  <p><strong>Tabs Definition:</strong></p>
  
  <pre><code>const Tabs = [
  {
      label: 'Home',
      screen: 'HomeScreen',
      //icon: require('../../assets/images/test.png'),
      icon: { uri: 'icon_home', scale: Dimensions.get('window').scale },
      selectedIcon: { uri: 'icon_home', scale: Dimensions.get('window').scale },
      title: 'Home'
  },
  {
      label: 'Message',
      screen: 'MessageScreen',
      icon: { uri: 'icon_home', scale: Dimensions.get('window').scale },
      selectedIcon: { uri: 'icon_home_selected', scale: Dimensions.get('window').scale },
      title: 'Message'
  }]
  </code></pre>
  
  <p><strong>Navigation Code:</strong></p>
  
  <pre><code>_navigateToHomeScreen = () =&gt; {
  Navigation.startTabBasedApp({
    tabs: Tabs,
    tabsStyle: tabsStyle,
    appStyle: tabsStyle
   });
  }
  </code></pre>
  
  <p><strong>Tab Styles:</strong></p>
  
  <pre><code>tabStyle = {
    tabBarBackgroundColor: Colors.DefaultWhiteColor,
    tabBarButtonColor: Colors.NavigationBarItemColor,
    tabBarLabelColor: Colors.NavigationBarItemColor,
    tabBarSelectedButtonColor: Colors.PrimaryButtonBackground,
    tabBarSelectedLabelColor: Colors.PrimaryButtonBackground,
    forceTitlesDisplay: true
  }
  </code></pre>
  
  <p><strong>What we have tried:</strong></p>
  
  <ul>
  <li>I tried using the same image in a list view and it shows up correctly so I don't think that react-native is not able to find the image from drawable.</li>
  <li>I tried specifying the height/width (without scale) for the image and it still does not work.</li>
  <li>If I use require('') to load an image which is in JS then it works correctly but we want to use drawables.</li>
  <li>I tried removing <strong>scale</strong> and it still doesn't work. </li>
  <li>For iOS, loading image from xcassets and using it in tab bar works without any issues. </li>
  </ul>
  
  <p><strong>Version Information:</strong></p>
  
  <p>react-native: 0.52.0
  react-native-navigation: 1.1.314
  Android-Version: Emulator: Android 5.1, Android 6.0</p>
  
  <p>We are running out of options. The final solution would be to use local images and not images from native.</p>
  
  <p>Any help is appreciated.</p>
  
  <p><strong>Note:This question is not for react-navigation. It is for react-native-navigation library by wix available at <a href="https://wix.github.io/react-native-navigation/#/" rel="nofollow noreferrer">https://wix.github.io/react-native-navigation/#/</a>.</strong></p>