首页 > 代码库 > 实用的viewpager模板
实用的viewpager模板
这是一个简单的效果图:
主要布局文件有:
最主要的是:
/客户端/res/layout/activity_main.xml,其他的布局自己安排就可以了
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:tools="http://schemas.android.com/tools" android:id="@+id/container" android:layout_width="match_parent" android:layout_height="match_parent" android:orientation="vertical" > <RelativeLayout android:id="@+id/topBar" android:layout_width="fill_parent" android:layout_height="wrap_content" android:background="@drawable/bg_topbar" > <ImageButton android:id="@+id/back" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_alignParentLeft="true" android:layout_centerVertical="true" android:src="@drawable/back" /> <ImageButton android:id="@+id/mark" android:layout_width="28dp" android:layout_height="28dp" android:layout_alignParentRight="true" android:layout_centerVertical="true" android:layout_marginRight="10dp" android:background="@drawable/mark" /> <TextView android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_centerInParent="true" android:text="@string/app_name" android:textColor="#ffffffff" android:textSize="18sp" /> </RelativeLayout> <LinearLayout android:layout_width="fill_parent" android:layout_height="wrap_content" android:background="#ffeeeeee" > <TextView android:id="@+id/tvTag1" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_weight="1" android:gravity="center" android:text="首页" android:textColor="#ff000000" android:textSize="20sp" /> <TextView android:id="@+id/tvTag2" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_weight="1" android:gravity="center" android:text="商品" android:textColor="#ff000000" android:textSize="20sp" /> <TextView android:id="@+id/tvTag3" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_weight="1" android:gravity="center" android:text="评论" android:textColor="#ff000000" android:textSize="20sp" /> </LinearLayout> <ImageView android:id="@+id/ivCursor" android:layout_width="fill_parent" android:layout_height="wrap_content" android:scaleType="matrix" android:src="@drawable/cursor" /> <android.support.v4.view.ViewPager android:id="@+id/vpViewPager1" android:layout_width="fill_parent" android:layout_height="fill_parent" > </android.support.v4.view.ViewPager> </LinearLayout>
public class MainActivity extends Activity implements OnClickListener { private ViewPager vpViewPager = null; private List<View> views = null; private int offset; // 间隔 private int cursorWidth; // 游标的长度 private int originalIndex = 0; private ImageView cursor = null; private ImageButton mark = null; private ImageButton back = null; private Animation animation = null; private boolean IsMark=false; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); requestWindowFeature(Window.FEATURE_NO_TITLE); setContentView(R.layout.activity_main); ((ImageButton) findViewById(R.id.back)).setOnClickListener(this); ((ImageButton) findViewById(R.id.mark)).setOnClickListener(this); mark = (ImageButton) findViewById(R.id.mark); back = (ImageButton) findViewById(R.id.back); ((TextView) findViewById(R.id.tvTag1)).setOnClickListener(this); ((TextView) findViewById(R.id.tvTag2)).setOnClickListener(this); ((TextView) findViewById(R.id.tvTag3)).setOnClickListener(this); views = new ArrayList<View>(); views.add(LayoutInflater.from(this).inflate(R.layout.index_fragment, null)); views.add(LayoutInflater.from(this).inflate(R.layout.goods_fragment, null)); views.add(LayoutInflater.from(this).inflate(R.layout.comment_fragment, null)); vpViewPager = (ViewPager) findViewById(R.id.vpViewPager1); vpViewPager.setAdapter(new MyPagerAdapter(views)); vpViewPager.setOnPageChangeListener(new MyOnPageChangeListener()); initCursor(views.size()); MyPagerAdapter myPagerAdapter = (MyPagerAdapter) vpViewPager .getAdapter(); View v1 = myPagerAdapter.getItemAtPosition(0); View v2 = myPagerAdapter.getItemAtPosition(1); View v3 = myPagerAdapter.getItemAtPosition(2); @Override public void onClick(View v) { switch (v.getId()) { case R.id.tvTag1: vpViewPager.setCurrentItem(0); break; case R.id.tvTag2: vpViewPager.setCurrentItem(1); break; case R.id.tvTag3: vpViewPager.setCurrentItem(2); break; case R.id.back: break; case R.id.mark: if(IsMark==false){ mark.setImageResource(R.drawable.mark_success); Toast.makeText(this, "收藏成功", 0).show(); IsMark=true; } break; } } /** * 根据tag的数量初始化游标的位置 * * @param tagNum */ public void initCursor(int tagNum) { cursorWidth = BitmapFactory.decodeResource(getResources(), R.drawable.cursor).getWidth(); DisplayMetrics dm = new DisplayMetrics(); getWindowManager().getDefaultDisplay().getMetrics(dm); offset = ((dm.widthPixels / tagNum) - cursorWidth) / 2; cursor = (ImageView) findViewById(R.id.ivCursor); Matrix matrix = new Matrix(); matrix.setTranslate(offset, 0); cursor.setImageMatrix(matrix); } class MyOnPageChangeListener implements OnPageChangeListener { @Override public void onPageSelected(int arg0) { int one = 2 * offset + cursorWidth; int two = one * 2; switch (originalIndex) { case 0: if (arg0 == 1) { animation = new TranslateAnimation(0, one, 0, 0); } if (arg0 == 2) { animation = new TranslateAnimation(0, two, 0, 0); } break; case 1: if (arg0 == 0) { animation = new TranslateAnimation(one, 0, 0, 0); } if (arg0 == 2) { animation = new TranslateAnimation(one, two, 0, 0); } break; case 2: if (arg0 == 1) { animation = new TranslateAnimation(two, one, 0, 0); } if (arg0 == 0) { animation = new TranslateAnimation(two, 0, 0, 0); } break; } animation.setFillAfter(true); animation.setDuration(300); cursor.startAnimation(animation); originalIndex = arg0; } @Override public void onPageScrolled(int arg0, float arg1, int arg2) { } @Override public void onPageScrollStateChanged(int arg0) { } } }
public class MyPagerAdapter extends PagerAdapter { private List<View> views; public MyPagerAdapter(List<View> views) { this.views = views; } @Override public int getCount() { return views.size(); } @Override public boolean isViewFromObject(View arg0, Object arg1) { return arg0 == arg1; } @Override public void destroyItem(View container, int position, Object object) { // 将指定的view从viewPager中移除 ((ViewPager) container).removeView(views.get(position)); } @Override public Object instantiateItem(View container, int position) { // 将view添加到viewPager中 ((ViewPager) container).addView(views.get(position)); return views.get(position); } public View getItemAtPosition(int position) { return views.get(position); } }
虽然是个小Demo,但是如果需要可以找我要全部源码。
来自为知笔记(Wiz)
声明:以上内容来自用户投稿及互联网公开渠道收集整理发布,本网站不拥有所有权,未作人工编辑处理,也不承担相关法律责任,若内容有误或涉及侵权可进行投诉: 投诉/举报 工作人员会在5个工作日内联系你,一经查实,本站将立刻删除涉嫌侵权内容。