I have the following layout:
<?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/show_recipe_bg">
<LinearLayout
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:padding="5dp">
<Button
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:id="#+id/saveRecipeButtonId"
android:text="#string/save_recipe_button"
android:layout_gravity="center" />
<FrameLayout
android:id="#android:id/tabcontent"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:padding="5dp" />
<TabWidget
android:id="#android:id/tabs"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_gravity="bottom" />
</LinearLayout>
</TabHost>
I want the button to apear on the TOP for all tabs, a fixed header.
The problem in this layout that the TAB icons (TabWidget) do not apear on the screen. I guess that is because of the fill_parent for the frame layout. But I do not want to define a fixed size (because it is not good for using on other devices...)
How can I fix:
I need it to be like
Button
Tabs
TabWidget
EDIT:
I have found the problem, new XML is
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#drawable/show_recipe_bg">
<Button
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:id="#+id/saveRecipeButtonId"
android:text="#string/save_recipe_button"
android:layout_gravity="center" />
<TabHost
android:id="#android:id/tabhost"
android:layout_width="match_parent"
android:layout_height="match_parent">
<LinearLayout
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:padding="5dp">
<FrameLayout
android:id="#android:id/tabcontent"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:padding="5dp" />
<TabWidget
android:id="#android:id/tabs"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_gravity="bottom" />
</LinearLayout>
</TabHost>
</LinearLayout>
Android: Tabs at the BOTTOM
how about this.
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical" android:layout_width="match_parent"
android:layout_height="match_parent">
<Button android:text="Button" android:id="#+id/button1" android:layout_width="wrap_content" android:layout_height="wrap_content"></Button>
<TabHost android:id="#android:id/tabhost" android:layout_width="match_parent" android:layout_height="match_parent">
<LinearLayout android:layout_width="match_parent" android:id="#+id/linearLayout1" android:layout_height="match_parent" android:orientation="vertical">
<TabWidget android:layout_width="match_parent" android:layout_height="wrap_content" android:id="#android:id/tabs"></TabWidget>
<FrameLayout android:layout_width="match_parent" android:layout_height="match_parent" android:id="#android:id/tabcontent">
<LinearLayout android:layout_width="match_parent" android:layout_height="match_parent" android:id="#+id/tab1"></LinearLayout>
<LinearLayout android:layout_width="match_parent" android:layout_height="match_parent" android:id="#+id/tab2"></LinearLayout>
<LinearLayout android:layout_width="match_parent" android:layout_height="match_parent" android:id="#+id/tab3"></LinearLayout>
</FrameLayout>
</LinearLayout>
</TabHost>
There is two possible ways:
It is mentioned in #sampathpremarathna answer - just move Button up in hierarchy, to the level of TabHost
You can try to change LinearLayout to RelativeLayout and define that FrameLayout should be below button, and above tabs.
Related
I want to build a page that have a Scrollview which include a FragmentTabHost, and inside the FragmentTabHost I have 3 tabs that each tab contains fragment with listview.
example:
main_activity:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical" >
<RelativeLayout
android:id="#+id/Relative1"
android:layout_width="match_parent"
android:layout_height="wrap_content" >
<ImageButton
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
</RelativeLayout>
<ScrollView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_below="#+id/Relative1" >
<RelativeLayout
android:id="#+id/Relative2"
android:layout_width="match_parent"
android:layout_height="match_parent" >
<ImageButton
android:id="#+id/ImageButton1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true" />
<android.support.v4.app.FragmentTabHost
android:id="#android:id/tabhost"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_below="#+id/ImageButton1" >
<LinearLayout
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"
android:layout_weight="0"
android:orientation="horizontal" />
<FrameLayout
android:id="#android:id/tabcontent"
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_weight="0" />
<FrameLayout
android:id="#+id/realtabcontent"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1" />
</LinearLayout>
</android.support.v4.app.FragmentTabHost>
</RelativeLayout>
</ScrollView>
</RelativeLayout>
fragment_example:
<?xml version="1.0" encoding="utf-8"?>
<ListView xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/listview1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
>
</ListView>
I know that it's not recommended to put listview inside scrollview and the best way is to add header to the list view, but how it's possible with the FragmentTabHost?
What is the recommended way to build this page?
I have a problem with my android app. My application has two tabhost and It works well but the layout doesn't work well like the following picture:
The problem is that the FrameLayout overlaps with the lower tabhost and I dont solve it.
This is my activity_main.xml:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="#+id/LinearLayout1"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent">
<!-- TABHOST SUPERIOR -->
<RelativeLayout
android:id="#+id/l1"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="0"
android:gravity="right"
android:layout_alignParentTop="true">
<android.support.v4.app.FragmentTabHost
android:id="#+id/tabhost_sup"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<LinearLayout
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<TabWidget
android:id="#android:id/tabs"
android:orientation="horizontal"
android:layout_width="fill_parent"
android:layout_height="50dip"
android:layout_weight="0"/>
<ScrollView
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:background="#ffffff">
<FrameLayout
android:id="#android:id/tabcontent"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_weight="0"
android:background="#android:color/holo_blue_dark"/>
</ScrollView>
</LinearLayout>
</android.support.v4.app.FragmentTabHost>
</RelativeLayout>
<!-- TABHOST INFERIOR -->
<RelativeLayout
android:id="#+id/l2"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="50dip"
android:layout_weight="1"
android:gravity="right"
android:layout_alignParentBottom="true"
android:background="#android:color/background_light" >
<android.support.v4.app.FragmentTabHost
android:id="#android:id/tabhost"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<LinearLayout
android:id="#+id/RelativeLayout1"
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<FrameLayout
android:id="#android:id/tabcontent"
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_weight="0"/>
<TabWidget
android:id="#android:id/tabs"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_weight="0"
android:layout_marginBottom="0dp"/>
</LinearLayout>
</android.support.v4.app.FragmentTabHost>
</RelativeLayout>
</RelativeLayout>
I'm having a problem with the TabWidget Layout.
How can I combine the tab with the content as it always shows this fading edge:
The graphics are perfect. I set the android:tabStripEnabled="false" but still it keeps showing me the line that separates between the tabs and the frame layout.
this is the XML code
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:orientation="vertical"
android:layout_height="match_parent"
android:background="#drawable/background"
tools:context=".MainActivity" >
<include layout="#layout/action_bar" />
<TabHost
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" >
<TabWidget
android:id="#android:id/tabs"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:tabStripEnabled="false"
android:divider="#null"
android:showDividers="none" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1" >
<FrameLayout
android:id="#android:id/tabcontent"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_gravity="center"
android:layout_weight="1"
android:background="#drawable/grger"
android:fadingEdge="none" >
</FrameLayout>
</LinearLayout>
</LinearLayout>
</TabHost>
</LinearLayout>
I have created an Android Tab Activity with the following XML code:
<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"
android:layout_marginBottom="5dp"
/>
<FrameLayout
android:id="#android:id/tabcontent"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_weight="1" />
</LinearLayout>
</TabHost>
The first tab renders a WebView in its own layout file like this:
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="match_parent"
android:layout_weight="1"
android:gravity="center|top"
android:orientation="vertical"
android:layout_margin="0dp" android:padding="0dp">
<ScrollView
android:layout_width="match_parent" android:layout_height="match_parent"
android:layout_margin="0dp" android:padding="0dp">
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:layout_margin="0dp" android:padding="0dp">
<WebView android:id="#+id/webview"
android:layout_height="match_parent" android:layout_width="fill_parent" android:background="#00000000"
android:layout_margin="0dp" android:padding="0dp"
/>
<Button android:id="#+id/next" android:layout_width="fill_parent" android:layout_height="fill_parent"
android:text="#string/hotelPhotosBtn" android:layout_marginLeft="8dp" android:layout_marginRight="8dp"/>
</LinearLayout>
</ScrollView>
And the result is the activity to render something like this:
My Question is:
Why this shade appears inside the tab content ? How can i remove it ?
I have tried everything to remove it but it keeps on appearing.
I have read this and this but noone helped.
setStripEnabled(false);
Look at this Android Developer web
http://developer.android.com/reference/android/widget/TabWidget.html#setStripEnabled%28boolean%29
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