I been following the Tab example provided by Google. I am trying to use the XML layout provided to setup a tab layout.
I use this XML layout # http://developer.android.com/guide/tutorials/views/hello-tabwidget.html
<?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">
<TextView
android:id="#+id/textview1"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:text="this is a tab" />
<TextView
android:id="#+id/textview2"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:text="this is another tab" />
<TextView
android:id="#+id/textview3"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:text="this is a third tab" />
</FrameLayout>
</LinearLayout>
</TabHost>
When ever I switch the Layout tab in the Eclipse layout designer I get a NullPointerException: null error inside my Eclipse.
This happens also when I try to drag and drop a TabHost, and then a TabWidget into an empty layout file.
What am I doing wrong ? this seems pretty simple.
Found it has been recorded as an issue already
http://code.google.com/p/android/issues/detail?id=2021
Thanks anyway
Related
I'm trying to create an App that has a 2-tabbed activity, where tab1 has a picture and some text on top of it, and tab2 has two buttons users could click on (that should lead to further activities)
For some reason, I couldn't get the buttons on tab2 to show; all I can see is the same picture from tab1. On closer inspection, I noticed that the buttons are hidden under the picture from tab1. What am I doing wrong? How do I make that picture go away and not show up on tab2?
The following is my code:
IndexActivity
public class IndexActivity extends TabActivity {
#Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.main);
TabHost.TabSpec spec = getTabHost().newTabSpec("tab1");
spec.setContent(R.id.tab1content);
spec.setIndicator("tab1");
getTabHost().addTab(spec);
spec = getTabHost().newTabSpec("tab2");
spec.setContent(R.id.tab2content);
spec.setIndicator("tab2");
getTabHost().addTab(spec);
getTabHost().setCurrentTab(0);
}
}
My main.xml file goes like this:
<?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"
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">
<include layout="#layout/tab1"/>
<include layout="#layout/tab2"/>
</FrameLayout>
</LinearLayout>
tab1.xml is like this:
<?xml version="1.0" encoding="utf-8"?>
<merge xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<ImageView android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:scaleType="center"
android:src="#drawable/pic"/>
<ScrollView android:id="#+id/scrolltab1"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<TextView android:id="#+id/tab1content"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:background="#65000000"
android:text="#string/text"
android:textColor="#ffffffff"
android:textSize="20sp"
android:padding="15dp"
/>
</ScrollView>
</merge>
tab2 is like this:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/tab2content"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical">
<Button
android:id="#+id/button2"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_weight="1.10"
android:text="Button" />
<Button
android:id="#+id/button1"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_weight="1.10"
android:text="Button" />
</LinearLayout>
Please help! I must've overlooked something but I can't figure out what:(
Remove the following two lines from the FrameLayout in your main.xml and see what happens.
<include layout="#layout/tab1"/>
<include layout="#layout/tab2"/>
i sugggest you have a look at this....
you example actually fairly represent this example.... android tabhost tutorial
I hope you have seen it already.... this was the one i used when i frist developed my first android tab widget...
PS: Do have a look at this example part 2 of the above ... continuation each and everything you need to know.
Looking at your code and your XML I think the problem is with the tab1.xml with this line:
<TextView android:id="#+id/tab1content"...
Try to put a layout around the ImageView and ScrollView. And move the android:id="#+id/tab1content" to the layout. Something like this:
<?xml version="1.0" encoding="utf-8"?>
<merge xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<LinearLayout android:id="#+id/tab1content"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<ImageView android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:scaleType="center"
android:src="#drawable/pic"/>
<ScrollView android:id="#+id/scrolltab1"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<TextView android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:background="#65000000"
android:text="#string/text"
android:textColor="#ffffffff"
android:textSize="20sp"
android:padding="15dp" />
</ScrollView>
</LinearLayout>
</merge>
I have made one Layout in which I want to set the another layout from the existing xml file. Is this possible?
See below 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" />
<FrameLayout
android:id="#android:id/tabcontent"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<TextView
android:id="#+id/textview1"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:text="this is a tab" />
<TextView
android:id="#+id/textview2"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:text="this is another tab" />
<TextView
android:id="#+id/textview3"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:text="this is a third tab" />
</FrameLayout>
</LinearLayout>
Now I want to set the Layout in the frameLayout`
how it this possible?
Thanks.
Just create another activity with your second layout and then start the second activity with startActivity().
You didn't provide any code, but if you have 2 layouts in xml and the first one should include the second one, use the include-tag.
I have this layout file in my android application:
<?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="fill_parent"
android:layout_weight="1">
<TextView
android:id="#+id/textview1"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:text="this is a tab" />
<TextView
android:id="#+id/textview2"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:text="this is another tab" />
<LinearLayout
android:id="#+id/layoutSearch"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical">
<TextView
android:id="#+id/textview4"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:text="Search here" />
<EditText
android:id="#+id/editSearch"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
</LinearLayout>
</FrameLayout>
<TabWidget
android:id="#android:id/tabs"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_weight="0"/>
</LinearLayout>
</TabHost>
My problem is that LinearLayout android:id="#+id/layoutSearch" shows only one of the elements it contains (the text view, in the code above) If I remove the textview, it shows the EditText.
How do I make it display both (and more) elements?
There's a lot of excess layout there, but it looks like the real issue is that layoutSearch is a vertical LinearLayout with two children, but the first child's height is set to fill_parent, so you naturally never see the second one. Try setting its height to 0px but giving it a layout_weight of 1, and it should expand to take all the available space not taken by the EditText below it.
I'm completely new to java and .xml programing, and thanks to stack overflow and many other sites, I've been able to get a basic app started. The problem I'm having is this: I started with a tabbed layout with 4 tabs, and simple textviews with 3-4 pages of text in each tab. When I ran this on an emulator, I found the text wasn't scrolling, so after researching for a while, I figured that I needed a ScrollView in order to see all the text. I've now added the ScrollView, but only the first tab is scrolling. I've been looking all over for an answer, and can't seem to find one. I'm just hoping someone can look at my code, and perhaps see where I went wrong.
<?xml version="1.0" encoding="utf-8"?>
<TabHost xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+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">
<ScrollView
android:id="#+id/ScrollView01"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<TextView
android:id="#+id/textview1"
android:text="3-4 pages of text here"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:lineSpacingExtra= "5sp"
android:background="#color/backgroundColor"
android:textColor="#color/textColor"/>
</ScrollView>
<ScrollView
android:id="#+id/ScrollView02"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<TextView
android:id="#+id/textview2"
android:text="3-4 pages of text here"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:lineSpacingExtra= "5sp"
android:background="#color/backgroundColor"
android:textColor="#color/textColor"/>
</ScrollView>
<ScrollView
android:id="#+id/ScrollView03"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<TextView
android:id="#+id/textview3"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:lineSpacingExtra= "5sp"
android:text="more text in here"
android:background="#color/backgroundColor"
android:textColor="#color/textColor"/>
</ScrollView>
<ScrollView
android:id="#+id/ScrollView04"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<TextView
android:id="#+id/textview4"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:lineSpacingExtra= "5sp"
android:text="even more text here"
android:background="#color/backgroundColor"
android:textColor="#color/textColor"/>
</ScrollView>
/>
</FrameLayout>
</LinearLayout>
To make your TextView scrollable, you have to add the following code:
yourTextView.setMovementMethod(new ScrollingMovementMethod())
Please use the above code and let me know how it goes.
I have a screen that uses tabs in my android application. There is a line (like a border) that shows between the tabwidget and the framelayout. I want to get rid of that line, but cant seem to find what it is. I have determined that it is part of the FrameLayout by setting its visibilty to gone. Please refer to the code below:
<?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"
android:background="#fb8c10"
>
<ImageView
android:id="#+id/img_confirm_header"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:src="#drawable/confirm_header"
/>
<TabWidget
android:id="#android:id/tabs"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_marginBottom="0dip"
android:background="#fb8c10"
android:tabStripEnabled="false"
/>
<FrameLayout
android:id="#android:id/tabcontent"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:background="#drawable/tab_bg"
/>
</LinearLayout>
</TabHost>
This is a link of the current layout and what I'm trying to do
http://img441.imageshack.us/g/screenshot20110116at513.png/
The orange layout is my app, and the gray is what I'm trying to do.
Notice how in the gray screenshot the tab flows into the frame.
Apologies for the links, I can't post images yet :p
Thanks!
I managed to solve this by manipulating the z-index using relative layout. I was able to position the tabs slightly over the frame layout. Refer to code below:
<?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"
android:background="#fb8c10"
>
<ImageView
android:id="#+id/img_confirm_header"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:src="#drawable/tab_header"
/>
<RelativeLayout
android:id="#+id/widget77"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:background="#android:color/transparent"
>
<FrameLayout
android:id="#android:id/tabcontent"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:background="#android:color/transparent"
android:layout_marginTop="33dip"
/>
<TabWidget
android:id="#android:id/tabs"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:background="#fb8c10"
android:tabStripEnabled="true"
android:layout_above="#android:id/tabcontent"
android:layout_marginBottom="40dip"
/>
</RelativeLayout>
</LinearLayout>
</TabHost>
Just now I came across this issue. However, I also tried to remove the top border of FrameLayout. I did it. but I don't think it is a way to remove the top border. anyway FYI,
Just place an TextView with background white on Border and use AbsoluteLayout.
Eg:
<AbsoluteLayout>
<TabHost
android:layout_x="0dip"
android:layout_y="5dip" ...>
<AbsoluteLayout android:padding="5dip" android:background="#ffffff">
<TabWidget/>
<FrameLayout ....
android:layout_x="0dip" android:layout_y="65dip" />
</AbsoluteLayout>
</TabHost>
<TextView
android:layout_width="fill_parent" android:layout_height="25dip"
android:layout_x="0dip" android:layout_y="65dip"
android:background="#ffffff"/>
</AbsoluteLayout>