Best Layout Design of Bottom Tab Bar in HoneyComb Tablet App

Question

I would like to design Tab Bar at bottom in HoneyComb Tablet. So, is there any specific way or bar available to design layout for bottom tabbar?.

The "best way" is to not use bottom tab bars, as that runs counter to the Android design guidelines: http://developer.android.com/design/patterns/pure-android.html — CommonsWare, Jun 27 '12 at 11:21
Ok, Is there any good demo or example available so I can look into it and see how its exactly working? — Andy, Jun 27 '12 at 11:25

score 1 · Accepted Answer · edited May 23 '17 at 11:51

1

Just use default TabHosts in Android and add the attribute

android:layout_alignParentBottom="true" for the TabWidget

see links below for more info

edited May 23 '17 at 11:51

Community

1
1

answered Jun 27 '12 at 07:39

K_Anas

31,226
9
68
81

Thanks for your response, I have seen TabWidget for device but in Tablet does it make any difference or is there any other way available to design?. – Andy Jun 27 '12 at 07:46
It will make no difference on tablet. You need to give the appropriate graphic for the Tab icons. – Mohsin Naeem Jun 27 '12 at 07:48
@Andy Like @M Mohsin Naeem said it will make no difference just use appropriate image for xhdpi resolution – K_Anas Jun 27 '12 at 07:53
@K_Anas I have tried with default TabWidget but can't see at bottom of tablet. – Andy Jun 27 '12 at 09:15

vineet · Answer 2 · 2012-06-27T10:47:27.210

To draw iphone type tab-bar

I generally Use TextView with Background Gardients in LinearLayout Horizontal.

TextView have drawable top property which can help to include icons.

I don't recommend default tab layout

public void setFooterStyle(Context c,TextView profile,TextView parking,TextView taxi,TextView history,TextView help,int flag)
{   
    if(flag==0)
    {
        profile.setBackgroundResource(R.drawable.grey_background_gradient);
        profile.setTextColor(Color.rgb(255, 255, 255));
        profile.setCompoundDrawablesWithIntrinsicBounds(0, R.drawable.profile1, 0, 0);
    }
    else if(flag==1)
    {
        parking.setBackgroundResource(R.drawable.grey_background_gradient);
        parking.setTextColor(Color.rgb(255, 255, 255));
    }
    else if(flag==2)
    {
        taxi.setBackgroundResource(R.drawable.grey_background_gradient);
        taxi.setTextColor(Color.rgb(255, 255, 255));
        taxi.setCompoundDrawablesWithIntrinsicBounds(0, R.drawable.taxi_on, 0, 0);
    }
    else if(flag==3)
    {
        history.setBackgroundResource(R.drawable.grey_background_gradient);
        history.setTextColor(Color.rgb(255, 255, 255));
        history.setCompoundDrawablesWithIntrinsicBounds(0, R.drawable.history_on, 0, 0);
    }

In your activity

Global.getInstance().setFooterStyle(getApplicationContext(),(TextView) findViewById(R.id.btnprofile),(TextView)findViewById(R.id.btnparking),(TextView)findViewById(R.id.btntaxi),(TextView) findViewById(R.id.btnhistory),(TextView) findViewById(R.id.btnhelp), 4);

You jsut need to write utility function that will handle activity state and pass this in your activity like this : — vineet, Jun 27 '12 at 10:45

Best Layout Design of Bottom Tab Bar in HoneyComb Tablet App

2 Answers2