问题
I want to make a layout similar to this picture given below:
What I have tried so for is
- Included Sherlock library
- included Viewpage Indicator Library
- Created project using "Fixed Tabs + swipe navigation type"
- tested up to android 2.1 froyo to 4.4 kitkat without any crash
Now work to do
As you can see in the above image I want 3 action-bar tabs + Overview
tab should contain 4 other screens with certain views. they should change in on swipe event
And all other tabs should contain a single separate fragment in it.
回答1:
Well I have done it. Yeahhhssss :P
Ohk here what i done
Here is my MainActivity extendind SherlockFragmentActivity
import java.util.ArrayList;
import android.content.Intent;
import android.os.Bundle;
import android.support.v4.app.FragmentTransaction;
import com.actionbarsherlock.app.ActionBar;
import com.actionbarsherlock.app.ActionBar.Tab;
import com.actionbarsherlock.app.SherlockFragment;
import com.actionbarsherlock.app.SherlockFragmentActivity;
import com.actionbarsherlock.view.Menu;
public class MainActivity extends SherlockFragmentActivity {
private ArrayList<Class> classes = new ArrayList<Class>();
@SuppressWarnings("unchecked")
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
classes.add(OverView.class);
classes.add(LifeStyle.class);
classes.add(RealState.class);
// Set up the action bar.
final com.actionbarsherlock.app.ActionBar actionBar = getSupportActionBar();
actionBar.setDisplayShowHomeEnabled(false);
actionBar.setDisplayShowTitleEnabled(false);
Tab tab = null;
for (int i = 0; i < classes.size(); i++) {
tab = actionBar
.newTab()
.setText(
getResources().getStringArray(R.array.tabs_names)[i])
.setTabListener(
new TabListener<SherlockFragment>(this, "Tab" + i,
(Class<SherlockFragment>) classes.get(i)));
actionBar.addTab(tab);
}
actionBar.setNavigationMode(ActionBar.NAVIGATION_MODE_TABS);
}
@Override
public boolean onCreateOptionsMenu(Menu menu) {
// Inflate the menu; this adds items to the action bar if it is present.
getSupportMenuInflater().inflate(R.menu.main, menu);
return true;
}
public static class TabListener<T extends SherlockFragment> implements
ActionBar.TabListener {
private SherlockFragment mFragment;
private final SherlockFragmentActivity mActivity;
private final String mTag;
private final Class<T> mClass;
/**
* Constructor used each time a new tab is created.
*
* @param activity
* The host Activity, used to instantiate the fragment
* @param tag
* The identifier tag for the fragment
* @param clz
* The fragment's Class, used to instantiate the fragment
*/
public TabListener(SherlockFragmentActivity activity, String tag,
Class<T> clz) {
mActivity = activity;
mTag = tag;
mClass = clz;
}
/* The following are each of the ActionBar.TabListener callbacks */
public void onTabSelected(Tab tab, FragmentTransaction ft) {
// Check if the fragment is already initialized
if (mFragment == null) {
// If not, instantiate and add it to the activity
mFragment = (SherlockFragment) SherlockFragment.instantiate(
mActivity, mClass.getName());
ft.add(android.R.id.content, mFragment, mTag);
} else {
// If it exists, simply attach it in order to show it
ft.attach(mFragment);
}
}
public void onTabUnselected(Tab tab, FragmentTransaction ft) {
if (mFragment != null) {
// Detach the fragment, because another one is being attached
ft.detach(mFragment);
}
}
public void onTabReselected(Tab tab, FragmentTransaction ft) {
// User selected the already selected tab. Usually do nothing.
}
}
}
this will set my 3 tabs on the actionbar.
now the second proplem is showing multiple fragments in first tabs and showing the page indicator. I have achieved this using the view pager and view page indicator.
here is my overview.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="match_parent"
android:orientation="vertical" >
<android.support.v4.view.ViewPager
android:id="@+id/view_pager"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1" />
<com.viewpagerindicator.CirclePageIndicator
android:id="@+id/indicator"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:background="#000000"
android:padding="10dip" />
</LinearLayout>
and here is my Overview.java file which inflates the above xml file like this
import android.content.Context;
import android.os.Bundle;
import android.support.v4.view.PagerAdapter;
import android.support.v4.view.ViewPager;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import com.actionbarsherlock.app.SherlockFragment;
import com.viewpagerindicator.CirclePageIndicator;
public class OverView extends SherlockFragment {
@Override
public View onCreateView(LayoutInflater inflater, ViewGroup container,
Bundle savedInstanceState) {
View rootView = inflater.inflate(R.layout.overview_fragment, container, false);
MyPagerAdapter adapter = new MyPagerAdapter();
ViewPager myPager = (ViewPager) rootView.findViewById(R.id.view_pager);
myPager.setAdapter(adapter);
myPager.setCurrentItem(0);
CirclePageIndicator indicator = (CirclePageIndicator) rootView
.findViewById(R.id.indicator);
indicator.setViewPager(myPager);
return rootView;
}
private class MyPagerAdapter extends PagerAdapter {
@Override
public int getCount() {
return 4;
}
@Override
public Object instantiateItem(View collection, int position) {
LayoutInflater inflater = (LayoutInflater) collection.getContext()
.getSystemService(Context.LAYOUT_INFLATER_SERVICE);
View view = null;
switch (position) {
case 0:
view = inflater.inflate(R.layout.overview_1st, null);
break;
case 1:
view = inflater.inflate(R.layout.overview_2nd, null);
break;
case 2:
view = inflater.inflate(R.layout.overview_3rd, null);
break;
default:
view = inflater.inflate(R.layout.overview_3rd, null);
break;
}
((ViewPager) collection).addView(view, 0);
return view;
}
@Override
public void destroyItem(View arg0, int arg1, Object arg2) {
((ViewPager) arg0).removeView((View) arg2);
}
@Override
public boolean isViewFromObject(View arg0, Object arg1) {
return arg0 == ((View) arg1);
}
}
}
and here is the output
also make sure you have inluded the libraries
来源:https://stackoverflow.com/questions/20704277/android-layout-actionbarsherlock-tabs-viewpagerindicator-on-1st-tab