react native combine drawer and tab bottom navigation

// This using the @react-navigation/material-top-tabs from the // stackoverflow source... export default class Login extends Component { static navigationOptions = { header: null } } // Didn't work for me but it did give me a clue. I ended up // setting the header to return a basically a blank setTimeout(() => { navigation.setOptions({ header: () => ( <View style={{ backgroundColor: "white" }}> <Text style={[ { color: "white" }, Platform.OS === "android" ? { fontSize: 20 } : { fontSize: 1 } ]} > . </Text> </View> ) }); }, 1); // Note: in iOS sumulation, I had to tweak the initial fontSize // to get it to not show on reload... Hence the addition of the // setTimeout. Yes there is a blink, but now at least I don't // have to do the tweak to start with. Not sure if this really // works on an iOS device. Don't have a real one to test on.

Copyimport { createBottomTabNavigator } from '@react-navigation/bottom-tabs'; const Tab = createBottomTabNavigator(); function MyTabs() { return ( <Tab.Navigator> <Tab.Screen name="Home" component={HomeScreen} /> <Tab.Screen name="Settings" component={SettingsScreen} /> </Tab.Navigator> );}

android hide and show bottom navigation

public class BottomNavigationViewBehavior extends CoordinatorLayout.Behavior<BottomNavigationView> {

private int height;

@Override
public boolean onLayoutChild(CoordinatorLayout parent, BottomNavigationView child, int layoutDirection) {
    height = child.getHeight();
    return super.onLayoutChild(parent, child, layoutDirection);
}

@Override
public boolean onStartNestedScroll(@NonNull CoordinatorLayout coordinatorLayout,
                               BottomNavigationView child, @NonNull 
                               View directTargetChild, @NonNull View target,
                               int axes, int type)
{
    return axes == ViewCompat.SCROLL_AXIS_VERTICAL;
}

@Override
public void onNestedScroll(@NonNull CoordinatorLayout coordinatorLayout, @NonNull BottomNavigationView child,
           @NonNull View target, int dxConsumed, int dyConsumed,
           int dxUnconsumed, int dyUnconsumed, 
            @ViewCompat.NestedScrollType int type)
{
   if (dyConsumed > 0) {
       slideDown(child);
   } else if (dyConsumed < 0) {
       slideUp(child);
   }
}

private void slideUp(BottomNavigationView child) {
    child.clearAnimation();
    child.animate().translationY(0).setDuration(200);
}

private void slideDown(BottomNavigationView child) {
    child.clearAnimation();
    child.animate().translationY(height).setDuration(200);
}

Posted by: Guest on May-10-2020

Source

Code answers related to "react native combine drawer and tab bottom navigation"

Code answers related to "Java"

Browse Popular Code Answers by Language

Answers for "react native combine drawer and tab bottom navigation"

Code answers related to "react native combine drawer and tab bottom navigation"

Code answers related to "Java"

Java Answers by Framework

Browse Popular Code Answers by Language

Popular Programming Languages

Advertisements

Company

Compilers

Help

Connect with us