Android ViewPager 배 너 순환 재생 실현

문제 의 기원
프로젝트 에 서 는 Banner 를 보 여 주 는 그림 순환 방송 효 과 를 실현 해 야 할 때 도 있다.이 동시에 그림 은 순환 적 으로 재생 할 수 있 고 아래 에 작은 원점 이 있어 서 현재 어느 페이지 로 돌아 가 는 지 알려 준다.
다음 그림:

분석 하 다.
・그림 의 개 수 는 변 하 며,작은 원점 의 개 수 는 그림 의 개수 에 따라 변 한다
・페이지 마다 레이아웃 이 같 습 니 다.변 화 된 것 은 작은 원점 의 개수 이기 때문에 코드 로 작은 원점 을 동적 으로 생 성 해 야 한다.
부호화
배치
우선 MainActivity 의 레이아웃 activity 완성main.xml

<RelativeLayout 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" >

 <!-- ViewPager -->
 <android.support.v4.view.ViewPager
  android:id="@+id/viewpager"
  android:layout_width="fill_parent"
  android:layout_height="180dip" />

 <LinearLayout
  android:layout_width="fill_parent"
  android:layout_height="wrap_content"
  android:layout_alignBottom="@id/viewpager"
  android:background="#44000000"
  android:gravity="center"
  android:orientation="vertical"
  android:padding="5dip" >

  <!-- Banner      -->
  <TextView
   android:id="@+id/tv_banner_text_desc"
   android:layout_width="wrap_content"
   android:layout_height="wrap_content"
   android:textColor="@android:color/white" />

  <!--         -->
  <LinearLayout
   android:id="@+id/ll_dot_group"
   android:layout_width="fill_parent"
   android:layout_height="wrap_content"
   android:layout_gravity="center_horizontal"
   android:layout_marginTop="5dip"
   android:gravity="center_horizontal"
   android:orientation="horizontal" >
  </LinearLayout>
 </LinearLayout>

</RelativeLayout>

작은 원점 은 모두 두 가지 상태 가 있 기 때문에 하 나 는 enable 이 true 인 상태 와 enable 이 false 인 상태 입 니 다.그래서 작은 원점 에 selector 의 xml 설정 파일 을 만들어 drawable 폴 더 에 넣 어야 합 니 다.여기,그것 을 dot 라 고 명명 합 니 다.bg_selector.xml

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">

 <item android:drawable="@drawable/point_bg_enable" android:state_enabled="true"></item>
 <item android:drawable="@drawable/point_bg_normal" android:state_enabled="false"></item>

</selector>

작은 원점 으로 서로 다른 상태 에서 xml 파일 을 두 개 더 써 야 합 니 다.
point_bg_enable.xml

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
 android:shape="oval" >
 <corners android:radius="0.5dip" />
 <solid android:color="#aaFFFFFF" />
</shape>
point_bg_normal.xml

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
 android:shape="oval" >
 <corners android:radius="0.5dip" />
 <solid android:color="#55000000" />
</shape>
그림 자원 준비
나 는 res\drawable-hdpi 폴 더 에 몇 장의 그림 을 놓 아서 시범 을 보 였 다

인 코딩 시작
코드 에 상세 한 주석 을 달 았 으 니 여러분 이 보 셔 도 됩 니 다.모 르 는 환영 이 있 으 면 지적 해 주세요.

package com.owen.adbanner;

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

import android.app.Activity;
import android.os.Bundle;
import android.os.SystemClock;
import android.support.v4.view.PagerAdapter;
import android.support.v4.view.ViewPager;
import android.view.View;
import android.view.ViewGroup;
import android.widget.ImageView;
import android.widget.LinearLayout;
import android.widget.Toast;
import android.widget.LinearLayout.LayoutParams;
import android.widget.TextView;

/**
 * ViewPager  Banner    
 * 
 * @author owen
 */
public class MainActivity extends Activity {

 /** ViewPager ImageView    */
 private List<ImageView> imageViewContainer = null;


 /**              ,    0 */
 private int preDotPosition = 0;

 /** Banner       */
 private String[] bannerTextDescArray = { 
   "     ,      ", 
   "      ,            ",
   "          ", 
   "   TV    ", "      " 
 };

 /** Banner           ,      */
 private boolean isStop = false;

 /** Banner      page      */
 private long scrollTimeOffset = 5000;

 private ViewPager viewPager;

 /** Banner          */
 private TextView tvBannerTextDesc;

 /**         */
 private LinearLayout llDotGroup;

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

  initView();
  startBannerScrollThread();
 }

 /**
  *   Banner    
  */
 private void startBannerScrollThread() {
  new Thread(new Runnable() {

   @Override
   public void run() {
    while (!isStop) {
     //              ,  viewpager  
     SystemClock.sleep(scrollTimeOffset);

     runOnUiThread(new Runnable() {
      public void run() {
       int newindex = viewPager.getCurrentItem() + 1;
       viewPager.setCurrentItem(newindex);
      }
     });
    }
   }
  }).start();
 }

 @Override
 protected void onDestroy() {
  //     
  isStop = true;
  super.onDestroy();
 }

 private void initView() {
  viewPager = (ViewPager) findViewById(R.id.viewpager);
  llDotGroup = (LinearLayout) findViewById(R.id.ll_dot_group);
  tvBannerTextDesc = (TextView) findViewById(R.id.tv_banner_text_desc);

  imageViewContainer = new ArrayList<ImageView>();
  int[] imageIDs = new int[] { 
    R.drawable.a, 
    R.drawable.b, 
    R.drawable.c,
    R.drawable.d,
    R.drawable.e, 
  };

  ImageView imageView = null;
  View dot = null;
  LayoutParams params = null;
  for (int id : imageIDs) {
   imageView = new ImageView(this);
   imageView.setBackgroundResource(id);
   imageViewContainer.add(imageView);

   //                 
   dot = new View(this);
   dot.setBackgroundResource(R.drawable.dot_bg_selector);
   params = new LayoutParams(5, 5);
   params.leftMargin = 10;
   dot.setEnabled(false);
   dot.setLayoutParams(params);
   llDotGroup.addView(dot); //         " "
  }

  viewPager.setAdapter(new BannerAdapter());
  viewPager.setOnPageChangeListener(new BannerPageChangeListener());

  //        、    
  tvBannerTextDesc.setText(bannerTextDescArray[0]);
  llDotGroup.getChildAt(0).setEnabled(true);
  viewPager.setCurrentItem(0);
 }

 /**
  * ViewPager    
  */
 private class BannerAdapter extends PagerAdapter {

  @Override
  public void destroyItem(ViewGroup container, int position, Object object) {
   container.removeView(imageViewContainer.get(position % imageViewContainer.size()));
  }

  @Override
  public Object instantiateItem(ViewGroup container, int position) {
   View view = imageViewContainer.get(position % imageViewContainer.size());

   //     page      
   view.setOnClickListener(new View.OnClickListener() {

    @Override
    public void onClick(View v) {
     Toast.makeText(MainActivity.this, "Page     ", Toast.LENGTH_SHORT).show();
    }

   });

   container.addView(view);
   return view;
  }

  @Override
  public int getCount() {
   return Integer.MAX_VALUE;
  }

  @Override
  public boolean isViewFromObject(View view, Object object) {
   return view == object;
  }

 }

 /**
  * Banner Page     
  */
 private class BannerPageChangeListener implements ViewPager.OnPageChangeListener {

  @Override
  public void onPageScrollStateChanged(int arg0) {
   // Nothing to do
  }

  @Override
  public void onPageScrolled(int arg0, float arg1, int arg2) {
   // Nothing to do
  }

  @Override
  public void onPageSelected(int position) {
   //       ,    page   
   int newPositon = position % imageViewContainer.size();
   //            
   tvBannerTextDesc.setText(bannerTextDescArray[newPositon]);
   //            
   llDotGroup.getChildAt(preDotPosition).setEnabled(false);
   //             
   llDotGroup.getChildAt(newPositon).setEnabled(true);
   //               
   preDotPosition = newPositon;
  }

 }

}

참조 소스
http://blog.csdn.net/allen315410/article/details/39294343
https://github.com/331637495/BannerDemo
이상 이 바로 본 고의 모든 내용 입 니 다.여러분 의 학습 에 도움 이 되 고 저 희 를 많이 응원 해 주 셨 으 면 좋 겠 습 니 다.

좋은 웹페이지 즐겨찾기