问题描述:

I am working on an Android app. Our designer has the idea that we need a paging control looks like Etsy iPhone. (See the image below)

Basically you can swipe on the grey title bar or the content to switch screen.

Is there any existing 3rd party control does this?

网友答案:

I would recommend you to use Jake Whartons ViewPageIndicator(or just a normal ViewPager):

Create a Fragment for every of your Layouts and set the layout to your Fragment with the onCreateView() methode inside your fragment(only if you want to have different layouts. If you have the same Layout but just different data, you can just use one Fragment and pass the data in the getItem() methode)

@Override
    public View onCreateView(LayoutInflater inflater, ViewGroup container, 
        Bundle savedInstanceState) {

        return inflater.inflate(R.layout.layout, container, false);
    }

Now create a FragmentPagerAdapter there sould be a methode called getItem(). Switch the Position and set it to your Fragment:

@Override
            public Fragment getItem(int position) {
                switch(position){
                case 0:
                    TestFragment fragment = new TestFragment();  

                    return fragment;

                case 1:
                            TestFragment2 fragment2 = new TestFragment2();  
                    return fragment2;

                }

                return defaultFragment fragment3 = new defaultFragment();  
                    return fragment3;
            }

Now you should be able to swipe to your Layouts(Fragments) easily

网友答案:

You need to use the ViewPager widget. Check out the Android developer blog to get an idea about how it works: Horizontal View Swiping with ViewPager.

If you need backwards compatibility with Android 2.x, check out the Android Compatibility Library.

All explained there: Implement Horizontal Paging (Swipe Views)

Some code from that page:

public class CollectionDemoActivity extends FragmentActivity {
    // When requested, this adapter returns a DemoObjectFragment,
    // representing an object in the collection.
    DemoCollectionPagerAdapter mDemoCollectionPagerAdapter;
    ViewPager mViewPager;

    public void onCreate(Bundle savedInstanceState) {
        // ViewPager and its adapters use support library
        // fragments, so use getSupportFragmentManager.
        mDemoCollectionPagerAdapter =
                new DemoCollectionPagerAdapter(
                        getSupportFragmentManager());
        mViewPager = (ViewPager) findViewById(R.id.pager);
        mViewPager.setAdapter(mDemoCollectionPagerAdapter);
    }
}

// Since this is an object collection, use a FragmentStatePagerAdapter,
// and NOT a FragmentPagerAdapter.
public class DemoCollectionPagerAdapter extends
        FragmentStatePagerAdapter {
    public DemoCollectionPagerAdapter(FragmentManager fm) {
        super(fm);
    }

    @Override
    public Fragment getItem(int i) {
        Fragment fragment = new DemoObjectFragment();
        Bundle args = new Bundle();
        // Our object is just an integer :-P
        args.putInt(DemoObjectFragment.ARG_OBJECT, i + 1);
        fragment.setArguments(args);
        return fragment;
    }

    @Override
    public int getCount() {
        return 100;
    }

    @Override
    public CharSequence getPageTitle(int position) {
        return "OBJECT " + (position + 1);
    }
}

// Instances of this class are fragments representing a single
// object in our collection.
public static class DemoObjectFragment extends Fragment {
    public static final String ARG_OBJECT = "object";

    @Override
    public View onCreateView(LayoutInflater inflater,
            ViewGroup container, Bundle savedInstanceState) {
        // The last two arguments ensure LayoutParams are inflated
        // properly.
        View rootView = inflater.inflate(
                R.layout.fragment_collection_object, container, false);
        Bundle args = getArguments();
        ((TextView) rootView.findViewById(android.R.id.text1)).setText(
                Integer.toString(args.getInt(ARG_OBJECT)));
        return rootView;
    }
}


<android.support.v4.view.ViewPager
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/pager"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <android.support.v4.view.PagerTitleStrip
        android:id="@+id/pager_title_strip"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_gravity="top"
        android:background="#33b5e5"
        android:textColor="#fff"
        android:paddingTop="4dp"
        android:paddingBottom="4dp" />

</android.support.v4.view.ViewPager>
相关阅读:
Top