How to use and dynamically populate multiple tabhost views - android

I need to create a single activity tabhost, ideally create tabs and views, and dynamically populate the views with widgets. Having a 'control' button at the bottom of the screen is important.
I am able to create three tabs, using three layouts. Getting the EditTexts to a) appear, and b) line up below the tabs [using the separator] was a challenge, assisted by existing answers on StackOverflow.
What I now cannot work out is why the EditTexts on the second layout/tab don't appear, whereas those on the first tab do?
The 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="wrap_content"
android:layout_height="wrap_content">
<RelativeLayout
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"/>
<View
android:id="#+id/separator"
android:layout_below="#android:id/tabs"
android:layout_width="fill_parent"
android:layout_height="2dip" />
<FrameLayout
android:id="#android:id/tabcontent"
android:layout_below="#+id/separator"
android:layout_above="#+id/btnSend"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<LinearLayout
android:id="#+id/tabview1"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical">
<TextView
android:id="#+id/ll1text"
android:layout_height="wrap_content"
android:layout_width="fill_parent"
android:text="ll1text" />
</LinearLayout>
<LinearLayout
android:id="#+id/tabview2"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical">
<TextView
android:id="#+id/ll2text"
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:text="ll2text" />
</LinearLayout>
<RelativeLayout
android:id="#+id/tabview3"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical" >
<TextView
android:id="#+id/rl3text"
android:layout_height="wrap_content"
android:layout_width="fill_parent"
android:layout_alignParentBottom="true"
android:text="ll3text" />
</RelativeLayout>
</FrameLayout>
<Button
android:layout_alignParentBottom="true"
android:text="Start Travelling"
android:id="#+id/btnSend"
android:layout_weight="1"
android:layout_height="wrap_content"
android:layout_width="fill_parent" />
</RelativeLayout>
</TabHost>
The activity code
setContentView(R.layout.template);
TabHost th = getTabHost();
th.addTab(th.newTabSpec("tab1").setIndicator("Customer").setContent(R.id.tabview1));
LinearLayout ll = (LinearLayout) findViewById(R.id.tabview1);
EditText et1 = new EditText (this);
et1.setText("ET1");
ll.addView(et1);
TextView tv2 = new TextView(this);
tv2.setText("et2:");
ll.addView(tv2);
EditText et2 = new EditText (this);
et2.setText("ET2");
ll.addView(et2);
th.addTab(th.newTabSpec("tab2").setIndicator("Job").setContent(R.id.tabview2));
ll = (LinearLayout) findViewById(R.id.tabview2);
EditText et21 = new EditText (this);
et21.setText("et21");
ll.addView(et21);
EditText et22 = new EditText (this);
et22.setText("et22");
ll.addView(et22);
EditText et23 = new EditText (this);
et23.setText("et23");
ll.addView(et23);
th.addTab(th.newTabSpec("tab3").setIndicator("Tab 3").setContent(R.id.tabview3));
RelativeLayout rl = (RelativeLayout) findViewById(R.id.tabview3);
EditText et3 = new EditText (this);
et3.setText("ET3");
rl.addView(et3);
th.setCurrentTab(0);
How come the three EditTexts on the second tab don't show?

I think the problem is that you are trying to hold all your tabs under one activity. You should separate them as follows:
Use a class that deals with the TabActivity
Create different Activities for each of your tabs
Add a tabhost layout
Check out this tutorial for help.

Related

Android edittext not updating

My edittext's methods work properly as I have checked it on debbug, but in the graphical layout there are no changes at all.
When changing the text programatically, in the graphical layout doesn't appear, but if I try myedittext.getText() on the debbug expressions/watches it returns the correct string, so the settext() method is working OK but the changes are not shown.
Here is the code:
public class easmpartne extends FragmentActivity {
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.easmpartne);
FragmentTabHost tabHost = (FragmentTabHost) findViewById(android.R.id.tabhost);
tabHost.setup(this,
getSupportFragmentManager(), android.R.id.tabcontent);
tabHost.addTab(tabHost.newTabSpec("tab1").setIndicator("General"),
Tab1.class, null);
tabHost.addTab(tabHost.newTabSpec("tab2").setIndicator("Categ"),
Tab2.class, null);
LayoutInflater inflater = this.getLayoutInflater();
viewGeneral= inflater.inflate(R.layout.tab1, null);
viewCateg= inflater.inflate(R.layout.tab2, null);
txtRef=(EditText)viewGeneral.findViewById(R.id.txtRef);
txtRef.setText("example");
txtRef.setEnabled(false);
}
}
Neither settext nor setenabled seems no have any effect on the graphical layout when executing.
easmpartne.xml:
<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" >
<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="match_parent"
android:layout_height="wrap_content"
android:layout_weight="0"
android:orientation="horizontal" />
</HorizontalScrollView>
<FrameLayout
android:id="#android:id/tabcontent"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1" />
</android.support.v4.app.FragmentTabHost>
tab1.xml:
<ScrollView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="#+id/scrollView2"
android:layout_marginLeft="5dp"
android:fillViewport="true"
android:layout_alignParentBottom="true"
xmlns:android="http://schemas.android.com/apk/res/android">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="#+id/linlayouteasmpartne"
android:orientation="vertical">
<TableLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/tablelayout1">
<TableRow
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_marginTop="5dp">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textAppearance="?android:attr/textAppearanceMedium"
android:text="#string/ref"
android:id="#+id/textView" />
<EditText
android:layout_width="170dp"
android:layout_height="wrap_content"
android:id="#+id/txtRef" />
</TableRow>
....
(I don't know if this could be a problem with de tabhost as it is the first time I use it)
Is that the correct way to get the edittext in this case?
What are the possible problems/solutions?
Thanks.
the point is, you see, that the layout is not kind of a shared variable so when you or the runtime reads it, it instances all views referenced inside and you have to stick to it. Then you follow the lifecycle of the components so to set the values you want you should do it in onViewStateRestored(Bundle) when the view is actually done or something like that, or onStart or so

Text position on TabHost

I created activity with tabhost: Code below:
<TabHost
android:id="#+id/tabhost1_zabytek"
android:background="#null"
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="40dp"
android:background="#drawable/tlo12"
/>
<FrameLayout
android:id="#android:id/tabcontent"
android:layout_width="fill_parent"
android:background="#null"
android:layout_height="fill_parent"
>
</FrameLayout>
</LinearLayout>
</TabHost>
And programically try set text position:
TabHost host= (TabHost) findViewById(R.id.tabhost1_zabytek);
final View view = host.getTabWidget().getChildTabAt(0);
final textView = view.findViewById(R.id.title);
((TextView) textView).setGravity(Gravity.CENTER);
So , when I run my application on device with android 4.1 all is ok.
But, when I run my application on device with android 2.3, application display text on tabhost in a wrong position.
My application should display text position Gravity.Center on each version Android. What should I do?? How solve my problem?

Using Tabs with Views

I have a little problem using Tabs with Views.
First I just copied the sample code where Tabs are used with activitys:
My LayoutFile looks 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"
android:padding="5dp" />
</LinearLayout>
</TabHost>
And this is my Java-code:
public class MyActivity extends TabActivity{
public void onCreate(Bundle savedInstanceState){
super.onCreate(savedInstanceState)
setContentView(R.layout.main);
TabHost tH = getTabHost();
Indent intent = new Intent().setClass(this, AnotherActivity.class);
// Initialize a TabSpec for each tab and add it to the TabHost
//TextView Test = new TextView(this);
//Test.setText("test");
tH.addTab(tH.newTabSpec("t1").setIndicator("Tab1").setContent(intent));
tH.setCurrentTab(0);
}
}
And this works as expected.
But when I uncomment the TextView-lines and call setContent(Test.getId()) instead of setContent(intent), the app crashes.
I also tried to create a textview in the layoutfile, and call setContent(R.id.test),
that also makes it crash.
So this is one problem.
The seccond point is. I do not want to use activitys, because i want to be able to call methods on those classes, which shall represent the Tab-content.
So my original idea is, to derive some classes from view. 1 for each tab, and pass their ids. But therefor the codesample above needs to work first.
greetings Uzaku
I know you said you tried a TextView in the layout file but this should work...
Change the FrameLayout section as follows...
<FrameLayout
android:id="#android:id/tabcontent"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:padding="5dp" >
<TextView
android:id="#+id/test"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:text="TEST" />
</FrameLayout>
Then in your code do the following...
tH.addTab(tH.newTabSpec("t1").setIndicator("Tab1").setContent(R.id.test));

How to set the background color of new activity after clicking tabs

I am switching activities on tab clicks and successful at this. But, in one of my Activity class I am doing the following:
public void onCreate(Bundle savedInstanceState){
super.onCreate(savedInstanceState);
setContentView(R.layout.main);
}
main.xml has the following:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:background="#BDBDBD">
</LinearLayout>
I want to change the background of this layout only and I want tabs to their as it is. But with the current android:layout_height="fill_parent" in main.xml my background is overwriting the tabs which means I am unable to see tabs. and If I make android:layout_height="wrap_content" I cannot see any change taking and tabs are still their.
Please help.
Here is some information..
screen2.xml
<?xml version="1.0" encoding="utf-8"?>
<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/ScrollView01"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<LinearLayout
android:id="#+id/LinearLayout01"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical">
<LinearLayout android:id="#+id/LinearLayout02"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:gravity="center">
<TextView android:text="AcctId"
android:id="#+id/TextView01"
android:layout_width="50px"
android:layout_height="wrap_content"></TextView>
<EditText
android:id="#+id/acctid"
android:layout_width="200px"
android:layout_height="wrap_content"></EditText>
</LinearLayout>
<LinearLayout android:id="#+id/LinearLayout03"
android:layout_width="fill_parent"
android:gravity="center"
android:layout_height="wrap_content">
<TextView android:text="Zip"
android:id="#+id/TextView02"
android:layout_width="50px"
android:layout_height="wrap_content">
</TextView>
<EditText
android:id="#+id/stid"
android:layout_width="200px"
android:layout_height="wrap_content">
</EditText>
</LinearLayout>
<Button android:text="Login"
android:layout_width="80px"
android:layout_height="wrap_content"
android:layout_gravity="center">
</Button>
<ImageView
android:layout_width="200px"
android:layout_height="200px"
android:src="#drawable/icon"
android:layout_gravity="center">
</ImageView>
</LinearLayout>
</ScrollView>
screen1.xml
<?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">
<FrameLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:background="#c6c3c6"
android:layout_gravity="bottom"
android:paddingTop="1dip"
android:paddingLeft="1dip"
android:paddingRight="1dip">
<TabWidget
android:layout_gravity="bottom"
android:id="#android:id/tabs"
android:layout_height="wrap_content"
android:layout_width="fill_parent"/>
</FrameLayout>
<FrameLayout
android:id="#android:id/tabcontent"
android:layout_width="fill_parent"
android:layout_height="fill_parent" >
</FrameLayout>
</TabHost>
MainActivity.java
public class onstarAndroidMain extends TabActivity {
public void onCreate(Bundle savedInstanceState){
super.onCreate(savedInstanceState);
setContentView(R.layout.screen1);
addTabs();
}
private void addTabs(){
Resources resources = getResources();
TabHost tabs = (TabHost) findViewById(android.R.id.tabhost);
tabs.setup();
//tabspec defines the attributes of the tab
TabSpec tab;
tab = tabs.newTabSpec("Screen1");
tab.setContent(new Intent(this, Screen1.class));
tab.setIndicator("Screen1");
tabs.addTab(tab);
tabs.getTabWidget().getChildAt(0).getLayoutParams().height = 30;
tab = tabs.newTabSpec("Screen2");
tab.setContent(new Intent(this, Screen2.class));
tab.setIndicator("Screen2");
tabs.addTab(tab);
tabs.getTabWidget().getChildAt(1).getLayoutParams().height = 30;
tab = tabs.newTabSpec("Screen3");
tab.setContent(new Intent(this, Screen3.class));
tab.setIndicator("Screen3");
tabs.addTab(tab);
tabs.getTabWidget().getChildAt(2).getLayoutParams().height = 30;
//sets the current tab
tabs.setCurrentTab(0);
//add the tabhost to the main content view
}
}
Screen2.java
public class OnstarScreen2 extends Activity {
#Override
public void onCreate(Bundle icicle) {
super.onCreate(icicle);
setContentView(R.layout.screen2);
}
Now whenever I click the screen2 tab and try to get the screen2.xml, my tabs are going below the screen2 layout. I dont know what to do. Basically what I want to achieve is that the tab should be always their at the bottom irrespective of what view is shown above them. they should not be overlapped with anything else.
screen2.xml has a scrollview and iside that I have a linearlayout which has a login form...but this form whenever is called just comes above the tabs...please help
You are doing something wrong with your tabs. Are you just launching a new activity when the tab is clicked? Then, if that new activitys layout covers the entire screen, ofcourse the tabs will be covered by this.
Follow this guide:
http://developer.android.com/intl/de/resources/tutorials/views/hello-tabwidget.html

Android: Anyone wants to take a shot at suggesting a better layout?

I never designed UIs (more of a middleware guy) before so I apologize if the question is stupid. I am designing a UI to look something like the following:
ImageView ImageView
TabHost
Tab 0 ------ Tab 1 ------ Tab 2
-----INSIDE EACH TAB-----
TextView
ListView
- Consists of ImageView TextView
The problem is I think I am following a very inefficient way of doing the whole stuff. The onCreate method is as follows:
CODE:
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.main);
TabHost mTabHost = getTabHost();
Drawable Tab1Icon = getResources().getDrawable(R.drawable.tab1_icon);
Drawable Tab2Icon = getResources().getDrawable(R.drawable.tab2_icon);
Drawable Tab3Icon = getResources().getDrawable(R.drawable.tab3_icon);
mTabHost.addTab(mTabHost.newTabSpec("Tab1").setIndicator("Tab 1", Tab1Icon).setContent(new Intent(this, Tab1.class)));
mTabHost.addTab(mTabHost.newTabSpec("Tab2").setIndicator("Tab 2", Tab1Icon).setContent(new Intent(this, Tab2.class)));
mTabHost.addTab(mTabHost.newTabSpec("Tab3").setIndicator("Tab 3", Tab1Icon).setContent(new Intent(this, Tab3.class)));
mTabHost.setCurrentTab(0);
}
This program crashes on CupCake (v1.5) complaining about StackOverflowException but runs well on Donut (v1.6). This is my main.xml:
<?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"
android:background="#color/application_background"
>
<TableLayout
android:id="#+id/TableLayout01"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:stretchColumns="0"
android:background="#color/application_background">
<TableRow>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="horizontal"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<ImageView id="#+id/picview1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/leftlogo"
android:paddingRight="105sp"
/>
<Button
android:id="#+id/picview2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/rightlogo"
/>
</LinearLayout>
</TableRow>
<TableRow>
<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">
</FrameLayout>
</LinearLayout>
</TabHost>
</TableRow>
</TableLayout>
</LinearLayout>
Any suggestions regarding the design please?
Thanks
If you are getting StackOverflowExceptions, your UI is too complex. Fire up hierarchyviewer and find ways to remove some layers.
One way to simplify everything and remove layers is to supply the tab contents as Views, not Intents pointing to Activities.
You can just pass the R.drawable ID of the icon to setIndicator().
You should not have the TableLayout inside a LinearLayout (why bother with the LinearLayout?) or a LinearLayout inside of a TableRow (TableRow is a LinearLayout, for all intents and purposes). Please consider dumping the entire TableLayout/TableRow/LinearLayout stuff and just use a single RelativeLayout.

Categories

Resources