Android實現自動輪播圖效果

這篇文章主要爲大家詳細介紹了Android實現自動輪播圖效果,具有一定的參考價值,感興趣的小夥伴們可以參考一下

本文實例爲大家分享了Android實現輪播圖效果展示的具體代碼,供大家參考,具體內容如下

MainActivity.java

public class MainActivity extends AppCompatActivity {

 private LinearLayout ll_dots;
 private TextView viewpager_tv;

 // 將ViewPager定義爲全局變量,方便使用.
 private ViewPager viewpager_vp;

 // 建立一個ArrayList集合.泛型指定爲ImageView.
 ArrayList<ImageView> imageViews = new ArrayList<ImageView>();



 //創建一個handler對象,複寫handlerMessage方法,用switch方法,通過msg.what得到標識.333
 private Handler handler = new Handler() {
  @Override
  public void handleMessage(Message msg) {
   switch (msg.what) {
    case 1:
     //得到當前VIewPager和用戶交互的item條目.VIewPager對象.getCurrentItem 333
     int currentItem = viewpager_vp.getCurrentItem();
     //設置ViewPager當前顯示的界面,得到的ITem+1
     viewpager_vp.setCurrentItem(currentItem + 1);
     //通過靜態方法sendEmptyMessageDelayed,延時重複執行命令.注意不是sendEmptyMessageAtTime 333
     sendEmptyMessageDelayed(1, 3000);
     break;
    default:
     break;
   }

  }
 };

 //圖片int數組資源
 private int[] imageResIds = {R.drawable.a, R.drawable.b, R.drawable.c, R.drawable.d, R.drawable.e, R.drawable.f};

 //圖片字符串數組String[]資源.
 private String[] descs = {
   "網頁設計師聯盟",
   "教程網",
   "PS聯盟",
   "25學堂",
   "課工場帶你逆襲,助你走向人生巔峯",
   "當你因需求被項目經理頻繁修改,而想之暴打時,請先看易老師賤笑圖,你是不是更想打我了"
 };

 @Override
 protected void onCreate(Bundle savedInstanceState) {
  super.onCreate(savedInstanceState);
  setContentView(R.layout.activity_main);
  //對控件進行初始化
  init();
 }

 /**
  * 對VIewPager進行初始化.
  */
 private void init() {
  //找到可以設置點的容器LinearLayout的對象,進行點的添加
  ll_dots = (LinearLayout) findViewById(R.id.ll_dots);
  //找到文本的對象.
  viewpager_tv = (TextView) findViewById(R.id.viewpager_tv);
  //找到VIewPager對象.
  viewpager_vp = (ViewPager) findViewById(R.id.viewpager_vp);

  //更加圖片int數組資源的數量,動態的創建ImageView控件.就是有幾張圖片,創建幾個ImageView,for循環
  for (int x = 0; x < imageResIds.length; x++) {
   //創建ImageView對象
   ImageView imageView = new ImageView(this);
   //通過該對象添加圖片資源.setBackgroundResource方法.
   imageView.setBackgroundResource(imageResIds[x]);
   //把控件添加到集合ImageViews中去,以方便在VIewPager的適配器裏instantiateItem方法獲取.
   imageViews.add(imageView);
   //進行點的添加,其個數和圖片的個數一致,因此放到該循環中.222
   dot();
  }

  //設置適配器.setAdapter
  viewpager_vp.setAdapter(new Myadapter());
  //設置ViewPager的滑動監聽器,addOnPageChangeListener,set的方法因爲名字的原因被淘汰了,在onPageScrolled中.222
  viewpager_vp.addOnPageChangeListener(new ViewPager.OnPageChangeListener() {


   @Override
   public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) {
    //同過getCurrentItem方法拿到當前用戶所交互ViewPager的item位置.
    int currentItem = viewpager_vp.getCurrentItem();
    //通過得到的這個item,給text和點進行選中的設置.
    changeTextAndDot(currentItem % imageResIds.length);
    Log.d("aaa", "onPageScrolled: Position-" + position + " positionOffset-" + positionOffset + " positionOffsetPixels-" + positionOffsetPixels);

   }

   @Override
   public void onPageSelected(int position) {
    Log.d("aaa", "onPageSelected: position" + position);
   }

   @Override
   public void onPageScrollStateChanged(int state) {
    Log.d("aaa", "onPageScrollStateChanged: state" + state);
   }
  });
  //指定VIewPager默認跳轉到某頁.一般是最大數的一般.setCurrentItem就是設置VIewPager跳到哪頁,get是獲取.333
  viewpager_vp.setCurrentItem(Integer.MAX_VALUE / 2 - 3);

  //通過handler,3秒後開始循環ViwePager的item.sendEmptyMessageDelayed,333
  handler.sendEmptyMessageDelayed(1, 3000);
  //設置VIewPager的觸摸事件.最後抽成方法.333
  ViewPagerTouchEvent();
 }

 /**
  * 注意:看一個方法或類的信息快捷鍵:Ctrl+Q;
  * 像ListVIew一樣,創建一個ViewPager的適配器,自定義一個類繼承PagerAdapter
  */
 private class Myadapter extends PagerAdapter {
  //getContent,設置ViewPager的條目個數.一般就是集合或者資源數組的長度.
  @Override
  public int getCount() {
   //把返回的條目設置爲無限大.333
   //注意:一般和獲取ViewPager當前選中的是第幾頁有關的都要改爲position(當前頁數)%list.size()(取餘數),你就看哪報錯,根據報錯改333
   return Integer.MAX_VALUE;
  }

  //isViewFromObject,判斷ViewPager的條目View對象和InstantiateItem返回的Object對象是否一致,固定格式:return view==object;
  @Override
  public boolean isViewFromObject(View view, Object object) {
   return view == object;
  }

  //Ctrl+H:看到一個類的基礎結構圖 ctrl+h+l:快速格式化.
  //instantiateItem,ViewPager添加條目的操作.container:VIewPager的化身,控件都是添加到他身上,position:代表用戶滑動條目的位置
  @Override
  public Object instantiateItem(ViewGroup container, int position) {
   //根據條目所在位置(利用Position),從ImageViews集合裏獲取相對應的ImageVIew圖片.
   ImageView imageView = imageViews.get(position % imageResIds.length);
   //把得到ImageView對象,添加給VIewPager對象,也就是container,使用addView
   container.addView(imageView);
   //注意:你添加給VIewPager什麼控件,就要返回該控件,給isViewFromObject進行比較判斷,這裏添加的是ImageView,返回的就是ImageView
   return imageView;
  }

  //防止內存泄漏.相當於ListView的複用container,銷燬一個page,該方法的實際就是將instantiateItem返回的VIew對象從ViewPager中移除,
  //container:還是ViewPager控件自身 position: object:則代表了View控件,使用時要強轉成View一下
  //補充:爲什麼參數是Object,而不直接是View,因爲雖然99%是view,但也有可能是Fragment,所以用Object,提高了可擴展性.
  @Override
  public void destroyItem(ViewGroup container, int position, Object object) {
   //構造方法刪除後,也是固定格式:container.removeView((View) object);
   container.removeView((View) object);
  }
 }


 /**
  * 更加圖片資源的數量,動態的創建點222
  */
 public void dot() {
  //創建一個View對象;
  View view = new View(this);
  //爲這個View對象設置背景setBackgroundResource
  view.setBackgroundResource(R.drawable.dot_normal);
  //爲View對象設置寬高參數,使用參數對象LayoutParams(int,int),給哪個容器,就用哪個容器創建
  LinearLayout.LayoutParams layoutParams = new LinearLayout.LayoutParams(8, 8);
  //使用參數對象LayoutParams.leftMargin=int,相當於佈局裏的padding.
  layoutParams.leftMargin = 8;
  //把準備好的layoutParams參數對象,設置給View對象.setLayoutParams
  view.setLayoutParams(layoutParams);
  //最後容器對象.addView(VIwe);
  ll_dots.addView(view);
 }


 /**
  * 根據ViewPager的item的變化,也就是圖片切換的操作,設置對應的點和文本.222
  *
  * @param position int ViewPager的item,也是圖片的位置
  */
 public void changeTextAndDot(int position) {
  //根據ViewPager的item的變化,設置對應的文本.setText(descs[position]);
  viewpager_tv.setText(descs[position]);
  //對點進行判斷是否是當前頁的點,用for循環,拿到所有點的位置,然後和position對比
  for (int x = 0; x < imageResIds.length; x++) {
   //.getChildAt(x);拿到容器的子控件.得到VIew對象
   View childAt = ll_dots.getChildAt(x);
   //爲View設置背景圖片,,使用三元運算符.
   childAt.setBackgroundResource(x == position ? R.drawable.dot_focus : R.drawable.dot_normal);
  }
 }

 /**
  * 該方法主要設置VIewPager的觸摸事件,實現用戶的觸摸時,不再自動播放.switch中motionEvent.getActivity.333
  * 另一種實現的思路,是在ViewPager監聽事件裏面,對ViewPager的狀態進行判斷.閒置-滑動,和用戶交互中-移除滑動.
  * public void onPageScrollStateChanged(int state) {
  * //當滑動狀態發生改變的時候,手動滑動的時候,不能進行界面切換操作
  * //SCROLL_STATE_IDLE : 空閒狀態
  * if (state == ViewPager.SCROLL_STATE_IDLE) {
  * //自動切換界面
  * handler.sendEmptyMessageDelayed(VIEWPAGER_SWITCH_PAGE, 3000);
  * }else{
  * //停止自動切換
  * //停止界面切換操作
  * handler.removeMessages(VIEWPAGER_SWITCH_PAGE);
  * }
  * }
  */
 public void ViewPagerTouchEvent() {
  viewpager_vp.setOnTouchListener(new View.OnTouchListener() {
   @Override
   public boolean onTouch(View view, MotionEvent motionEvent) {
    switch (motionEvent.getAction()) {
     case MotionEvent.ACTION_DOWN:
      //當時MotionEvent.ACTION_DOWN和ACTION_MOVE,就移除handler發送的message.removeMessages.333
      handler.removeMessages(1);
      break;
     case MotionEvent.ACTION_MOVE:
      handler.removeMessages(1);
      break;
     //當用戶手鬆開時ACTION_UP,就繼續使用sendEmptyMessageDelayed發送handler的消息.333
     case MotionEvent.ACTION_UP:
      handler.sendEmptyMessageDelayed(1, 3000);
     default:
      break;
    }
    return false;
   }
  });
 }


 @Override
 protected void onDestroy() {
  super.onDestroy();
  handler.removeMessages(1);
 }
}

activity_main.xml

<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">
 <android.support.v4.view.ViewPager
  android:id="@+id/viewpager_vp"
  android:layout_width="wrap_content"
  android:layout_height="300dp" />
 <!-- 定義lineatLayout時,background="#88000000",gravity="center_horizontal" padding="8dp"
   android:layout_alignBottom="@+id/viewpager_vp" 小點用一個LinearLayout來包裹.-->
 <LinearLayout
  android:layout_width="match_parent"
  android:layout_height="wrap_content"
  android:background="#88000000"
  android:gravity="center_horizontal"
  android:padding="8dp"
  android:layout_alignBottom="@+id/viewpager_vp"
  android:orientation="vertical">
  <!--此處狀態選擇器的選擇屬性是state_selected,而不是state_pressed,
   要知道他們的區別,引用圖片drawable,注意V是大寫,
   點是根據圖片的張數,動態創建的,所有我們的View還要註釋掉.-->text
  <TextView
   android:id="@+id/viewpager_tv"
   android:layout_width="wrap_content"
   android:layout_height="wrap_content"
   android:textColor="@android:color/white"
   android:text="我是帥哥"/>

  <LinearLayout
   android:id="@+id/ll_dots"
   android:layout_width="match_parent"
   android:layout_height="wrap_content"
   android:orientation="horizontal"
   android:gravity="center_horizontal">
<!--   <View
    android:layout_width="5dp"
    android:layout_height="5dp"
    android:background="@drawable/dot_focus"/>-->
  </LinearLayout>
 </LinearLayout>
</RelativeLayout>

以上就是本文的全部內容,希望對大家的學習有所幫助,也希望大家多多支持神馬文庫。

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章