nullpointerexception in wyswig xml layout in eclipse for android and visual-artifacts

Question

I'm currently developing an application for Android which needs to use a custom made Tabs. I have encountered two problems:

I will start from my first problem:

java.lang.NullPointerException
at android.widget.TabWidget.initTabWidget(TabWidget.java:115)
at android.widget.TabWidget.<init>(TabWidget.java:86)
at android.widget.TabWidget.<init>(TabWidget.java:69)
...

I'm getting this exception when i want to switch from a text mode to wyswig mode in Eclipse. This is the actual xml code that gives me that error:

<?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">

       <FrameLayout android:id="@android:id/tabcontent"
           android:layout_width="fill_parent"
           android:layout_height="0dip"
           android:layout_weight="1"
           android:padding="20dip"
           android:background="#fff" />

       <RadioGroup android:layout_width="fill_parent"
           android:layout_height="wrap_content"
           android:orientation="horizontal"
           android:checkedButton="@+id/first"
           android:id="@+id/states">
           <RadioButton android:id="@+id/first"
               android:background="#FF00FF"
               android:width="80dip"
               android:height="70dip" />
           <RadioButton android:id="@+id/second"
               android:background="#FFFFFF"
               android:width="80dip"
               android:height="70dip" />
           <RadioButton android:id="@+id/third"
               android:background="#00FFFF"
               android:width="80dip"
               android:height="70dip" />
           <RadioButton android:id="@+id/fourth"
               android:background="#0000FF"
               android:width="80dip"
               android:height="70dip" />
       </RadioGroup>

      <TabWidget android:id="@android:id/tabs"
          android:layout_width="fill_parent"
          android:layout_height="wrap_content"
          android:layout_weight="0"
          android:visibility="gone" />  
    </LinearLayout>
</TabHost>

Now the second problem is an Graphic-Artifact:

How can i resolve my problems?

Answer 1

I have managed to fix what i though was a visual-artifact:

<FrameLayout android:id="@android:id/tabcontent"
        android:layout_width="fill_parent" android:layout_height="fill_parent"
        android:layout_weight="1" android:background="#FFFFFF" />

also it seems that whenever i use TabHost and TabWidget in my projects i'm getting that exception, also i have checked it on android tutorials: http://developer.android.com/resources/tutorials/views/hello-tabwidget.html and yes i have got it too

Answer 2

It is pretty obvious what is wrong and also the message in Eclipse tells you quite exactly what the mistake is. Your FrameLayout has no content.

What are you trying to achieve with that FrameLayout?

UPDATE: Just realized what you were trying to do. Try this 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">
    <LinearLayout
        android:orientation="vertical"
        android:layout_width="fill_parent"
        android:layout_height="fill_parent">
        <FrameLayout
            android:id="@android:id/tabcontent"
            android:layout_width="fill_parent"
            android:layout_height="0dip"
            android:layout_weight="1"
            android:padding="20dip"
            android:background="#fff">
            <RadioGroup
                android:layout_width="fill_parent"
                android:layout_height="wrap_content"
                android:orientation="horizontal"
                android:checkedButton="@+id/first"
                android:id="@+id/states">
                <RadioButton
                    android:id="@id/first"
                    android:background="#FF00FF"
                    android:width="80dip"
                    android:height="70dip"/>
                <RadioButton
                    android:id="@+id/second"
                    android:background="#FFFFFF"
                    android:width="80dip"
                    android:height="70dip"/>
                <RadioButton
                    android:id="@+id/third"
                    android:background="#00FFFF"
                    android:width="80dip"
                    android:height="70dip"/>
                <RadioButton
                    android:id="@+id/fourth"
                    android:background="#0000FF"
                    android:width="80dip"
                    android:height="70dip"/>
            </RadioGroup>
        </FrameLayout>
        <TabWidget
            android:id="@android:id/tabs"
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:layout_weight="0"
            android:visibility="gone"/>
    </LinearLayout>
</TabHost>

I've also corrected another mistake for you. Actually not necessarily a mistake but still. In the RadioGroup you are assigning the first RadioButton the ID first with android:checkedButton="@+id/first" when you're referencing it. When you actually get to the RadioButton your ID definition should not contain a + anymore. Check out the layout.