As per my application requirement i created a activity which extends TabActivity, added Tabs and different Activities as Content for those tabs. Upto this everything okay, but I want to add search functionality to entire TabActivity, that means Searching is done at the top of TabHost and it should reflect the all tabs contents search.
I know how to add search to a individual Activity but i didn't find any solution for my problem.
Please suggest me if you know any procedure to do this.
As per documentation TabActivity is deprecated:
http://developer.android.com/reference/android/app/TabActivity.html
you should use either the FragmentTabHost or the super awesome SherlockActionBar library.
After you implemen one of those modern ways it's just a matter to add a searchView menu item in your menu and it will be there.
You can try hosting a search bar within the activity jus before adding a tabhost like in the code below. And additionally implement search functionality by adding text watcher
public class MyTabActivity extends Activity {
/** Called when the activity is first created. */
#Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.tab_xml_with_search_bar);
}
}
tab_xml_with_search_bar.xml
<?xml version="1.0" encoding="utf-8"?>
<TextView
android:id="#+id/textView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_centerVertical="true"
android:text="Search text"
/>
<TabHost 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: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"/>
</LinearLayout>
</TabHost>
Related
I have read looked through some code that implements tabs on the bottom of the app's page. And there is no deprecated method/class inside the code, and to me it is a very easy and clean way to implements tabs.
But I heard the new way of implementing tabs is to use fragments.
So, which one is better? And why?
XML:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical" >
<TabHost
android:id="#+id/edit_item_tab_host"
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"
android:layout_gravity="bottom" />
<FrameLayout
android:id="#android:id/tabcontent"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:paddingTop="65px" >
<LinearLayout
android:id="#+id/edit_item_date_tab"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical"
android:padding="5px" >
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="date"
android:textStyle="bold" />
</LinearLayout>
<LinearLayout
android:id="#+id/edit_item_geocontext_tab"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical"
android:padding="5px" >
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="lieu"
android:textStyle="bold" />
</LinearLayout>
<LinearLayout
android:id="#+id/edit_item_text_tab"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical"
android:padding="5px" >
</LinearLayout>
</FrameLayout>
</TabHost>
</LinearLayout>
MainActivity class:
import android.app.Activity;
import android.os.Bundle;
import android.widget.TabHost;
import android.widget.TabHost.TabSpec;
public class MainActivity extends Activity {
/** Called when the activity is first created. */
#Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.main);
TabHost tab_host = (TabHost) findViewById(R.id.edit_item_tab_host);
// don't forget this setup before adding tabs from a tabhost using a xml view or you'll get an nullpointer exception
tab_host.setup();
TabSpec ts1 = tab_host.newTabSpec("TAB_DATE");
ts1.setIndicator("tab1");
ts1.setContent(R.id.edit_item_date_tab);
tab_host.addTab(ts1);
TabSpec ts2 = tab_host.newTabSpec("TAB_GEO");
ts2.setIndicator("tab2");
ts2.setContent(R.id.edit_item_geocontext_tab);
tab_host.addTab(ts2);
TabSpec ts3 = tab_host.newTabSpec("TAB_TEXT");
ts3.setIndicator("tab3");
ts3.setContent(R.id.edit_item_text_tab);
tab_host.addTab(ts3);
tab_host.setCurrentTab(0);
}
}
A TabHost cannot contain fragments (well, it can but it's really tricky) so I wouldn't recommend to use it today.
Fragments are the way to go, and if you want to implement the new Tab mechanism (which is integrated to the "new" ActionBar available on Android 3.0) and still support old android versions there is ActionBarSherlock, an open-source project which facilitate the use of the action bar design pattern across all versions of Android with a single API.
A lot of popular apps uses this project nowadays (including Google apps) so it's worth looking at.
A Fragment represents a behavior or a portion of user interface in an
Activity.
The android developer guide.
Your question seems to be worded a little strangely. You are asking about Tabs being at the bottom of the page but asking if you should use Fragments. Those are two different topics.
Yes, you should use Fragments, it is the route android is taking and will continue to take for the future.
Having Tabs at the bottom of the screen or at the top is a design decision. Depends on what would be more comfortable for the user experience, really doesn't have a lot to do with Fragments.
Google has introduced a new View called BottomNavigationView, a standard Bottom Navigation bar for android applications. As per guidelines you can add upto 5 (standard) items and pretty much simple as android's NavigationView.
Please do visit Component Guidelines, to know more about designing.
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));
I have been reading your posts and they are very helpful. However, I really need your experienced advise in this and what would you do if you were me.
I am doing and application in which is has 4 tabs. The layout of the 4 tabs is similar (a table that has values in its cells and 3 buttons, and textview). The only thing that changes from one tab to another is the table values and textview. However, I need to share data between the tabs as the values on each tab are dependent on previous tab
How do you think I should approach? I have been reading that using views is generally recommended over activites. Can I use the same view layout for all the tabs?
Please any help on how you would design it will be great. I am on 2.1 and targetting pretty much all platforms .THANK U
PS: I tried (as an example) having textview under the framelayout, but the problem is that changing the text in Java code will make the textview changes in all the tabs. For some reason, I am feeling that having 4 text views (one for each tab) is kinda redundant and bad design but I dont know!
I would approach this by defining a layout, and using that same layout in each of your tabs. E.g.
public class MyTabActivity1 extends Activity {
#Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.tab_layout);
}
You can go for TabHost and TabWidget to solve your problem. Below is a sample demo for with the implementation. Tab_Layout.xml:
<?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">
<TabHost android:id="#android:id/tabhost" android:layout_width="match_parent"
android:layout_height="match_parent">
<LinearLayout android:layout_width="fill_parent"
android:layout_height="fill_parent" android:orientation="vertical"
android:paddingTop="4dip">
<TabWidget android:id="#android:id/tabs"
android:layout_width="match_parent" android:layout_height="wrap_content"
android:layout_weight="0" android:orientation="horizontal" />
<FrameLayout android:id="#+android:id/tabcontent"
android:layout_width="match_parent" android:layout_height="0dp"
android:layout_weight="1" />
</LinearLayout>
</TabHost>
</LinearLayout>
The default style for the Android TabHost works fine for straight Android systems. However, on HTC Sense, they use dark text on a dark background, which is unreadable.
What's the easiest way to have a TabHost that has visible text across all the various flavors of android skins? I would prefer to not have to make a completely custom look-and-feel if possible.
My targetSDK is 10 and my minSDK is 7.
I'll give you the advise to get completely independent from the TabWidget and create your own Navigation, which you can customize however you want and don't bother with the stiff TabWidget. I don't mean to throw away the awesome TabHost, because it's easy to use the TabHost with a custom navigation:
First set your TabWidget as gone:
<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">
<RelativeLayout
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"
android:visibility="gone"/>
And then create you own navigation in place of it. You could also create a menu (with the hardware menu button) or something like this:
<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">
<RelativeLayout
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"
android:visibility="gone"/>
<!-- content of your tabs-->
<FrameLayout
android:id="#android:id/tabcontent"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_above="#id/slider_stub"
android:background="#color/overview_banner_bg_down"/>
<!-- custom slider with horizontal scrollable radio buttons-->
<com.example.WrappingSlidingDrawer
android:id="#+id/tab_slider"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:handle="#+id/tab_slider_handle"
android:content="#+id/tab_scroller">
<RelativeLayout
android:id="#+id/tab_slider_handle"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:background="#drawable/def_slider">
</RelativeLayout>
<HorizontalScrollView
android:id="#+id/tab_scroller"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:fadeScrollbars="false"
android:scrollbarAlwaysDrawHorizontalTrack="true"
android:scrollbarTrackHorizontal="#drawable/scrollbar_horizontal_track"
android:scrollbarThumbHorizontal="#drawable/scrollbar_horizontal_thumb"
android:fillViewport="true"
android:scrollbarSize="3dip"
android:fadingEdgeLength="80dp"
android:background="#343534">
<RelativeLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content">
<RadioGroup
android:id="#+id/custom_tabs"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:gravity="center"
android:orientation="horizontal"
android:checkedButton="#+id/tab_overview">
<RadioButton
android:id="#+id/tab_overview"
android:layout_height="55dp"
android:layout_width="55dp"
android:button="#null"
android:background="#drawable/def_checktab_overview"/>
<RadioButton
android:id="#+id/tab_news"
android:layout_height="55dp"
android:layout_width="55dp"
android:button="#null"
android:background="#drawable/def_checktab_news"/>
.....etc....your tabs......
</RadioGroup>
</RelativeLayout>
</HorizontalScrollView>
</com.example.WrappingSlidingDrawer>
</RelativeLayout>
</TabHost>
What you have to do in code now:
#Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.main_tab_layout);
setTabs();
RadioGroup tabs = (RadioGroup) findViewById(R.id.custom_tabs);
tabs.setOnCheckedChangeListener(new OnCheckedChangeListener() {
#Override
public void onCheckedChanged(RadioGroup group, int checkedId) {
switch (checkedId) {
case R.id.tab_overview:
getTabHost().setCurrentTab(0);
break;
case R.id.tab_news:
getTabHost().setCurrentTab(1);
break;
....etc.....
}
}
});
}
/**
* Delegate tab creation and adding.
*/
private void setTabs() {
// add the necessary tabs
addTab(R.string.tab_overv_tag, OverviewActivityGroup.class);
addTab(R.string.tab_news_tag, NewsActivityGroup.class);
.....etc.....
}
/**
* Create a tab with an Activity and add it to the TabHost
*
* #param tagId
* resource id of the string representing the tag for finding the tab
* #param activity
* the activity to be added
*/
private void addTab(int tagId, Class<? extends ActivityGroup> activity) {
// create an Intent to launch an Activity for the tab (to be reused)
Intent intent = new Intent().setClass(this, activity);
// initialize a TabSpec for each tab and add it to the TabHost
TabHost.TabSpec spec = usedTabHost.newTabSpec(getString(tagId));
// use layout inflater to get a view of the tab to be added
View tabIndicator = getLayoutInflater().inflate(R.layout.tab_indicator, getTabWidget(), false);
spec.setIndicator(tabIndicator);
spec.setContent(intent);
usedTabHost.addTab(spec);
}
The whole indicator stuff is not needed btw.^^ In your ActivityGroups you have to set the appropriate Activities, etc. You know the stuff.
You can use anything for your navigation and can still use the advantages of a TabHost. Just don't bother with that TabWidget anymore. ;)
After some research I think the best option would be to use ActionBar's tabbed interface since it looks much more easier to style. The ActionBarSherlock provides compatibility layer for ActionBar for devices starting from Android 1.6. Here you can look at examples on what you can get using the library.
In iPhone we can create a view that has a tab bar and make it the root view of the application then use the tab bar to navigate through sub views.
what is the most close approach to this in Android?
Is it to use a Tabbed Control? but this includes using just one activity.
what is the approach to use in Android to create an activity with a navigation control to other activities in a way similar to that of the iPhone?
There's a tutorial for creating a "Tab Layout" on the android dev site:
You can implement your tab content in
one of two ways: use the tabs to swap
Views within the same Activity, or use
the tabs to change between entirely
separate activities
(source: android.com)
Sorry, I really don't know the iPhone, but may a QuickAction Dialog help you??
http://www.londatiga.net/it/how-to-create-quickaction-dialog-in-android/
I imagine a list of some activities in that dialog.
I hope this is close to what you want.
There are a couple of examples around
http://www.anddev.org/code-snippets-for-android-f33/iphone-tabs-for-android-t14678.html
This one is scrollable
http://code.google.com/p/mobyfactory-uiwidgets-android/
<?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:layout_marginBottom="0dp"
>
<FrameLayout
android:id="#android:id/tabcontent"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
/>
<TabWidget
android:id="#android:id/tabs"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_weight="0"
/>
</LinearLayout>
</TabHost>