Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Vertical tabs in Android

I want to make vertical tabs in Android like below image. enter image description here

I had see example for vertical tabs from below link.

Click here

In this link answer has some comments and in comments they had share code but the link of mega-upload is expired.

I had try many ways but not able to display tabs vertical. When I am trying according to link the tabs can not be display. Please help me

like image 324
Dharmendra Avatar asked Sep 01 '11 08:09

Dharmendra


People also ask

How do I show vertical tabs?

Click Settings and then click Appearance. In the resulting window, click the On/Off slider for Show Vertical Tabs button so it's in the On position. At this point, your tab listing will appear on the left side of the window. Along with those tabs, you'll see a new button at the top of the tab sidebar.

What is a vertical tab?

Instead of shrinking down tab names as you open more and more tabs, vertical tabs let you see the full tab name in a cleaner list. In addition to feeling more natural, as we mentioned earlier, this allows you to click and drag your tabs from top to bottom in an order you see fit.

How do I change my tab to vertical in Chrome?

- Search and filter tabs in the sidebar. - Toggle the sidebar by clicking on the extension icon. - Toggle the sidebar using the keyboard shortcut: Cmd + E (Ctrl + E on PC)(Using keyboard shortcuts are recommended once you formed the corresponding muscle memory) - The sidebar is resizable.


1 Answers

When I use tabs, I normally just hide the tabwidget tag by setting android visibility as gone.

And add buttons to act as the tab buttons like

THIS IS MODIFIED TO MAKE VERTICAL TAB BUTTONS

<?xml version="1.0" encoding="utf-8"?>
<TabHost xmlns:android="http://schemas.android.com/apk/res/android" 
    android:id="@android:id/tabhost" android:layout_width="fill_parent"
    android:layout_height="fill_parent">
    <LinearLayout android:orientation="horizontal" 
        android:layout_width="fill_parent" android:layout_height="fill_parent">
        <FrameLayout android:layout_width="0dip" 
            android:layout_height="fill_parent" android:layout_weight="0.2">
        <TabWidget android:id="@android:id/tabs" 
                android:layout_width="fill_parent" 
                android:layout_height="wrap_content"
                android:visibility="gone"/>
            <LinearLayout android:layout_width="fill_parent"  
                android:layout_height="fill_parent"
                android:orientation="vertical">
                <Button android:layout_height="0dip" 
                    android:layout_width="fill_parent" 
                    android:layout_weight="1.0"
                android:background="@drawable/ic_tab_artists"               
                    android:id="@+id/artist_id" 
                    android:onClick="tabHandler"/>
                <Button android:layout_height="0dip" 
                    android:layout_width="fill_parent" 
                    android:layout_weight="1.0"
                android:background="@drawable/ic_tab_artists"  
                    android:id="@+id/album_id" 
                    android:onClick="tabHandler"/>
                <Button android:layout_height="0dip" 
                    android:layout_width="fill_parent" 
                    android:layout_weight="1.0"
                android:background="@drawable/ic_tab_artists"   
                    android:id="@+id/song_id" 
                    android:onClick="tabHandler"/>
        </LinearLayout> 
    </FrameLayout>       
    <FrameLayout android:id="@android:id/tabcontent" 
        android:layout_width="0dip" 
        android:layout_height="fill_parent" android:layout_weight="0.8"/>
</LinearLayout>

and I add a button click handler

public void tabHandler(View target){
    artistButton.setSelected(false);
    albumButton.setSelected(false);
    songButton.setSelected(false);
    if(target.getId() == R.id.artist_id){
        tabHost.setCurrentTab(0);
        artistButton.setSelected(true);
    } else if(target.getId() == R.id.album_id){
        tabHost.setCurrentTab(1);
        albumButton.setSelected(true);
    } else if(target.getId() == R.id.song_id){
        tabHost.setCurrentTab(2);
        songButton.setSelected(true);
    }
}

When I use this method, it gives me more freedom to style the tab buttons. The above xml is for horizontal tab buttons but you easily make it vertical but editing it a bit. Just make sure you need the Tahbost,Tabwidget and a framelayout with @android:id/tabcontent as the id.

like image 175
blessanm86 Avatar answered Sep 21 '22 19:09

blessanm86