How to implement a vertical tab layout in android?

Question

I am trying to implement a vertical tab layout on my application that is being ran on a tablet. I have tried to set the orientation of the TabLayout to vertical but no luck.

<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    xmlns:app="http://schemas.android.com/apk/res-auto">



    <com.google.android.material.tabs.TabLayout
        android:id="@+id/staff_menu_tabs"
        android:layout_height="match_parent"
        android:layout_width="wrap_content"
        android:orientation="vertical"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintTop_toTopOf="parent">

        <com.google.android.material.tabs.TabItem
            android:layout_height="wrap_content"
            android:layout_width="wrap_content"
            android:text="Tab 1"/>
        <com.google.android.material.tabs.TabItem
            android:layout_height="wrap_content"
            android:layout_width="wrap_content"
            android:text="Tab 2"/>
        <com.google.android.material.tabs.TabItem
            android:layout_height="wrap_content"
            android:layout_width="wrap_content"
            android:text="Tab 3"
           />

    </com.google.android.material.tabs.TabLayout>


</androidx.constraintlayout.widget.ConstraintLayout>

Unfortunately, it looks like TabLayout will not work for this, see here: https://stackoverflow.com/questions/41422626/vertical-android-tablayout-not-scroll-vertically — Daniel Nugent, Oct 11 '19 at 18:07

hemdroid · Answer 1 · 2022-12-23T09:57:23.220

I made vertical tabLayout using following code.

<androidx.constraintlayout.widget.ConstraintLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:rotation="-90"
    android:transformPivotX="0dp"
    android:layout_marginTop="@dimen/tab_width"
    android:layout_marginLeft="-24dp">
    <com.google.android.material.tabs.TabLayout
        android:layout_width="@dimen/tab_width"
        android:layout_height="wrap_content"
        android:background="@color/black"
        app:tabTextColor="@color/light_grey"
        app:tabSelectedTextColor="@color/white"
        app:tabIndicatorHeight="2dp"
        app:tabIndicatorColor="@color/white"
        app:tabPaddingBottom="-10dp">
        <com.google.android.material.tabs.TabItem
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="ABC"/>
        <com.google.android.material.tabs.TabItem
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="XYZ"/>
    </com.google.android.material.tabs.TabLayout>
</androidx.constraintlayout.widget.ConstraintLayout>

How to implement a vertical tab layout in android?

1 Answers1