I have a test app using TabHost on an Android 4.x. It works ok, except that the TABS are hidden behind the title stuff (that should autohide).
If I enable autohide it's not good either, because even if I see that the title is hiding and the TABS are directly accessible... if I try to click on a TAB, then the titlebar comes down overlapping the TABS and preventing me from clicking on my TAB.
What should I do?
Here is my layout
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#0099cc"
tools:context="ro.whatever.myapp.testtabhost.app.main">
<TabHost
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:id="#android:id/tabhost"
android:layout_gravity="center_horizontal|top">
<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"></TabWidget>
<FrameLayout
android:id="#android:id/tabcontent"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<LinearLayout
android:id="#+id/tab1"
android:layout_width="fill_parent"
android:layout_height="fill_parent"/>
<LinearLayout
android:id="#+id/tab2"
android:layout_width="fill_parent"
android:layout_height="fill_parent" />
<LinearLayout
android:id="#+id/tab3"
android:layout_width="fill_parent"
android:layout_height="fill_parent" />
</FrameLayout>
</LinearLayout>
</TabHost>
</FrameLayout>
So after I create the activity for this layout... I cannot click on the TABS that I can see on top of the screen because the titl-bar drops down and takes the click on itself ...
This is annoying.
How to solve this?
I solved it by doing this in onCreate of the Activity:
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
this.requestWindowFeature(Window.FEATURE_NO_TITLE); // this thing hides the title bar so I can access the TabHost
setContentView(R.layout.activity_main);
For whom it may concern ;)
Related
I want to be able to scroll within each screen in my android application. when you scroll I want the tab bar to scroll as well. My code works..However when you go to the screen with the tab bar, the tab bar is not visible..to see the tab bar you have to scroll up. Is there any way for the tab bar to be visible by default? thanks
My tab_host.xml code
<?xml version="1.0" encoding="utf-8"?>
<TabHost xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:id="#android:id/tabhost">
<ScrollView
android:layout_height="fill_parent"
android:layout_width="fill_parent" >
<LinearLayout
android:id="#+id/LinearLayout01"
android:orientation="vertical"
android:layout_height="fill_parent"
android:layout_width="fill_parent">
<TabWidget
android:id="#android:id/tabs"
android:layout_height="wrap_content"
android:layout_width="fill_parent">
</TabWidget>
<FrameLayout
android:id="#android:id/tabcontent"
android:layout_height="fill_parent"
android:layout_width="fill_parent">
</FrameLayout>
</LinearLayout>
A ViewPager is what you need and along with a sliding tab class.
<android.support.v4.view.ViewPager
android:id="#+id/mPager"
android:layout_width="match_parent"
android:layout_height="0px"
android:layout_weight="1"
android:background="#color/white"/>
I have a problem placing a TabHost, as you can see in the image, the TabHost is not well placed in the screen (bottom area is below limits). I want the tabs in the middle of the screen, not on the top, the top part is occupied by a chart, this part is deliberate (Why is occupying more space in the bottom?)
The xml code is like this:
<TabHost
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="#android:id/tabhost"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#drawable/background">
<LinearLayout
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:weightSum="2.0"
android:padding="5dp">
CHART IS HERE OCCUPYING A PART OF THE SCREEN
<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"
android:padding="5dp" />
</LinearLayout>
</TabHost>
After all, the problem is that although the tab content is shown, due to the hide TabHost part, the scroll doesn't allows you to see the entire content.
Solution by OP.
This code seems to works fine when added as a view inside a LinearLayout
<TabHost
android:id="#android:id/tabhost"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:background="#drawable/background">
<LinearLayout
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_weight="1.0"
android:padding="5dp">
<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"
android:padding="5dp" />
</LinearLayout>
</TabHost>
I am using FragmentTabHost for one of my project.
I have more than 5 tabs in my app.
If i used one or two tabs means the TabHost looking good.
If i add more than 5 tabs, The tabhost is shrinking and the tab text showing in a second link also.
I want to add Horizontal scroll only for my tabhost.
However we can add swipe able tab. but i don't want this. i want to swipe only the tabhost. not the tab content.
Thanks in advance.
Use this layout. It includes horizontal scroll view for tab host only.
Note: just add the horizontal scrollview to your tab host bar.
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:ads="http://schemas.android.com/apk/lib/com.google.ads"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="#+id/mainlayout"
tools:context=".WebView" >
<TabHost
android:id="#android:id/tabhost"
android:layout_width="fill_parent"
android:layout_gravity="center"
android:layout_height="fill_parent">
<LinearLayout
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_gravity="center"
android:layout_height="fill_parent">
<HorizontalScrollView
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:fillViewport="true"
android:scrollbars="none" >
<TabWidget
android:id="#android:id/tabs"
android:layout_width="fill_parent"
android:gravity="center"
android:background="#C0C0C0"
android:layout_height="#dimen/tab_sizes" />
</HorizontalScrollView>
<FrameLayout
android:id="#android:id/tabcontent"
android:layout_width="fill_parent"
android:layout_gravity="center"
android:layout_height="fill_parent"/>
</LinearLayout>
</TabHost>
</RelativeLayout>
I am experimenting with a TabHost widget. I did not realise that the TabActivity has been deprecated. I am having trouble actually displaying my TabHost on the screen when I run my activity. At present My XML file contains the following:
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".MainActivity" >
<TabHost
android:id="#android:id/tabhost"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_alignParentLeft="true"
android:layout_alignParentTop="true" >
<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" >
</TabWidget>
<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>
And my MainActivity.java contains:
public class MainActivity extends Activity {
TabHost myTabBar;
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
}
How can I get the TabHost to appear on the screen? Every time I google TabHost all of the tutorials involve extending TabActivity!
Thanks.
EDIT: Am I on the right track when doing something like this?
myTabBar = (TabHost)findViewById(android.R.id.tabhost);
myTabBar.setup();
Activities in tabs was deprecated and Google agrees that it's a bad idea to do this, you have to consider using views as the contents of your Tabs, here an exemple from CommonsWare book you can find helpful resources.
I've been working on a small project that consists of a GUI with a number of tabs. I'm quite new with the concept of fragments however it seems that they're a best practice within the android tab landscape. I managed to code a simple tab app, that switches between 3 tabs.
The only issue I have is when I try placing the tabs at the bottom of the screen. When they're at the bottom, the tab widget covers the container(framelayout in this case) and so nothing happens, the screen remains the same when clicking the various tabs.
The following XML layout represents the good version( where the tabs are at the top of the screen):
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
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:orientation="horizontal"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_weight="0"
/>
<FrameLayout
android:id="#android:id/tabcontent"
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_weight="0"/>
<FrameLayout
android:id="#+android:id/realtabcontent"
android:layout_width="fill_parent"
android:layout_height="0dp"
android:layout_weight="1"/>
</LinearLayout>
</TabHost>
</LinearLayout>
The following XML layout represents the version that isn't working, when the tabs are at the bottom of the screen:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
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"
>
<RelativeLayout
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
>
<TabWidget
android:id="#android:id/tabs"
android:orientation="horizontal"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
/>
<FrameLayout
android:id="#android:id/tabcontent"
android:layout_width="0dp"
android:layout_height="0dp"
/>
<FrameLayout
android:id="#+android:id/realtabcontent"
android:layout_width="fill_parent"
android:layout_height="0dp"
/>
</RelativeLayout>
</TabHost>
</LinearLayout>
I changed the layour to relativelayout and added this command: android:layout_alignParentBottom="true" to the tabwidget. Does anyone have an alternative idea of how I can sort this issue? Thanks in advance.
In general using tabs at the bottom of the screen is a bad solution (see Android design guidelines).
For your solution: put TabWidget at the end of list of view. Because of drawing is a line process and fragments this your case are drowed upper TabWidget
You can use weight instead. Try this layout marking
<android.support.v4.app.FragmentTabHost xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#android:id/tabhost"
android:layout_width="match_parent"
android:layout_height="match_parent" >
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical" >
<FrameLayout
android:id="#android:id/tabcontent"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1" />
<TabWidget
android:id="#android:id/tabs"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
</LinearLayout>
</android.support.v4.app.FragmentTabHost>
You can replace FragmentTabHost with own TabHost class. So, your tabs will be at the bottom of the screen.
Be careful with nested weights (they are bad for performance) and deeping in view hierarchy (especially for android < 4).