viewpager + fragment实现动画效果

来源:互联网 发布:怎么看淘宝店家电话 编辑:程序博客网 时间:2024/06/05 08:15
首先把布置ViewPager的界面:
<?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:background="@color/white"    android:orientation="vertical" >       <include        android:id="@+id/headLayout"        layout="@layout/head" />    <LinearLayout        android:layout_width="match_parent"        android:layout_height="@dimen/bbsmore_title"        android:background="@color/white"        android:orientation="horizontal" >        <TextView            android:id="@+id/morebbs_all_tv"            style="@style/bbsmoreactivity_tv"            android:layout_width="match_parent"            android:layout_height="wrap_content"            android:layout_gravity="center_vertical"            android:layout_weight="1"            android:gravity="center"            android:text="@string/samall_common" />        <TextView            android:id="@+id/morebbs_Focus_tv"            style="@style/bbsmoreactivity_tv"            android:layout_width="match_parent"            android:layout_height="wrap_content"            android:layout_gravity="center_vertical"            android:layout_weight="1"            android:gravity="center"            android:text="@string/samall_private" />    </LinearLayout>    <LinearLayout        android:layout_width="fill_parent"        android:layout_height="4dp"        android:background="@color/cursor_bg" >        <ImageView            android:id="@+id/morebbs_cursor_imag"            android:layout_width="180dp"            android:layout_height="wrap_content"            android:background="@drawable/bbs_tab_line_bg" />    </LinearLayout>    <android.support.v4.view.ViewPager        android:id="@+id/samll_Pager"        android:layout_width="wrap_content"        android:layout_height="match_parent"        android:layout_gravity="center"        android:background="#ffffff"        android:flipInterval="30"        android:persistentDrawingCache="animation" /></LinearLayout>


然后创建主活动EssentialAreasActivity:

public class EssentialAreasActivity extends FragmentActivity implementsOnClickListener {//碎片一CommonActivity commonActivity;//碎片二PrivateActivity privateActivity;//页卡内容private ViewPager mPager;// Tab页面列表private ArrayList<Fragment> listViews;// 页卡左头标private TextView publicTextView;// 页卡左头标private TextView privateTextView;// 当前页卡编号private int currIndex;private String mColor = "#0066cc";public int page = 0;// 动画图片private ImageView mindexImage;private int displayWidth;private int displayHeight;private int width;@Overrideprotected void onCreate(Bundle savedInstanceState) {// TODO Auto-generated method stubsuper.onCreate(savedInstanceState);setContentView(R.layout.small_yellow_pages_activity);InitView();InitViewPaper();}//初始化ViewPagerprivate void InitViewPaper() {mPager = (ViewPager) findViewById(R.id.samll_Pager);listViews = new ArrayList<Fragment>();listViews.add(new CommonActivity(this));listViews.add(new PrivateActivity());mPager.setAdapter(new MyPagerAdapter(getSupportFragmentManager()));mPager.setCurrentItem(0);page = 1;mPager.setOnPageChangeListener(new MyOnPageChangeListener());}//ViewPager适配器public class MyPagerAdapter extends FragmentPagerAdapter {public MyPagerAdapter(FragmentManager fm) {super(fm);}@Overridepublic Fragment getItem(int position) {return listViews.get(position);}@Overridepublic int getCount() {return listViews.size();}@Overridepublic CharSequence getPageTitle(int position) {return null;}}/**** 页卡切换监听 */public class MyOnPageChangeListener implements OnPageChangeListener {@Overridepublic void onPageScrollStateChanged(int arg0) {}@Overridepublic void onPageScrolled(int arg0, float arg1, int arg2) {}@Overridepublic void onPageSelected(int arg0) {Animation animation = null;publicTextView.setTextColor(Color.parseColor("#000000"));privateTextView.setTextColor(Color.parseColor("#000000"));switch (arg0) {case 0:animation = mineonPageSelected(publicTextView, 0, currIndex,animation);page = 1;break;case 1:animation = mineonPageSelected(privateTextView, width, currIndex, animation);page = 2;break;}currIndex = arg0;animation.setFillAfter(true);// True:图片停在动画结束位置animation.setDuration(300);mindexImage.startAnimation(animation);}public Animation mineonPageSelected(TextView tchange, int toXDelta,int currIndex, Animation animation) {tchange.setTextColor(Color.parseColor(mColor));if (currIndex == 0) {animation = new TranslateAnimation(0, toXDelta, 0, 0);} else if (currIndex == 1) {animation = new TranslateAnimation(width, toXDelta, 0, 0);}return animation;}}@Overridepublic void onClick(View v) {switch (v.getId()) {case R.id.morebbs_all_tv:mPager.setCurrentItem(0);break;case R.id.morebbs_Focus_tv:mPager.setCurrentItem(1);break;default:break;}}private void InitView() {Display currDisplay = getWindowManager().getDefaultDisplay();// 获取屏幕当前分辨率displayWidth = currDisplay.getWidth();displayHeight = currDisplay.getHeight();width = displayWidth / 2;publicTextView = (TextView) findViewById(R.id.morebbs_all_tv);privateTextView = (TextView) findViewById(R.id.morebbs_Focus_tv);mindexImage = (ImageView) findViewById(R.id.morebbs_cursor_imag);publicTextView.setOnClickListener(this);privateTextView.setOnClickListener(this);}}

这样就完成了滑动切换碎片以及动画效果。

0 0
原创粉丝点击