CODEWITHSUNDEEP
javaandroidandroid-tabhostandroid-button
Devrath
Devrath

Reputation: 42824

A simple TabHost in android

I have created a simple tab project in Android

MainActivity.java

public class MainActivity extends TabActivity {

    // TabSpec Names
        private static final String TAB1 = "Tab1";
        private static final String TAB2 = "Tab2";
        private static final String TAB3 = "Tab3";

        @Override
        public void onCreate(Bundle savedInstanceState) {
            super.onCreate(savedInstanceState);
            setContentView(R.layout.main);

            TabHost tabHost = getTabHost();

            // Inbox Tab
            TabSpec inboxSpec = tabHost.newTabSpec(TAB1);
            Intent inboxIntent = new Intent(this, Tab1.class);
            inboxSpec.setIndicator(TAB1);
            // Tab Content
            inboxSpec.setContent(inboxIntent);

            // Outbox Tab
            TabSpec PriceSpec = tabHost.newTabSpec(TAB2);
            Intent PriceIntent = new Intent(this, Tab2.class);
            PriceSpec .setIndicator(TAB2);
            PriceSpec.setContent(PriceIntent);

            // Profile Tab
            TabSpec DistanceSpec = tabHost.newTabSpec(TAB3);
            Intent DistanceIntent = new Intent(this, Tab3.class);
            DistanceSpec .setIndicator(TAB3); 
            DistanceSpec.setContent(DistanceIntent);

            // Adding all TabSpec to TabHost
            tabHost.addTab(inboxSpec); 
            tabHost.addTab(PriceSpec); 
            tabHost.addTab(DistanceSpec); 

            //Set the current value tab to default first tab
            tabHost.setCurrentTab(0);

            //Setting custom height for the tabs
            final int height = 45;
            tabHost.getTabWidget().getChildAt(0).getLayoutParams().height = height;
            tabHost.getTabWidget().getChildAt(1).getLayoutParams().height = height;
            tabHost.getTabWidget().getChildAt(2).getLayoutParams().height = height;
        }

}

main.xml

<?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="vertical"
        android:layout_width="fill_parent"
        android:layout_height="fill_parent">
        <TabWidget
            android:id="@android:id/tabs"
            android:layout_width="fill_parent"
            android:layout_height="wrap_content" />
        <FrameLayout
            android:id="@android:id/tabcontent"
            android:layout_width="fill_parent"
            android:layout_height="fill_parent"/>
    </LinearLayout>
</TabHost>

OUTPUT ::

enter image description here

How can i make a horizontal set of 5 buttons on top of the tab to get something like this in the below figure

enter image description here

What are the code changes i need to make in main.xml ?

Upvotes: 1

Views: 8630

Answers (3)

Gowri
Gowri

Reputation: 502

try this. Replace your main.xml code with the below code. it will work

  <?xml version="1.0" encoding="utf-8"?>
    <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
        android:layout_width="fill_parent"
        android:layout_height="fill_parent" android:orientation="vertical">
       <LinearLayout 
    android:layout_width="fill_parent"
    android:layout_height="wrap_content" android:orientation="horizontal">
    <Button android:layout_width="100dp" android:text=" Button 1"
    android:layout_height="wrap_content" />
     <Button android:layout_width="100dp" android:text=" Button 2"
    android:layout_height="wrap_content" />
      <Button android:layout_width="100dp" android:text=" Button 3"
    android:layout_height="wrap_content" />
       <Button android:layout_width="100dp" android:text=" Button 4"
    android:layout_height="wrap_content" />
        </LinearLayout>
<TabHost 
    android:id="@android:id/tabhost"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent">
    <LinearLayout
        android:orientation="vertical"
        android:layout_width="fill_parent"
        android:layout_height="fill_parent">
        <TabWidget
            android:id="@android:id/tabs"
            android:layout_width="fill_parent"
            android:layout_height="wrap_content" />
        <FrameLayout
            android:id="@android:id/tabcontent"
            android:layout_width="fill_parent"
            android:layout_height="fill_parent"/>
    </LinearLayout>
</TabHost>
</LinearLayout>

Upvotes: 1

RobinHood
RobinHood

Reputation: 10969

Add one more LinearLayout define your buttons inside above TabWidget and fixed your FrameLayout height with weight, look below code:

 <?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:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:orientation="vertical" >

        <FrameLayout
            android:id="@android:id/tabcontent"
            android:layout_width="0dp"
            android:layout_height="0dp"
            android:layout_weight="0" />

        <LinearLayout
            android:layout_width="fill_parent"
            android:layout_height="wrap_content" >

            <Button
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="1" />

            <Button
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="2" />
        </LinearLayout>

        <TabWidget
            android:id="@android:id/tabs"
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:background="@drawable/dm_footer_bg"
            android:orientation="horizontal" />

        <FrameLayout
            android:id="@+android:id/realtabcontent"
            android:layout_width="fill_parent"
            android:layout_height="0dp"
            android:layout_weight="1" />
    </LinearLayout>

</TabHost>

Upvotes: 1

Manish Srivastava
Manish Srivastava

Reputation: 1659

<?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"
    android:background="@drawable/background" >

    <LinearLayout
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:orientation="vertical" >

        <include layout="@layout/screen_topbar" />

        <FrameLayout
            android:id="@android:id/tabcontent"
            android:layout_width="fill_parent"
            android:layout_height="0dip"
            android:layout_weight="1" >

            <TabWidget
                android:id="@android:id/tabs"
                android:layout_width="fill_parent"
                android:layout_height="wrap_content"
                android:background="@color/white" >
            </TabWidget>
        </FrameLayout>
    </LinearLayout>

</TabHost>

And TopBar layout-

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/buttonlayout"
    android:layout_width="fill_parent"
    android:layout_height="53dp"
    android:gravity="top"
    android:orientation="horizontal" >

    <Button
        android:id="@+id/button1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_weight="1"
        android:text="Button" />

    <Button
        android:id="@+id/button1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_weight="1"
        android:text="Button" />

    <Button
        android:id="@+id/button1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_weight="1"
        android:text="Button" />

    <Button
        android:id="@+id/button1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_weight="1"
        android:text="Button" />

</LinearLayout>

Just try this sure it will work..

Upvotes: 4

Related Questions