I have 2 questions regarding tabHost:
I've created tabHost with 2 tabs
and for the tab titles I use setIndicator(TextView)
(I work with api level 4)
my title background is white. I use selector for the title to choose between diff images for the title.
I want to make the title text bold only when selected/pressed. I didn't succeed to do it using the selector I have. can I do it at all? the idea is that on cases I use drawable a I want the text bold. other cases not bold. same question regarding textColor.
it looks like a bug - when the tab first opens, the text on the selected tab (the one I used in tabHost.setCurrentTab(tabId)) is not seen at all. after first press/focus/focus any other item it looks well. any idea why or how to solve this?
thanks in advance
on tabActivity -
TextView title1 = new TextView(MainActivity.getInstnace(), null, android.graphics.Typeface.NORMAL);
TextView title2 = new TextView(MainActivity.getInstnace(), null, android.graphics.Typeface.NORMAL);
title1.setText("teb11 title");
title1.setBackgroundResource(R.drawable.tabtitle);
title1.setCompoundDrawablesWithIntrinsicBounds(getResources().getDrawable(R.drawable.tab1), null, null, null);
title2.setText("tab22 title");
title2.setBackgroundResource(R.drawable.tabtitle);
title2.setCompoundDrawablesWithIntrinsicBounds(getResources().getDrawable(R.drawable.tab2), null, null, null);
TabSpec tab1 = mTabHost.newTabSpec("tab1").setIndicator(title1).setContent(R.id.list1);
TabSpec tab2 = mTabHost.newTabSpec("tab2").setIndicator(title2).setContent(R.id.list2);
mTabHost.addTab(tab1);
mTabHost.addTab(tab2);
mTabHost.setCurrentTab(0);
the selector tab1.xml
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_selected="true"
android:drawable="#drawable/iconselect"/>
<item android:state_pressed="true"
android:drawable="#drawable/iconselect"/>
<item android:drawable="#drawable/icon"/>
</selector>
the selector for tabTitle
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_pressed="true"
android:drawable="#drawable/tabselected"/>
<item android:state_selected="true"
android:drawable="#drawable/tab" />
<item android:state_focused="true"
android:drawable="#drawable/tab" />
</selector>
For your question #1:
On your TabsAdapter use onPageSelected(int position) like this:
public void onPageSelected(int position) {
//your logic here
fixTitleText();
}
and:
private void fixTitleText() {
for (int i = 0; i < mTabHost.getTabWidget().getChildCount(); i++) {
View view = mTabHost.getTabWidget().getChildAt(i);
TextView tv = (TextView) view.findViewById(android.R.id.title);
tv.setTextColor(getResources().getColor(R.drawable.text_selector));
tv.setTextSize(TypedValue.COMPLEX_UNIT_SP, 14);
tv.setTypeface(null, Typeface.BOLD);
}
}
just notice that this code is for HONEYCOMB and up, before this the tab host view hierarchy is a bit different
this is my 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">
<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="60px"
android:background="#drawable/headerbk"
android:paddingTop="12px"
android:orientation="vertical"
android:gravity="center_horizontal">
</TabWidget>
<FrameLayout android:id="#android:id/tabcontent"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<ListView android:id="#+id/list1"
android:background="#drawable/bk"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_weight="1"
android:scrollbars="vertical"
android:divider="#drawable/separationline"
android:cacheColorHint="#00000000"
android:footerDividersEnabled="false"
android:listSelector="#drawable/selected" />
<ListView android:id="#+id/list2"
android:background="#drawable/bk"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_weight="1"
android:scrollbars="vertical"
android:divider="#drawable/separationline"
android:cacheColorHint="#00000000"
android:footerDividersEnabled="false"
android:listSelector="#drawable/selected" />
</FrameLayout>
</LinearLayout>
</TabHost>
Can I see your layout XML or are you doing this only through Java commands. Either way, I'd like to see more than just some pseudocode to actually work on this.
That would be either your main.xml file or your OnCreate() function. IF you are setting your layout through XML, main.xml should have contents similar to :
<?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">
<RelativeLayout android:id="#+id/RelativeLayout01"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:background="#ffffffff">
</RelativeLayout>
<RelativeLayout android:id="#+id/RelativeLayout02"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:background="#ffffffff">
</RelativeLayout>
</FrameLayout>
</LinearLayout>
</TabHost>
It is possible to do it entirely through Java commands, but especially when fixing #2, we will likely need to see more of your code. As part of the OnCreate() function, I would recommend initializing all the stuff you would like to be shown. Otherwise, if it is not in your main.xml, and it is not initialized, it will not be shown.
If want the bold text on selection,
There may a different ways but what I did is...
to make custom TextView, and then Handle the touch event Like bold on action down and set to normal on action up.
Related
I'm getting a resource not found error when I try to do this:
TabWidget tabz = FindViewById<TabWidget>(Resource.Id.tabs);
compiler doesn't see the TabWidget even when it's clearly labeled by id in my Main.axml file
Error CS0117 'Resource.Id' does not contain a definition for 'tabs'
Here's my full code:
<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"
android:visibility="visible" />
<FrameLayout
android:id="#android:id/tabcontent"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:padding="5dp" />
</LinearLayout>
EDIT, sorry, this is the full code... I don't know why I didn't copy this last time. The above example is missing TabHost
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent">
<TabHost
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:minWidth="25px"
android:minHeight="25px"
android:id="#+id/tabHost1">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:id="#+id/linearLayout1">
<TabWidget
android:id="#android:id/tabs"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
<FrameLayout
android:id="#android:id/tabcontent"
android:layout_width="match_parent"
android:layout_height="match_parent" />
</LinearLayout>
</TabHost>
</LinearLayout>
How can I force the compiler to recognize my tabs id? I've tried rebuilding the resource.designer.cs .. putting the declaration of TabWidget inside all of the activities... nothing works. My C# can't see the TabWidget
full project can be found here:
https://github.com/hexag0d/BitChute_Mobile_Android_a2
I also tried this and it didn't work
Xamarin Android Resource file not found
thanks, in advance
The issue is not with the visual studio compiler but the way that you have declared the id for your View,
If you check this blog by James White you will see how Id and the Layout Attributes actually work in Android,
The Right way of declaring the Id would be something like this android:id="#+id/tabs" whereas what you are doing is this android:id="#android:id/tabs"
Hence, When you do add them and try to find it using Resource.Id.tabs, There is nothing available in Id by the name tabs as it was never added by the Xamarin ResourceDesginer.cs file.
So the end result should actually be something like this :
<TabHost
android:id="#+id/tabhost"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_alignParentTop="true"
android:layout_centerHorizontal="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"
android:background="#ffc916"
android:orientation="vertical">
</LinearLayout>
</FrameLayout>
</LinearLayout>
</TabHost>
Also, note that I have replaced all the fill_parent's with match_parent's the reason behind it being that fill parent is now obsolete or you can say replaced (After API-8) and hence must not be used, which can be found here.
Update:
I have updated the way tab host works, Also updated the XML above and I am adding a reference link where you can find the right way of using both the TabHost and TabWidget, Also a good SO example for the same.
About the questions in your comment:
1,
that is very good advice, but one note is that when
SetContentView(localLayout); is used inside an activity that already
has a content view, it crashes the app.
The app crashed because localLayout in SetContentView(localLayout) is a LinearLayout but a TabWidget needs a TabHost. So you can directly use:
SetContentView(Resource.Layout.Main);
where Main.xaml is like:
<?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"
android:theme="#style/MyTheme">
<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"
android:layout_weight="0.0"
android:visibility="visible" />
<FrameLayout
android:id="#android:id/tabcontent"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:padding="5dp" />
</LinearLayout>
</TabHost>
2,
LinearLayout localLayout =
FindViewById(Resource.Layout.Main); View
whichYouWantToUse_findViewById =
LayoutInflater.Inflate(Resource.Layout.Main, null); TextView tv =
FindViewById(Resource.Id.textView169); TabHost _tabHost =
(TabHost)whichYouWantToUse_findViewById.FindViewById(Resource.Id.tabhost);
' still can't see the tabhost ... I'm losing my mind here
The reason why you cannot see the tabhost is, firt, TabHost is FrameLayout, not LinearLayout, second, Resource.Id.tabhost should be Android.Resource.Id.TabHost. So I edited your code to :
FrameLayout localLayout = FindViewById<FrameLayout>(Resource.Layout.Main);
whichYouWantToUse_findViewById = LayoutInflater.Inflate(Resource.Layout.Main, null);
//TextView tv = FindViewById<TextView>(Resource.Id.textView1);
TabHost _tabHost = (TabHost)whichYouWantToUse_findViewById.FindViewById(Android.Resource.Id.TabHost);
3,
So the interesting thing is if I change tabhost to tahost ala
android:id="#+id/tahost" the resource appears in the designer but when
I change to android:id="#+id/tabhost" the resource disappears.. very
strange..
The id of TabHost need always be #android:id/tabhost", it cannot be modified to tahost or any others.
So the code in the onCreat Method is like this:
base.OnCreate(bundle);
SetContentView(Resource.Layout.Main);
View whichYouWantToUse_findViewById = LayoutInflater.Inflate(Resource.Layout.layout1, null);
TextView textInAnotherLayout = (TextView)whichYouWantToUse_findViewById.FindViewById(Resource.Id.textView1);
textInAnotherLayout.Text = "Yeah";
TabHost tabHost = FindViewById<TabHost>(Android.Resource.Id.TabHost);
TabWidget tabWidget = tabHost.TabWidget;
var tabContent = tabHost.TabContentView;
FrameLayout localLayout = FindViewById<FrameLayout>(Resource.Layout.Main);
whichYouWantToUse_findViewById = LayoutInflater.Inflate(Resource.Layout.Main, null);
TabHost _tabHost = (TabHost)whichYouWantToUse_findViewById.FindViewById(Android.Resource.Id.TabHost);
The following is the old answer.
Answer modified: The way to get TabHost and TabWidget in Activity:
TabHost tabHost = this.TabHost;
TabWidget tabWidget = tabHost.TabWidget;
The way to use one resource from one XAML file in the activity for
another:
LinearLayout localLayout = FindViewById<LinearLayout>(Resource.Layout.Main);
SetContentView(localLayout);
View whichYouWantToUse_findViewById = LayoutInflater.Inflate(Resource.Layout.layout1, null);
Button button1 = (Button)whichYouWantToUse_findViewById.FindViewById(Resource.Id.button1);
I download your project and fixed this problem by modifying the property of >android:id
currently I'm trying to implement the FragmentTabHost for my project. I'm still new on this fragments but I found it very great in terms of reusing the layouts, etc which is why I wanted to push myself further on to it. Now I read the tutorials on how to create a Tabs with fragment and I came on this tutorial:
http://maxalley.wordpress.com/2013/05/18/android-creating-a-tab-layout-with-fragmenttabhost-and-fragments/
Now this works just fine, except that the tabWidget is on top of my layout where I wanted it to be on bottom. I find that I need to setup the tabWidget after all the tabs has been initialized so I tried to add these codes:
mTabWidget = (TabWidget) findViewById(android.R.id.tabs);
mTabWidget.setBackgroundColor(Color.WHITE);
mTabWidget.setShowDividers(LinearLayout.SHOW_DIVIDER_NONE);
mTabWidget.setGravity(Gravity.BOTTOM);
Now this one already eliminated the divider and changes the color but obviously won't put my Widget on the bottom part of my layout. Now how would I do that?
I also tried to edit the Tabhost xml and just put the TabWidget after the FrameLayout but nothing happens. here's the 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">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical" >
<FrameLayout
android:id="#+id/tabFrameLayout"
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"
android:layout_weight="0"
android:orientation="horizontal"
/>
</LinearLayout>
</android.support.v4.app.FragmentTabHost>
I have refer this link github example
This will be your layout:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical" >
<FrameLayout
android:id="#+id/realtabcontent"
android:layout_width="match_parent"
android:layout_height="0dip"
android:layout_weight="1" />
<android.support.v4.app.FragmentTabHost
android:id="#android:id/tabhost"
android:layout_width="match_parent"
android:layout_height="wrap_content" >
<FrameLayout
android:id="#android:id/tabcontent"
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_weight="0" />
</android.support.v4.app.FragmentTabHost>
</LinearLayout>
For your custom Tabs :
mTabHost.addTab(setIndicator(mTabHost.newTabSpec("Tab1"),
R.drawable.image1),
public TabSpec setIndicator(Context ctx,TabSpec spec, int resid) {
// TODO Auto-generated method stub
View v = LayoutInflater.from(ctx).inflate(R.layout.tabs_text, null);
v.setBackgroundResource(resid);
TextView text = (TextView) v.findViewById(R.id.tab_title);
text.setText(spec.getTag());
return spec.setIndicator(v);
}
Edit
//To set drawable to your perticular TAB
mTabHost.getTabWidget().getChildAt(0).setBackgroundResource(R.drawable.tab_login);
end Edit
If you want to add drawable (selector):
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:drawable="#drawable/tab_compose_h" android:state_selected="true"/>
<item android:drawable="#drawable/tab_compose_h" android:state_pressed="true"/>
<item android:drawable="#drawable/tab_compose"/>
</selector>
Hello I am beginner to the android development. I want to create a tab structure.Where i want every tab to have icon. When i am specifying icon through xml it does reflect in tab.But icon is not occupying full space.
Please help me with this.
here is my tab xml
<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"
android:background="#000000">
<RelativeLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
>
<TabWidget
android:id="#android:id/tabs"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom= "true"
/>
<FrameLayout
android:id="#android:id/tabcontent"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_above= "#android:id/tabs"
android:padding="5dp" />
</RelativeLayout>
</TabHost>
Following is my xml which i am using for tab to have icon.
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:drawable="#drawable/home" android:state_selected="true"/>
<item android:drawable="#drawable/homefade"/>
</selector>
and this is the java code which i am using to apply icon.
TabHost tabHost = (TabHost)findViewById(android.R.id.tabhost);
tabHost.addTab(tabHost.newTabSpec(HOME_TAB).setIndicator("", getResources().getDrawable(R.drawable.tab_home_config)).setContent(
new Intent(this, HomeActivity.class)));
I figured it out..
Need to set padding to zero that's it.
for (int i = 0; i < tabHost.getTabWidget().getChildCount(); i++)
{
tabHost.getTabWidget().getChildAt(i).setPadding(0,0,0,0);
}
I have a layout XML file straight from the tutorial:
layout/partnertrial_summary.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">
<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>
In my Activity class, I try to use the following code, but if fails:
mTabHost = findViewById(R.layout.partnertrial_summary.tabhost);
which fails. However, it validates the R.layout.partnertrial_summary part in Green, but when I try to auto-popup the members of partnertrial_summary it yields nothing.
I assume the XML is valid because it came straight from Android, so it's something I am doing wrong on my end. Note that my Activity is not a TabActivity, but I thought it would be okay to use a regular one and add a TabHost, implementing the appropriate listeners. Correct me if my thinking is wrong.
mTabHost = findViewById(R.layout.partnertrial_summary.tabhost);
replace the above as below
LayoutInflater inflater = (LayoutInflater)getApplicationContext().getSystemService(Context.LAYOUT_INFLATER_SERVICE);
View view = inflater.inflate(R.layout.partnertrial_summary,null);
mTabHost = (TabHost)view.findViewById(R.id.tabhost);
layout can be inflated but cannot be find using findViewById()
how to get the following design of a tabbar
When a tab is been selected the the curve button must visible in the particular tab and the other to be in common.
i thought of adding a fixed background color to be red and i am to place the buttons of an image with curve and without curve. But i want to know whether it gets fixed for all android device, because wat to be the button height and width ? how to set a tabbar of fixed height and width....
I found by a simple way as follows
To get the redline at the bottom of the tabbar i have added a view under the tab as follows
<TabHost
android:id="#android:id/tabhost"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
xmlns:android="http://schemas.android.com/apk/res/android">
<LinearLayout
android:layout_width="fill_parent"
android:id="#+id/linearLayout1"
android:layout_height="fill_parent"
android:orientation="vertical">
<TabWidget
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:id="#android:id/tabs"
android:layout_alignParentBottom="true"
android:layout_weight="0">
</TabWidget>
<View android:layout_width="fill_parent" android:layout_height="4dip" android:background="#ff0000" />
<FrameLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:id="#android:id/tabcontent"
android:layout_weight="1">
</FrameLayout>
</LinearLayout>
</TabHost>
Then my tabbar class is as follows
public class CustomTabActivity extends TabActivity
{
#Override
public void onCreate(Bundle savedInstanceState)
{
super.onCreate(savedInstanceState);
setContentView(R.layout.tabbar);
addTab1(FirstTab.class);
addTab2(SecondTab.class);
addTab3(FirstTab.class);
addTab4(SecondTab.class);
}
private void addTab1( Class<?> c)
{
TabHost tabHost = getTabHost();
Intent intent = new Intent(this, c);
TabHost.TabSpec spec = tabHost.newTabSpec("tab");
View tabIndicator = LayoutInflater.from(this).inflate(R.layout.tab_indicator1, getTabWidget(), false);
ImageView icon = (ImageView) tabIndicator.findViewById(R.id.icon1);
spec.setIndicator(tabIndicator);
spec.setContent(intent);
tabHost.addTab(spec);
}
}
My tab_indicator layout is as follows
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="0dip"
android:layout_height="55dip"
android:layout_weight="1"
android:orientation="vertical"
android:padding="5dp">
<ImageView android:id="#+id/icon1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:background="#drawable/tab1">
</ImageView>
</RelativeLayout>
the tab1 in the drawable is an Selector xml file as follows
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android" >
<item android:state_focused="false" android:state_selected="false"
android:state_pressed="false" android:drawable="#drawable/home" />
<item android:state_focused="false" android:state_selected="true"
android:state_pressed="false" android:drawable="#drawable/home_select_btn" />
</selector>
Here i have added the selected image with a bend and unselected image without bend, that i want to show.
This way seems to be a very long but i feel it to be the same design which i needed.
Maybe this example will be useful to you. It is the same kind of navigation that Google+ application has.