ViewPager+Fragment 选项卡

原创 2015年07月06日 17:19:32

总结了之前用的Fragment+ViewPager,做的选项卡功能,今天做个Demo.

Demo下载:http://download.csdn.net/detail/hello_12413/8873827

效果如图所示:



主要代码如下所示:

package com.example.viewpagerdemo;

import java.util.ArrayList;
import java.util.List;

import android.graphics.BitmapFactory;
import android.graphics.Matrix;
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.support.v4.view.ViewPager;
import android.support.v4.view.ViewPager.OnPageChangeListener;
import android.util.DisplayMetrics;
import android.view.View;
import android.view.View.OnClickListener;
import android.view.animation.Animation;
import android.view.animation.TranslateAnimation;
import android.widget.ImageView;
import android.widget.TextView;

import com.example.viewpagerdemo.fragment.AppListFragment;
import com.example.viewpagerdemo.fragment.BaseFragment;
import com.example.viewpagerdemo.fragment.LuckFragment;
import com.example.viewpagerdemo.fragment.MainFragment;
import com.example.viewpagerdemo.fragment.PersonFragment;

public class MainActivity extends FragmentActivity implements OnClickListener {

	private ViewPager pager;
	private List<Fragment> list;
	private ImageView img1, img2, img3, img4;
	private TextView header_title;
	private ImageView imageView;
	private int offset = 0;
	private int currIndex = 0;
	private int bmpW;
	private BaseFragment mainFragment, appListFragment, personFragment, webFragment;
	private MyAdapter adapter;

	@Override
	protected void onCreate(Bundle savedInstanceState) {
		super.onCreate(savedInstanceState);
		setContentView(R.layout.activity_main);
		init();
	}

	void init() {
		pager = (ViewPager) findViewById(R.id.vPager);
		img1 = (ImageView) findViewById(R.id.img1);
		img2 = (ImageView) findViewById(R.id.img2);
		img3 = (ImageView) findViewById(R.id.img3);
		img4 = (ImageView) findViewById(R.id.img4);
		header_title = (TextView) findViewById(R.id.header_title);
		img1.setOnClickListener(this);
		img2.setOnClickListener(this);
		img3.setOnClickListener(this);
		img4.setOnClickListener(this);
		adapter = new MyAdapter(getSupportFragmentManager());
		mainFragment = new MainFragment();
		appListFragment = new AppListFragment();
		personFragment = new PersonFragment();
		webFragment = new LuckFragment();
		InitImageView();
		list = new ArrayList<Fragment>();
		list.add(mainFragment);
		list.add(appListFragment);
		list.add(personFragment);
		list.add(webFragment);
		pager.setAdapter(adapter);
		pager.setCurrentItem(0);
		changeTitle(0);
		pager.setOnPageChangeListener(new MyOnPageChangeListener());
	}

	// 设置标题
	private void changeTitle(int pagerId) {
		switch (pagerId) {
		case 0:
			header_title.setText(R.string.index);
			break;
		case 1:
			header_title.setText(R.string.list);
			break;
		case 2:
			header_title.setText(R.string.center);
			break;
		case 3:
			header_title.setText(R.string.luck);
			break;

		default:
			break;
		}

	}
	//初始化活动图片
	private void InitImageView() {
		imageView = (ImageView) findViewById(R.id.cursor);
		bmpW = BitmapFactory.decodeResource(getResources(), R.drawable.below_img).getWidth();
		DisplayMetrics dm = new DisplayMetrics();
		getWindowManager().getDefaultDisplay().getMetrics(dm);
		int screenW = dm.widthPixels;
		offset = (screenW / 4 - bmpW) / 2;
		Matrix matrix = new Matrix();
		matrix.postTranslate(offset, 0);
		imageView.setImageMatrix(matrix);
	}

	// Viewpager Adapter
	class MyAdapter extends FragmentPagerAdapter {

		public MyAdapter(FragmentManager fm) {
			super(fm);
		}

		@Override
		public int getItemPosition(Object object) {
			return POSITION_NONE;
		}

		@Override
		public Fragment getItem(int arg0) {
			return list.get(arg0);
		}

		@Override
		public int getCount() {
			return list.size();
		}

	}

	// ViewPager 变化监听
	public class MyOnPageChangeListener implements OnPageChangeListener {
		int one = offset * 2 + bmpW;

		public void onPageScrollStateChanged(int arg0) {

		}

		public void onPageScrolled(int arg0, float arg1, int arg2) {

		}
		//每次翻页,移动标记图片
		public void onPageSelected(int arg0) {
			Animation animation = new TranslateAnimation(one * currIndex, one * arg0, 0, 0);
			currIndex = arg0;
			changeTitle(arg0);
			animation.setFillAfter(true);// True
			animation.setDuration(300);
			imageView.startAnimation(animation);
		}

	}

	@Override
	public void onClick(View v) {
		switch (v.getId()) {
		case R.id.img1:
			pager.setCurrentItem(0);
			break;
		case R.id.img2:
			pager.setCurrentItem(1);
			break;
		case R.id.img3:
			pager.setCurrentItem(2);
			break;
		case R.id.img4:
			pager.setCurrentItem(3);
			break;

		default:
			break;
		}
	}
}



ViewPager+RadioGroup+Fragment实现选项卡

  • 2016年05月24日 21:21
  • 7.81MB
  • 下载

ViewPager+Fragment 选项卡

  • 2015年07月06日 17:16
  • 652KB
  • 下载

Android自定义Tab选项卡4行代码完成调用(Fragment+ViewPager组合)

版权声明:本文为博主原创文章,未经博主允许不得转载。 一、前言      恰逢周末刚好可以抽点时间整理项目中的自定义控件。这个星期打算先从tab选项卡入手,将以前用到的Fragment,ViewP...

ViewPager+RadioGroup+Fragment实现选项卡

选项卡的实现方式有很多种,我推荐一种简单的

Android自定义Tab选项卡4行代码完成调用(Fragment+ViewPager组合)

一、前言      恰逢周末刚好可以抽点时间整理项目中的自定义控件。这个星期打算先从tab选项卡入手,将以前用到的Fragment,ViewPager,ImageView,TextView,Relat...

ViewPager fragment android tab选项卡的使用

MainActivity.javapublic class MainActivity extends Activity implements View.OnClickListener, ViewPag...

使用ViewPager+Fragment实现选项卡切换效果

显示效果: 实现过程: 1.创建3个选项卡中的内容,即三个Fragment。 这里仅贴出其中一个: Tab2: [java] view plaincopy pa...

使用ViewPager+Fragment实现选项卡切换效果

原文   http://blog.csdn.net/chdjj/article/details/21564503 主题 ViewPager 显示效果:   实现过程: 1.创建3个选项...
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:ViewPager+Fragment 选项卡
举报原因:
原因补充:

(最多只允许输入30个字)