1. 程式人生 > >android viewpager 滑動分頁以及禁止劃屏 (模擬新浪)

android viewpager 滑動分頁以及禁止劃屏 (模擬新浪)

    這一篇將之加工一下,模擬實現新浪裡面的功能,vierpager 分頁.

    在新浪微博訊息一欄中是這樣的(注意看title):

                

上部分頁欄可以用gridview來實現,不過為了省事在這就用textview代替了.

 貼出程式碼:

/***
 * ViewPager
 * 
 * @author zhangjia
 * 
 */
public class MainActivity extends ActivityGroup implements OnClickListener {
	private LinearLayout layout;// title
	private ViewPager pager;
	private ArrayList<View> pageViews;
	private LinearLayout layout2;
	private ArrayList<ImageView> imageViews;
	private LinearLayout linearLayout;
	private String title[] = { "one", "two", "three" };
	private TextView textView;
	private ArrayList<View> arrayList;// 用於裝載view
	private final int linerlayout_height = 80;

	/***
	 * init title and pageview
	 */
	void Init() {
		arrayList = new ArrayList<View>();
		// 獲取螢幕寬度
		int width = getWindowManager().getDefaultDisplay().getWidth()
				/ title.length;
		for (int i = 0; i < title.length; i++) {
			textView = new TextView(this);
			textView.setText(title[i]);
			textView.setWidth(width);
			textView.setHeight(linerlayout_height - 10);
			textView.setTextSize(20);
			textView.setTextColor(color.black);
			textView.setGravity(Gravity.CENTER);
			textView.setId(i);
			textView.setPadding(5, 5, 5, 5);
			textView.setOnClickListener(this);
			linearLayout.addView(textView);
			arrayList.add(textView);
		}

		pageViews = new ArrayList<View>();
		View view00 = getLocalActivityManager().startActivity("activity01",
				new Intent(this, NullActivity.class)).getDecorView();
		View view01 = getLocalActivityManager().startActivity("activity01",
				new Intent(this, MainActivity1.class)).getDecorView();
		View view02 = getLocalActivityManager().startActivity("activity02",
				new Intent(this, MainActivity2.class)).getDecorView();
		View view03 = getLocalActivityManager().startActivity("activity02",
				new Intent(this, MainActivity3.class)).getDecorView();
		View view04 = getLocalActivityManager().startActivity("activity01",
				new Intent(this, NullActivity.class)).getDecorView();
		pageViews.add(view00);
		pageViews.add(view01);
		pageViews.add(view02);
		pageViews.add(view03);
		pageViews.add(view04);
	}

	void Init_Point() {
		imageViews = new ArrayList<ImageView>();
		ImageView imageView;
		for (int i = 0; i < pageViews.size(); i++) {
			imageView = new ImageView(this);
			imageView.setLayoutParams(new LayoutParams(5, 5));
			imageView.setBackgroundResource(R.drawable.d1);
			LinearLayout.LayoutParams layoutParams = new LinearLayout.LayoutParams(
					new ViewGroup.LayoutParams(LayoutParams.WRAP_CONTENT,
							LayoutParams.WRAP_CONTENT));
			layoutParams.leftMargin = 20;
			layoutParams.rightMargin = 20;
			layout2.addView(imageView, layoutParams);
			// 第一個和最後一個讓她消失
			if (i == 0 || i == pageViews.size() - 1) {
				imageView.setVisibility(View.GONE);
			}
			if (i == 1) {
				imageView.setBackgroundResource(R.drawable.d2);
			}
			imageViews.add(imageView);

		}
	}

	public void draw_Point(int index) {
		for (int i = 1; i < imageViews.size(); i++) {

			if (index == i) {
				imageViews.get(i).setBackgroundResource(R.drawable.d2);
			} else
				imageViews.get(i).setBackgroundResource(R.drawable.d1);

		}

	}

	@Override
	protected void onCreate(Bundle savedInstanceState) {
		super.onCreate(savedInstanceState);
		setTitle("jjhappyforever...");
		setContentView(R.layout.main);
		pager = (ViewPager) findViewById(R.id.vp_contains);
		layout2 = (LinearLayout) findViewById(R.id.iv_image);
		linearLayout = (LinearLayout) findViewById(R.id.mian);
		// 建立linerlayout的大小
		LinearLayout.LayoutParams layoutParams = new LinearLayout.LayoutParams(
				new ViewGroup.LayoutParams(LayoutParams.WRAP_CONTENT,
						LayoutParams.FILL_PARENT));
		layoutParams.height = linerlayout_height;
		linearLayout.setLayoutParams(layoutParams);

		Init();
		Init_Point();
		pager.setAdapter(new myPagerView());

		arrayList.get(0).setBackgroundResource(
				R.drawable.renren_sdk_pay_repair_btn_down);
		pager.setCurrentItem(1);

		pager.setOnPageChangeListener(new OnPageChangeListener() {
			@Override
			public void onPageSelected(int arg0) {
				draw_Point(arg0);// 描繪分頁點,一定要寫在這裡.

				// Toast.makeText(MainActivity.this, ""+arg0, 1000).show();
				// 如果是第一屏或者是最後一屏禁止滑動,其實這裡實現的是如果滑動的是第一屏則跳轉至第二屏,如果是最後一屏則跳轉到倒數第二屏.
				if (arg0 == imageViews.size() - 1 || arg0 == 0) {
					if (arg0 == 0) {
						pager.setCurrentItem(arg0 + 1);// 第二屏 會再次實現該回調方法實現跳轉.
						imageViews.get(1).setBackgroundResource(R.drawable.d2);
					} else {
						pager.setCurrentItem(arg0 - 1);// 倒數第二屏
						imageViews.get(arg0 - 1).setBackgroundResource(
								R.drawable.d2);
					}
				} else {
					//一定要解除安裝else裡面,viewpager挺變態的,寫在外面,(在你在最左邊往左拉的時候會執行兩次,最右邊也是.)
					setBackgroud(arg0 - 1);
					Toast.makeText(MainActivity.this, "" + arg0, 1000).show();
				}
			}

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

			}

			@Override
			public void onPageScrollStateChanged(int arg0) {

			}
		});
	}
    /***
     * 對title 選項卡處理
     * @param index
     */
	public void setBackgroud(int index) {
		for (int i = 0; i < arrayList.size(); i++) {
			
			arrayList.get(i).setBackgroundDrawable(new BitmapDrawable());

			if (i == index)
				arrayList.get(index).setBackgroundResource(
						R.drawable.renren_sdk_pay_repair_btn_down);
		}

	}
    /***
     * viewpager 的資料來源
     * @author zhangjia
     *
     */
	class myPagerView extends PagerAdapter {
		// 顯示數目
		@Override
		public int getCount() {
			return pageViews.size();
		}

		@Override
		public boolean isViewFromObject(View arg0, Object arg1) {
			return arg0 == arg1;
		}

		@Override
		public int getItemPosition(Object object) {
			// TODO Auto-generated method stub
			return super.getItemPosition(object);
		}

		@Override
		public void destroyItem(View arg0, int arg1, Object arg2) {
			// TODO Auto-generated method stub
			((ViewPager) arg0).removeView(pageViews.get(arg1));
		}

		/***
		 * 獲取每一個item, 類於listview中的getview
		 */
		@Override
		public Object instantiateItem(View arg0, int arg1) {
			((ViewPager) arg0).addView(pageViews.get(arg1));
			return pageViews.get(arg1);
		}

	}
    /***
     * 點選事件
     */
	@Override
	public void onClick(View v) {
		switch (v.getId()) {
		case 0:
			setBackgroud(0);
			pager.setCurrentItem(1);
			break;
		case 1:
			setBackgroud(1);
			pager.setCurrentItem(2);
			break;
		case 2:
			setBackgroud(2);
			pager.setCurrentItem(3);
			break;

		default:
			break;
		}
	}
}
上面就是所有的程式碼,其實看起來有點小多,不過都挺容易理解的.還有就是前面我寫過一片關於viewpager的介紹,這裡也就不過多講解了.詳細請下載原始碼看吧.

樣本示例:

                     

            第一屏左垃                                          第一屏                                               滑向第二屏

                      

            第二屏                                                  第三屏                                           第三屏右拉(會縮回)

     原始碼下載