WebView not properly filling screen when using tabhost

Question

I have a TabHost with a TabWidget. But my WebView(in each tab i have one webview) is above the TabWidget. So i can't see my TabWidget. How do I fix this?

Layout File

    <TabHost
        android:id="@+id/tabHost"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_x="0sp"
        android:layout_y="0sp" >

        <RelativeLayout
            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="60sp" >
            </TabWidget>

            <FrameLayout
                android:id="@android:id/tabcontent"
                android:layout_width="match_parent"
                android:layout_height="match_parent" >

                  <WebView
                      android:id="@+id/webView2"
                      android:layout_width="match_parent"
                      android:layout_height="match_parent"
                      android:layout_gravity="bottom"/>

                  <WebView
                      android:id="@+id/webView3"
                      android:layout_width="match_parent"
                      android:layout_height="match_parent" 
                      android:layout_gravity="bottom" />

                  <WebView
                      android:id="@+id/webView1"
                      android:layout_width="match_parent"
                      android:layout_height="match_parent"
                      android:layout_gravity="bottom"/>

             </FrameLayout>
        </RelativeLayout>
    </TabHost>
</AbsoluteLayout>

Java public class MainActivity extends Activity {

 /** Called when the activity is first created. */
TabHost tabHost;
@Override
public void onCreate(Bundle savedInstanceState){
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        tabHost=(TabHost)findViewById(R.id.tabHost);
        tabHost.setup();

        TabSpec spec1=tabHost.newTabSpec("Vandaag");
        spec1.setContent(R.id.webView1);
        spec1.setIndicator("Vandaag");


        TabSpec spec2=tabHost.newTabSpec("Morgen");
        spec2.setIndicator("Morgen");
        spec2.setContent(R.id.webView2);


        TabSpec spec3=tabHost.newTabSpec("Overmorgen");
        spec3.setContent(R.id.webView3);
        spec3.setIndicator("Overmorgen");
        tabHost.addTab(spec1);
        tabHost.addTab(spec2);
        tabHost.addTab(spec3);
        tabHost.getCurrentView().setVisibility(View.VISIBLE);
        tabHost.setup();

        WebView myWebView1 = (WebView) findViewById(R.id.webView1);
        myWebView1.setWebViewClient(new WebViewClient());
        myWebView1.loadUrl("http://www.example.com");

        WebView myWebView2 = (WebView) findViewById(R.id.webView2);
        myWebView2.setWebViewClient(new WebViewClient());
        myWebView2.loadUrl("http://www.example.com");

        WebView myWebView3 = (WebView) findViewById(R.id.webView3);
        myWebView3.setWebViewClient(new WebViewClient());
        myWebView3.loadUrl("http://www.example.com");

}

Answer 1

Either replace your RelativeLayout with a vertical LinearLayout, or use your RelativeLayout properly, putting rules on the children to have them be sized/positioned how you want.

Also, I really do not recommend hard-coded heights, as you have on your WebViews.