Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to create vertical BottomNavigationView android?

I have an activity that have 4 fragment on top and BottomNavigationView with 4 items on bottom. It is working fine in mobile devices. When i go for tablet with LANDASCAPE i want to move that BottomNavigationView to left of the activity with vertical orientation like below.

Is this achievable using BottomNavigationView or should I go for NavigationMenu android.

enter image description here

like image 436
Anbarasu Chinna Avatar asked Mar 12 '18 11:03

Anbarasu Chinna


People also ask

What is bottom navigation view in Android?

Bottom navigation bars make it easy for users to explore and switch between top-level views in a single tap. They should be used when an application has three to five top-level destinations.

How do I use the bottom navigation view?

BottomNavigationView makes it easy for users to explore and switch between top-level views with a single tap. There should be a minimum of 3 top-level views and a maximum of 5. If Destinations are more than 5 then use the Navigation Drawer. When the user taps on the icon it will change the top-level view accordingly.

How do I create a bottom navigation?

To create a Menu, first, create a Menu Directory by clicking on the app -> res(right-click) -> New -> Android Resource Directory and select Menu in the Resource Type. To create a Menu Resource File , click on the app -> res -> menu(right-click) -> New -> Menu Resource File and name it bottom_nav_menu.


2 Answers

Well i managed to do it, what you want with BottomNavigationView, by some tweaking in orientation change and moving some views. Firstly for tap into orientation change i added this to Activity tag in AndroidManifest

android:configChanges="orientation|screenSize"

and in my Activity i added following

 @Override
    public void onConfigurationChanged(Configuration newConfig) {
        super.onConfigurationChanged(newConfig);
        if (newConfig.orientation == Configuration.ORIENTATION_LANDSCAPE) {
            Toast.makeText(this, "landscape", Toast.LENGTH_SHORT).show();
            BottomNavigationView navigation= (BottomNavigationView) findViewById(R.id.navigation);
            navigation.setRotation(90f);
            navigation.getLayoutParams().width=480;
            navigation.requestLayout();
            navigation.setY(600f);
            navigation.setX(-435f);
           // navigation.requestLayout();
            BottomNavigationMenuView menuView = (BottomNavigationMenuView) navigation.getChildAt(0);
            for (int i = 0; i < menuView.getChildCount(); i++) {
                final View iconView = menuView.getChildAt(i);
                iconView.setRotation(-90f);
            }
        } else if (newConfig.orientation == Configuration.ORIENTATION_PORTRAIT){
            recreate();
        }
    }

and my XML is

<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/container"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".MainActivity">

    <TextView
        android:id="@+id/message"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginStart="8dp"
        android:layout_marginLeft="8dp"
        android:layout_marginTop="8dp"
        android:layout_marginEnd="8dp"
        android:layout_marginRight="8dp"
        android:layout_marginBottom="8dp"
        android:text="@string/title_home"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent" />

    <android.support.design.widget.BottomNavigationView
        android:id="@+id/navigation"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_marginStart="0dp"
        android:layout_marginEnd="0dp"
        android:background="?android:attr/windowBackground"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toRightOf="parent"
        app:menu="@menu/navigation" />

</android.support.constraint.ConstraintLayout>

Definitely, you have to change navigation.getLayoutParams().width, setX and setY according to your phone needs. You can create a function to calculate the position. Sorry its 10:30 in the day and was coding all night so going for rest, so couldn't write that function. But i would write that function if you want. Its what i got working for my phone Vivo Y51L, you can have look at screenshots.

Screenshots Landscape Portrait

like image 131
Vanshaj Daga Avatar answered Oct 23 '22 00:10

Vanshaj Daga


Since you can't customize BottomNavigation to be used in a vertical how it's wanted from you.. I would recommend (if you still haven't managed to fix it) switching to this library : SideMenu-Android Or you can create a customized Navigation Drawer.

like image 21
Elio Lako Avatar answered Oct 23 '22 02:10

Elio Lako