Android ViewPager導航------平凡中有奇蹟

來源:互聯網
上載者:User

標籤:android

ViewPager做導航想不想有這樣的效果:

比如說有四張圖片,下面有四個圓點,當頁面滑動的時候一個點變大一個點變小(或者是一個點變小一個點變大),等於說同時在執行兩個動畫。


package com.example.day_2014_10_17_viewpager;import java.util.ArrayList;import java.util.HashMap;import java.util.LinkedHashMap;import android.app.Activity;import android.content.Context;import android.os.Bundle;import android.widget.ImageView;import com.nineoldandroids.view.ViewHelper;import com.panpass.adapter.MyViewPagerAdapter;import com.panpass.view.MyViewPager;import com.panpass.view.MyViewPager.DiyPageScrollListener;public class MainActivity extends Activity {private Context mContext = this;private MyViewPager mViewPager;private ImageView imageView1, imageView2, imageView3, imageView4;private ArrayList<ImageView> mList;private HashMap<Integer, ImageView> mHashMap = new LinkedHashMap<Integer, ImageView>();private static final float SCALE_MAX = 0.55f;@Overrideprotected void onCreate(Bundle savedInstanceState) {super.onCreate(savedInstanceState);setContentView(R.layout.activity_main);mList = new ArrayList<ImageView>();ImageView img = new ImageView(mContext);img.setBackgroundResource(R.drawable.guide_page1);mList.add(img);img = new ImageView(mContext);img.setBackgroundResource(R.drawable.guide_page2);mList.add(img);img = new ImageView(mContext);img.setBackgroundResource(R.drawable.guide_page3);mList.add(img);img = new ImageView(mContext);img.setBackgroundResource(R.drawable.guide_page4);mList.add(img);mViewPager = (MyViewPager) findViewById(R.id.view_pager);mViewPager.setAdapter(new MyViewPagerAdapter(mList));imageView1 = (ImageView) findViewById(R.id.imageView1);imageView2 = (ImageView) findViewById(R.id.imageView2);imageView3 = (ImageView) findViewById(R.id.imageView3);imageView4 = (ImageView) findViewById(R.id.imageView4);ViewHelper.setScaleX(imageView2, SCALE_MAX);ViewHelper.setScaleY(imageView2, SCALE_MAX);ViewHelper.setScaleX(imageView3, SCALE_MAX);ViewHelper.setScaleY(imageView3, SCALE_MAX);ViewHelper.setScaleX(imageView4, SCALE_MAX);ViewHelper.setScaleY(imageView4, SCALE_MAX);mHashMap.put(0, imageView1);mHashMap.put(1, imageView2);mHashMap.put(2, imageView3);mHashMap.put(3, imageView4);mViewPager.setDiyOnPageScrollListener(new DiyPageScrollListener() {@Overridepublic void diyOnPageScrollListener(int position,float positionOffset, int positionOffsetPixels,boolean left, boolean right) {// 擷取左邊的ViewImageView mLeftImg = mHashMap.get(position);// 擷取右邊的ViewImageView mRightImg = mHashMap.get(position + 1);// 判斷滑動的方向float mScaleRight;float mScaleLeft;/** * 注意事件: 1 注意你要很靈敏的判斷ViewPager的切換方向是很難的,對於要求很高的應用來說是做不到了。 2 * 不管是向左滑動還是向右滑動,他們有的都是同一種演算法 */if (mRightImg != null) {/** * 縮小比例 如果手指從右至左的滑動(切換到後一個):0.0~1.0,即從一半到最大 * 如果手指從左至右的滑動(切換到前一個):1.0~0,即從最大到一半 */mScaleRight = (1-SCALE_MAX) * positionOffset + SCALE_MAX;/** * x位移量: 如果手指從右至左的滑動(切換到後一個):0-720 如果手指從左至右的滑動(切換到前一個):720-0 */ViewHelper.setScaleX(mRightImg, mScaleRight);ViewHelper.setScaleY(mRightImg, mScaleRight);}if (mLeftImg != null) {mScaleLeft = (1-SCALE_MAX) * (1 - positionOffset) + SCALE_MAX;/** * x位移量: 如果手指從右至左的滑動(切換到後一個):0-720 如果手指從左至右的滑動(切換到前一個):720-0 */ViewHelper.setScaleX(mLeftImg, mScaleLeft);ViewHelper.setScaleY(mLeftImg, mScaleLeft);}}});}}


package com.panpass.adapter;import java.util.ArrayList;import android.support.v4.view.PagerAdapter;import android.view.View;import android.view.ViewGroup;import android.widget.ImageView;public class MyViewPagerAdapter extends PagerAdapter {private ArrayList<ImageView> imgList;public MyViewPagerAdapter(ArrayList<ImageView> imgList) {super();this.imgList = imgList;}@Overridepublic int getCount() {return imgList.size();}@Overridepublic Object instantiateItem(ViewGroup container, int position) {ImageView img = imgList.get(position);container.addView(img);return img;}@Overridepublic void destroyItem(ViewGroup container, int position, Object object) {container.removeView((ImageView)object);}@Overridepublic boolean isViewFromObject(View arg0, Object arg1) {return arg0 == (View)arg1;}}


package com.panpass.view;import android.content.Context;import android.support.v4.view.ViewPager;import android.util.AttributeSet;public class MyViewPager extends ViewPager {private boolean left = false;  private boolean right = false;  private boolean isScrolling = false; private int lastValue = -1;  private ChangeViewCallback changeViewCallback = null;  public MyViewPager(Context context, AttributeSet attrs) {  super(context, attrs);  init();  }  public MyViewPager(Context context) {  super(context);  init();  }  private DiyPageScrollListener listener1;public interface DiyPageScrollListener{void diyOnPageScrollListener(int position, float positionOffset,  int positionOffsetPixels,boolean left,boolean right);}public void setDiyOnPageScrollListener(DiyPageScrollListener listener){this.listener1 = listener;}@Overrideprotected void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) {listener1.diyOnPageScrollListener(position, positionOffset, positionOffsetPixels,left,right);super.onPageScrolled(position, positionOffset, positionOffsetPixels);}/**  * init method .  */  private void init() {  //setOnPageChangeListener(listener);  }  /**  * listener ,to get move direction .  */  public  OnPageChangeListener listener = new OnPageChangeListener() {  @Override  public void onPageScrollStateChanged(int arg0) {  if (arg0 == 1) {  isScrolling = true;  } else {  isScrolling = false;  }  if (arg0 == 2) {  if(changeViewCallback!=null){  changeViewCallback.changeView(left, right);  }  right = left = false;  }  }  @Override  public void onPageScrolled(int arg0, float arg1, int arg2) {  if (isScrolling) {  if (lastValue > arg2) {  // 遞減,向右側滑動  right = true;  left = false;  } else if (lastValue < arg2) {  // 遞減,向右側滑動  right = false;  left = true;  } else if (lastValue == arg2) {  right = left = false;  }  }  lastValue = arg2;  }  @Override  public void onPageSelected(int arg0) {  if(changeViewCallback!=null){  changeViewCallback.getCurrentPageIndex(arg0);  }  }  };  /**  * 得到是否向右側滑動  * @return true 為右滑動  */  public boolean getMoveRight(){  return right;  }  /**  * 得到是否向左側滑動  * @return true 為左做滑動  */  public boolean getMoveLeft(){  return left;  }  /**  *  滑動狀態改變回調  * @author zxy  *  */  public interface ChangeViewCallback{  public  void changeView(boolean left,boolean right);  public  void  getCurrentPageIndex(int index);  }  public void  setChangeViewCallback(ChangeViewCallback callback){  changeViewCallback = callback;  }  }

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"    xmlns:tools="http://schemas.android.com/tools"    android:layout_width="match_parent"    android:layout_height="match_parent" >    <com.panpass.view.MyViewPager        android:id="@+id/view_pager"        android:layout_width="match_parent"        android:layout_height="match_parent" />    <LinearLayout        android:layout_width="match_parent"        android:layout_height="wrap_content"        android:layout_alignParentBottom="true"        android:layout_centerHorizontal="true"        android:layout_marginBottom="50dp"        android:gravity="center" >        <ImageView            android:id="@+id/imageView1"            android:layout_width="wrap_content"            android:layout_height="wrap_content"            android:src="@drawable/banner_circle_big" />        <ImageView            android:id="@+id/imageView2"            android:layout_width="wrap_content"            android:layout_height="wrap_content"            android:layout_marginLeft="15dp"            android:src="@drawable/banner_circle_big" />        <ImageView            android:id="@+id/imageView3"            android:layout_width="wrap_content"            android:layout_height="wrap_content"            android:layout_marginLeft="15dp"            android:src="@drawable/banner_circle_big" />        <ImageView            android:id="@+id/imageView4"            android:layout_width="wrap_content"            android:layout_height="wrap_content"            android:layout_marginLeft="15dp"            android:src="@drawable/banner_circle_big" />    </LinearLayout></RelativeLayout>




Android ViewPager導航------平凡中有奇蹟

聯繫我們

該頁面正文內容均來源於網絡整理,並不代表阿里雲官方的觀點,該頁面所提到的產品和服務也與阿里云無關,如果該頁面內容對您造成了困擾,歡迎寫郵件給我們,收到郵件我們將在5個工作日內處理。

如果您發現本社區中有涉嫌抄襲的內容,歡迎發送郵件至: info-contact@alibabacloud.com 進行舉報並提供相關證據,工作人員會在 5 個工作天內聯絡您,一經查實,本站將立刻刪除涉嫌侵權內容。

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.