How to add a button above a tabHost layout - android

So all I want to do is add a button above the tabhost layout...can anyone help me? I've tried several things such as align_bottom, switching views... nothing's worked. If I need to post the code where I'm calling the xml let me know. Here's my xml code:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/linearLayout1"
android:layout_width="fill_parent"
android:layout_height="fill_parent" >
<Button
android:id="#+id/button1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Button" />
<TabHost
android:id="#android:id/tabhost"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
>
<TabWidget
android:id="#android:id/tabs"
android:layout_width="fill_parent"
android:layout_height="fill_parent"></TabWidget>
<FrameLayout
android:id="#android:id/tabcontent"
android:background="#ffffff"
android:layout_width="match_parent"
android:layout_height="match_parent"></FrameLayout>
<TextView
android:id="#+id/view1"
android:layout_width="match_parent"
android:layout_height="439dp" ></TextView>
<TextView
android:id="#+id/view2"
android:layout_width="match_parent"
android:layout_height="344dp" ></TextView>
<TextView
android:id="#+id/view3"
android:layout_width="314dp"
android:layout_height="match_parent" ></TextView>
</TabHost>
</LinearLayout>


I had the same issue which i could solve by using below code for xml file:
<?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="wrap_content"
android:padding="5dp">
<Button
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:id="#+id/button"
android:text="Button"
/>
<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="wrap_content"
android:padding="5dp" />
</LinearLayout>
</TabHost>

Related

adding a Simple tabhost in android

I have added a set of horizontal buttons on top of the tab
but when i add these the tab is being merged along with the list as shown in the list below
As you can clearly see that tabs are merged with rows of a list
How can i prevent this ?
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: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" >
</TabWidget>
</FrameLayout>
</LinearLayout>
</TabHost>
screen_topbar.xml
<?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>

Move the TabWidget outside the tabcontent FrameLayout in the xml layout otherwise the tab content and the TabWidget itself will be in the same container and they will overlap:
<?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" >
<include layout="#layout/screen_topbar" />
<TabWidget
android:id="#android:id/tabs"
android:layout_width="fill_parent"
android:layout_height="wrap_content" >
</TabWidget>
<FrameLayout
android:id="#android:id/tabcontent"
android:layout_width="fill_parent"
android:layout_height="0dip"
android:layout_weight="1" >
</FrameLayout>
</LinearLayout>
</TabHost>

Android add button on tabhost

I want to make a layout which buttons top of the tab host. How can i do this? Gave me this error: "the markup in the document following the root element must be well-formed"

Here is my code thanks for helphing.
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical" xmlns:android="http://schemas.android.com/apk/res/android">
<TableLayout android:layout_width="fill_parent"
android:layout_height="fill_parent">
<TableRow
android:layout_width="fill_parent"
android:layout_height="fill_parent" >
<Button android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/btn"
android:text="osman"/>
</TableRow>
</TableLayout>
<TableLayout android:layout_width="fill_parent"
android:layout_height="fill_parent">
<TableRow
android:layout_width="fill_parent"
android:layout_height="fill_parent" >
<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>
</TableRow>
</TableLayout>
</LinearLayout>

I found how can i add it.
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical" xmlns:android="http://schemas.android.com/apk/res/android">
<TableLayout android:layout_width="fill_parent"
android:layout_height="wrap_content">
<TableRow
android:layout_width="fill_parent"
android:layout_height="wrap_content">
<Button android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:id="#+id/btnGarsonCagir"
android:text="GARSON ÇAĞIR"
android:layout_weight="1"/>
<Button android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:id="#+id/btnTaksiCagir"
android:text="TAKSİ ÇAĞIR"
android:layout_weight="1"/>
<Button android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:id="#+id/btnHesapIste"
android:text="HESAP İSTE"
android:layout_weight="1"/>
<Button android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:id="#+id/btnSepet"
android:text="SEPETİM"
android:layout_weight="1"/>
</TableRow>
</TableLayout>
<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>

positiong a textView on the screen

I want to place a TextView below the red zone in the following image but I just can do it.
Until now I have the following layout:
<TabHost android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:id="#+id/tabhost1"
xmlns:android="http://schemas.android.com/apk/res/android"
>
<RelativeLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent"
>
<TabWidget
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:id="#android:id/tabs"
android:layout_alignParentBottom="true"
/>
<FrameLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:id="#android:id/tabcontent"
>
</FrameLayout>
</RelativeLayout>
</TabHost>
<LinearLayout android:layout_width="fill_parent"
android:layout_below="#id/layout"
android:layout_height="wrap_content"
android:orientation="vertical">
<TextView xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/text"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:text="0 restaurant trouves"
android:gravity="center_horizontal"
android:layout_alignParentBottom="true"
android:textSize="15dip"
android:textColor="#000000"
/>
</LinearLayout>
Can someone tell what is the right code for placing the textView below the red tab?
Thank you!

Is everything you mentioned in your post in one XML file? It looks like its not well formatted and your screenshot does not make it clear too, but I am giving it a try.
It seems that your TextView is not even inside the RelativeLayout.You are closing it's tag before declaring your TextView, so you have to move it into RelativeLayout.
And I don't know if you want to show this TextView in every single Tab. But if it is like that, you could try the following scheme:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical" >
<TabHost
android:id="#android:id/tabhost"
android:layout_width="match_parent"
android:layout_height="match_parent" >
<LinearLayout
android:id="#+id/linearLayout1"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical" >
<TabWidget
android:id="#android:id/tabs"
android:layout_width="match_parent"
android:layout_height="wrap_content" >
</TabWidget>
<RelativeLayout
android:id="#+id/relativeLayout1"
android:layout_width="match_parent"
android:layout_height="match_parent" >
<TextView
android:id="#+id/textView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_centerVertical="true"
android:text="TextView" />
<TextView
android:id="#+id/textView2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#id/textView1"
android:text="TextView" />
</RelativeLayout>
<FrameLayout
android:id="#android:id/tabcontent"
android:layout_width="match_parent"
android:layout_height="match_parent" >
<LinearLayout
android:id="#+id/tab1"
android:layout_width="match_parent"
android:layout_height="match_parent" >
</LinearLayout>
<LinearLayout
android:id="#+id/tab2"
android:layout_width="match_parent"
android:layout_height="match_parent" >
</LinearLayout>
<LinearLayout
android:id="#+id/tab3"
android:layout_width="match_parent"
android:layout_height="match_parent" >
</LinearLayout>
</FrameLayout>
</LinearLayout>
</TabHost>
</LinearLayout>
There are two TextViews in this example. One is centered and the other one is drawn below of the first with: android:layout_below="#id/textView1".
Now you have to do this with your Views...

your layout code doesn't seem to have everything you have on the screenshot, so I'm not sure how your red set of tabs work but here's a mockup with a simple view:
<RelativeLayout
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"
android:layout_alignParentBottom="true" />
<TextView
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/text"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_above="#android:id/tabs"
android:layout_centerHorizontal="true"
android:background="#FFFFFF"
android:gravity="center_horizontal"
android:text="0 restaurant trouves"
android:textColor="#000000"
android:textSize="15dip" />
<View
android:layout_width="fill_parent"
android:layout_height="50dp"
android:layout_above="#+id/text"
android:background="#ff0000" />
<FrameLayout
android:id="#android:id/tabcontent"
android:layout_width="fill_parent"
android:layout_height="fill_parent" >
</FrameLayout>
</RelativeLayout>
That will give you this: (eclipse screenshot, no tabs in widget)

Text at the top of Android Tab host layout

I followed this example and got it worked.
Now I want to show a 'Welcome!!!' text just above the tabs in a Tabhost layout just like one show in figure
Here is my current layout file. But it does not show the Welcome message.
<?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:gravity="top"
android:layout_gravity="top"
android:padding="5dp">
<TextView xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/cc_welcome" android:layout_width="fill_parent"
android:layout_height="wrap_content" android:text="Welcome"
android:gravity="top" android:padding="50dp" android:textColor="#ffffff"/>
</LinearLayout>
<LinearLayout
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:gravity="bottom"
android:layout_gravity="bottom"
android:paddingTop="50dp">
<TabWidget
android:id="#android:id/tabs"
android:layout_alignParentTop="true"
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"
android:padding="5dp" />
</LinearLayout>
</TabHost>

I have edited the xml file. Have a try with this :
Updated:
<?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">
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<RelativeLayout
android:id="#+id/welcome"
android:layout_width="fill_parent"
android:layout_height="wrap_content">
<TextView xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/cc_welcome"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="Welcome"
android:layout_centerInParent="true"
android:textColor="#ffffff"/>
</RelativeLayout>
<RelativeLayout
android:layout_below="#id/welcome"
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<TabWidget
android:id="#android:id/tabs"
android:layout_alignParentTop="true"
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"
android:layout_below="#android:id/tabs"/>
</RelativeLayout>
</RelativeLayout>
</TabHost>
I have updated the code. Can you please try now.
You will get a better idea about the Linear and Relative layout here

TabHost with FrameLayout under LinearLayout

I've got a small problem with an xml file and a TabHost containing a FrameLayout that shows a ListActivity. A small LinearLayout shall be at the bottom but this is always shown in front of the ListActivity so there are items in the ListActivity behind the LinearLayout even when you scroll the ListView down. I've tried many combinations of different Layouts but I couldn't find a solution :|
Maybe you've got an idea?
Thanks!
This picture might explain my concern: http://img822.imageshack.us/i/listactivity.png/
And here is the xml 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: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>
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_gravity="bottom"
android:background="#231f20">
<TextView
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="There are items behind me..." />
<Button
android:id="#+string/connect"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:text="Connect"
android:layout_gravity="center_horizontal"
android:layout_margin="5dp"/>
</LinearLayout>

You can achieve what you want by using a RelativeLayout:
<?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">
<RelativeLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<TabWidget
android:id="#+id/tabs"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"/>
<FrameLayout
android:id="#+id/tabcontent"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_below="#id/tabs"
android:layout_above="#+id/footer" />
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/footer"
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:background="#231f20"
android:layout_alignParentBottom="true">
<TextView
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="There are items behind me..." />
<Button
android:id="#+string/connect"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:text="Connect"
android:layout_gravity="center_horizontal"
android:layout_margin="5dp"/>
</LinearLayout>
</RelativeLayout>
</TabHost>

Here's an example of a layout I use in one of my apps:
<?xml version="1.0" encoding="utf-8"?>
<TabHost xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#android:id/tabhost"
android:weightSum="100"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<LinearLayout
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
>
<!-- This layout will always remain on top -->
<LinearLayout
android:id="#+id/TopBarLayout"
android:background="#drawable/textview_bottom"
android:layout_weight="10"
android:paddingLeft="10dip"
android:paddingRight="10dip"
android:orientation="horizontal"
android:gravity="center_vertical|left"
android:layout_width="fill_parent"
android:layout_height="0dip"
android:weightSum="100"
>
<TextView
android:layout_marginRight="5dip"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Mode »"
/>
<Button
style="#style/Tab_Button"
android:id="#+id/ModeChangeButton"
/>
<TextView
android:layout_marginRight="5dip"
android:layout_marginLeft="5dip"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="»"
/>
<Button
android:paddingRight="5dip"
android:paddingLeft="5dip"
style="#style/Tab_Button"
android:id="#+id/DateChangeButton"
/>
<View
android:layout_weight="100"
android:layout_width="0dip"
android:layout_height="wrap_content"
/>
<ImageButton
style="#style/Tab_Button"
android:id="#+id/ConfigButton"
android:src="#drawable/gear"
/>
</LinearLayout>
<!-- Frame for tab content -->
<FrameLayout
android:background="#000000"
android:layout_weight="78"
android:id="#android:id/tabcontent"
android:layout_width="fill_parent"
android:layout_height="0dip"
/>
<!-- Tabs at bottom of screen -->
<TabWidget
android:background="#drawable/textview_top"
android:layout_weight="12"
android:id="#android:id/tabs"
android:layout_width="fill_parent"
android:layout_height="0dip"
/>
</LinearLayout>
</TabHost>
Here, my LinearLayout is at the top of the screen, but that's an easy fix. You'll probably want to use layout_weight as shown here.

Categories

Resources