通过JazzyViewPager来实现Fragment页面间的动画切效果

时间:2023-03-09 08:38:27
通过JazzyViewPager来实现Fragment页面间的动画切效果

JazzyViewPager 开源项目地址:

https://github.com/jfeinstein10/JazzyViewPager

其实实现它还是蛮简单的,有两个关键点,一是使用扩展FragmentPagerAdapter,二是重写instantiateItem,isViewFromObject这两个方法,如果仅仅扩展FragmentPagerAdapter的话,动画效果则会不起作用。

布局文件如下:

<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/tabPage"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"> <com.jfeinstein.jazzyviewpager.JazzyViewPager
android:id="@+id/jazzy_pager"
android:layout_width="match_parent"
android:layout_weight="1"
android:layout_height="0dp"> </com.jfeinstein.jazzyviewpager.JazzyViewPager> <TextView
android:background="@color/bg_silver"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="this is the TabFragmentActivity\nTAB will be here." />
</LinearLayout>

Java代码如下:

package org.csware.ee.demo;

import android.os.Bundle;
import android.support.v4.app.Fragment;
import android.support.v4.app.FragmentActivity;
import android.support.v4.app.FragmentManager;
import android.support.v4.app.FragmentPagerAdapter;
import android.view.View;
import android.view.ViewGroup;
import android.widget.LinearLayout; import com.jfeinstein.jazzyviewpager.JazzyViewPager; import org.csware.ee.demo.fragment.FourFragment;
import org.csware.ee.demo.fragment.OneFragment;
import org.csware.ee.demo.fragment.ThreeFragment;
import org.csware.ee.demo.fragment.TwoFragment; public class TabFragmentActivity extends FragmentActivity { final static String TAG = "TabFragmentActivity"; @Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_tab_fragment); init();
} private JazzyViewPager mJazzy;
LinearLayout tabPage;
FragmentActivity activity; void init() {
activity = this; tabPage = (LinearLayout) findViewById(R.id.tabPage); setupJazziness(JazzyViewPager.TransitionEffect.Standard);
} void setupJazziness(JazzyViewPager.TransitionEffect effect) {
mJazzy = (JazzyViewPager) findViewById(R.id.jazzy_pager);
mJazzy.setTransitionEffect(effect);
//mJazzy.setAdapter(new MainAdapter());
mJazzy.setAdapter(new TabFragmentAdapter(getSupportFragmentManager()));
//mJazzy.setPageMargin(30);
// mJazzy.setOutlineEnabled(true); } /**
* 适配器
*/
class TabFragmentAdapter extends FragmentPagerAdapter { public TabFragmentAdapter(FragmentManager fragmentManager) {
super(fragmentManager);
} Fragment[] pages = new Fragment[]{
new OneFragment(),
new TwoFragment(),
new ThreeFragment(),
new FourFragment()
}; @Override
public Fragment getItem(int position) {
return pages[position];
} @Override
public int getCount() {
return pages.length;
} //**************加上下面的两行即可实现换页时的动画效果*********************************// @Override
public Object instantiateItem(ViewGroup container, int position) {
Object obj = super.instantiateItem(container, position);
mJazzy.setObjectForPosition(obj, position);
return obj;
} @Override
public boolean isViewFromObject(View view, Object object) {
if (object != null) {
return ((Fragment) object).getView() == view;
} else {
return false;
}
}
} }

至于4个Fragment,就不贴了。