question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

how to hide the icon from the tab bar of selected scenes

See original GitHub issue

Version

Tell us which versions you are using:

  • react-native-router-flux v4.0.0 (v3 is not supported)
  • react-native v0.53.3
<Router navBar = {navBar}>
          <Scene key="root">
            <Scene key="LoginScreen" initial component={LoginScreen} hideNavBar />
            <Tabs key="tabs" tabBarStyle={styles.tabBarStyling}  hideNavBar tabBarPosition='bottom'  showLabel={false} swipeEnabled={false} lazy={true} backBehavior={'initialRoute'}>
              <Scene key="BiographyScreen"  hideNavBar title="Biography" icon={TabIcon}  component={BiographyScreen}/>
              <Scene key="EventLocation" hideNavBar title="EventLocation" icon={TabIcon} component={EventLocation}/>
              <Scene key="EventStream"  hideNavBar title="EventStream" icon={TabIcon} component={EventStream} />
              <Scene key="Settings" hideNavBar title="Settings" icon={TabIcon} component={Settings} />
              <Scene key="MenuList"  hideNavBar component={MenuList}/>
              <Scene key="TableList" hideNavBar component={TableList} />
            </Tabs>
          </Scene>
        </Router>

Expected behaviour

I want to hide icons of MenuList and TableList from tab bar, but want to show tab bar while user is on that scene.

Actual behaviour

It is not showing the icon but it is showing the empty space.

Issue Analytics

  • State:closed
  • Created 5 years ago
  • Reactions:3
  • Comments:7 (1 by maintainers)

github_iconTop GitHub Comments

3reactions
aksonovcommented, Aug 8, 2018

Closing because of correct solution, thanks @Koshukey

0reactions
eyexxcommented, Jul 19, 2018
<Scene>
               <Tabs key="main" style={{ backgroundColor: '#003366' }}
               >
                   <Scene
                       title = "Write"
                       key="writemessages"
                       component={WriteMessages}
                   />
                   <Scene                     
                       rightTitle="Yours"
                       title="Ranking"
                       key="showmessages"
                       component={ShowMessages}                 
                   />

                   <Scene
                       title="MyPage"
                       key="mypage"
                       component={MyPage}
                       direction='vertical'                     
                   />

               </Tabs>
               </Scene>
               <Scene key="sub">
               <Scene
                   title = "Yours"
                   key="showyourmessages"
                   component={ShowYourMessages}
               />
                <Scene
                    title = "Details"
                    key="showdetails"
                    component={ShowDetails}            
                />
               <Scene
                   title = "MyMap"
                   key="showmymap"
                   component={MypageMap}
                  
               />
           </Scene>

I did like this. i made another scene which does not have tag element and I put what i do not wanna show tabs there.

Read more comments on GitHub >

github_iconTop Results From Across the Web

Remove Icons from TabBar | Apple Developer Forums
I want to remove Icons from TabBar & want to keep just Text. Make text center allgn Vertically in TabBar. I currently naming...
Read more >
sap ui5 icon tab bar - SAP Community
Hi Experts, I have Icon Table Bar and during the selection of Icon twice the table content is getting hidden and even when...
Read more >
Change tab bar item selected color in a storyboard
Add Runtime Color attribute named "tintColor" from StoryBoard. This is working(for Xcode 8 and above). if you want unselected color.. you can add ......
Read more >
Customize the Quick Access Toolbar - Microsoft Support
You can set the location commands in Options. Select File > Options > Quick Access Toolbar>Toolbar Position. Show or Hide command labels on...
Read more >
Customizing Your Workspace - SketchUp Help
Hide or show the toolbar. If you want more drawing area or just don't use the toolbar, select View > Hide Toolbar, and...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found