android View Pagerを使って、輪播効果を実現します。

16356 ワード
and roid View Pager 交互まき
ビューPager：ビューを左右にスライド切り替えできるコントロールです。
ビューPagerの基本使用：
ビューPagerのビューは、PagerAdapterによって表示されます。
PagerAdapterの主な方法：
  ●get Countビューの数
  ●instantiateItem表示追加
  ●destroyItem破壊ビュー
  ●isView FroomObjectはオブジェクトからビューを作成しますか？
ViewPagerの一般的な使い方：
set Adapter設定アダプター
addOnPageChange Listenerモニター画面切り替えの状態
set CurrrentItemは現在のページの索引を設定します。
広告の輪番放送を実現する
技術点分析：
1、ネットワーク接続
2、JSON解析
3、ViewPagerの初期化
4、画像の非同期ロード
5、円点計の実現
selector+sharpeを使って円点画像を実現します。
動的にImageViewを作成してセットに追加し、レイアウトに追加します。
ビューPager切り替えイベントで、円の状態を切り替えます。
6、自動切替効果
Handlerのpostメソッドを使用して、タイミングでコードを実行します。
リソースファイル:
mydot.xml//円点資源を作成し、drawableファイルの下に置く

<?xml version="1.0" encoding="utf-8"?> 
<selector xmlns:android="http://schemas.android.com/apk/res/android" > 
 <item android:state_enabled="true"> 
  <shape android:shape="oval"> 
   <size android:width="5dp" android:height="5dp"/> 
   <solid android:color="#fff"/> 
  </shape> 
 </item> 
  <item android:state_enabled="false"> 
  <shape android:shape="oval"> 
   <size android:width="5dp" android:height="5dp"/> 
   <solid android:color="#8EE5EE"/> 
  </shape> 
 </item> 
 
</selector>
レイアウトファイル:
activitymain.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" 
 tools:context=".MainActivity" > 
 
 <ListView 
  android:layout_width="match_parent" 
  android:layout_height="match_parent" 
  android:id="@+id/lv_list" /> 
</RelativeLayout>
activitybanner.xml

<FrameLayout 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" 
 tools:context=".MainActivity" > 
 
 <android.support.v4.view.ViewPager 
  android:id="@+id/vp_image" 
  android:layout_width="wrap_content" 
  android:layout_height="150dp" 
  android:layout_gravity="center" /> 
 <LinearLayout 
  android:layout_width="match_parent" 
  android:layout_height="40dp" 
  android:id="@+id/layout" 
  android:layout_gravity="bottom" 
  android:gravity="center" 
  android:orientation="horizontal" 
  ></LinearLayout> 
</FrameLayout>
javaコード
ImageLoader.java/このコードはURLから画像リソースを取得するものです。

package cn.edu.huse.banner_re.util; 
import android.graphics.Bitmap; 
import android.graphics.BitmapFactory; 
import android.os.AsyncTask; 
import java.io.IOException; 
import java.io.InputStream; 
import java.net.HttpURLConnection; 
import java.net.MalformedURLException; 
import java.net.URL; 
 
/** 
 *          
 * @author xray 
 * 
 */ 
public class ImageLoader { 
 
 /** 
  *             
  *   URL  ，          
  */ 
 public interface OnImageLoadListener{ 
  //       
  void onImageLoadComplete(String url, Bitmap bitmap); 
 } 
  
 private OnImageLoadListener mListener; 
  
 /** 
  *          
  * @param urlStr 
  * @param listener 
  */ 
 public void loadImage(String urlStr,OnImageLoadListener listener){ 
  this.mListener = listener; 
  new ImageLoadTask().execute(urlStr); 
 } 
  
 /** 
  *        
  * @author xray 
  * 
  */ 
 class ImageLoadTask extends AsyncTask<String,Void,ImageLoadTask.UrlAndBitmap>{ 
   
  @Override 
  protected UrlAndBitmap doInBackground(String... params) { 
    
   try { 
    //  URL，       
    URL url = new URL(params[0]); 
    //      HttpURLConnection   
    HttpURLConnection conn = (HttpURLConnection) url.openConnection(); 
    //        
    InputStream stream = conn.getInputStream(); 
    //          
    Bitmap bmp = BitmapFactory.decodeStream(stream); 
    //    
    stream.close(); 
    return new UrlAndBitmap(params[0],bmp); 
   } catch (MalformedURLException e) { 
    e.printStackTrace(); 
   } catch (IOException e) { 
    e.printStackTrace(); 
   } 
   return null; 
  } 
 
  //          
  class UrlAndBitmap{ 
   String url; 
   Bitmap bitmap; 
   public UrlAndBitmap(String url, Bitmap bitmap) { 
    this.url = url; 
    this.bitmap = bitmap; 
   } 
  } 
   
  @Override 
  protected void onPostExecute(UrlAndBitmap result) { 
   //       
   if(mListener != null){ 
    mListener.onImageLoadComplete(result.url,result.bitmap); 
   } 
  } 
 } 
}
JSON Loader.java
//読出しサーバーJson

package cn.edu.huse.banner_re.util; 
 
import android.os.AsyncTask; 
 
import java.io.IOException; 
import java.io.InputStream; 
import java.net.HttpURLConnection; 
import java.net.MalformedURLException; 
import java.net.URL; 
 
/** 
 *      JSON     
 * @author xray 
 * 
 */ 
public class JSONLoader { 
  
 public interface OnJSONLoadListener{ 
  void onJSONLoadComplete(String json); 
 } 
  
 private OnJSONLoadListener mListener; 
  
 public void loadJSON(String urlStr,OnJSONLoadListener listener){ 
  this.mListener = listener; 
  new JSONLoadTask().execute(urlStr); 
 } 
  
 class JSONLoadTask extends AsyncTask<String,Void,String>{ 
 
  @Override 
  protected String doInBackground(String... params) { 
   try { 
    URL url = new URL(params[0]); 
    HttpURLConnection conn = (HttpURLConnection) url.openConnection(); 
    InputStream inputStream = conn.getInputStream(); 
    byte[] buffer = new byte[1024]; 
    int len = 0; 
    //StringBuffer     ，    VS StringBuilder      ，    
    StringBuilder strB = new StringBuilder(); 
    while((len = inputStream.read(buffer)) != -1){ 
     //       String 
     String str = new String(buffer,0,len); 
     strB.append(str); 
    } 
    inputStream.close(); 
    return strB.toString(); 
   } catch (MalformedURLException e) { 
    e.printStackTrace(); 
   } catch (IOException e) { 
    e.printStackTrace(); 
   } 
   return null; 
  } 
 
  @Override 
  protected void onPostExecute(String result) { 
   if(mListener != null){ 
    mListener.onJSONLoadComplete(result); 
   } 
  }  
 } 
}
MyView Pager Adapter.java

package cn.edu.huse.banner_re.adapter; 
 
import java.util.List; 
 
import android.support.v4.view.PagerAdapter; 
import android.view.View; 
import android.view.ViewGroup; 
import android.widget.ImageView; 
 
/** 
 *          
 * @author Lenovo 
 * 
 */ 
public class MyViewPagerAdapter extends PagerAdapter { 
 
 private List<ImageView> mData; 
  
 public MyViewPagerAdapter(List<ImageView> mData) { 
  this.mData = mData; 
 } 
 //        
 @Override 
 public int getCount() { 
  return mData.size(); 
 } 
  
 @Override 
 public boolean isViewFromObject(View arg0, Object arg1) { 
  return arg0 == arg1; 
 } 
 
 //     
 @Override 
 public void destroyItem(ViewGroup container, int position, Object object) { 
  container.removeView(mData.get(position)); 
 } 
  
 //     
 @Override 
 public Object instantiateItem(ViewGroup container, int position) { 
  container.addView(mData.get(position)); 
  return mData.get(position); 
 } 
  
}
MainActivity.java

package cn.edu.huse.banner_re; 
 
import java.util.ArrayList; 
import java.util.List; 
 
import org.json.JSONArray; 
import org.json.JSONObject; 
 
import android.app.Activity; 
import android.graphics.Bitmap; 
import android.os.Bundle; 
import android.os.Handler; 
import android.support.v4.view.ViewPager; 
import android.support.v4.view.ViewPager.OnPageChangeListener; 
import android.view.LayoutInflater; 
import android.view.View; 
import android.view.View.OnClickListener; 
import android.widget.ArrayAdapter; 
import android.widget.ImageView; 
import android.widget.LinearLayout; 
import android.widget.ListView; 
import android.widget.RadioButton; 
import cn.edu.huse.banner_re.adapter.MyViewPagerAdapter; 
import cn.edu.huse.banner_re.util.ImageLoader; 
import cn.edu.huse.banner_re.util.ImageLoader.OnImageLoadListener; 
import cn.edu.huse.banner_re.util.JSONLoader; 
import cn.edu.huse.banner_re.util.JSONLoader.OnJSONLoadListener; 
 
public class MainActivity extends Activity implements OnClickListener{ 
 
 public static final String URL_GIFT = "http://www.1688wan.com/majax.action?method=getGiftList&pageno=1"; 
 public static final String URL_BASE = "http://www.1688wan.com"; 
 private ListView mLv; 
 //          
 private LinearLayout mLayout; 
 private ViewPager mPager; 
 //  viewpager       
 private List<ImageView> mImageViews; 
 //          
 private List<ImageView> mDotViews; 
 //     
 private ImageView mDotView; 
 //     
 private int mIndex; 
 private Handler mHandler = new Handler(); 
 
 @Override 
 protected void onCreate(Bundle savedInstanceState) { 
  super.onCreate(savedInstanceState); 
  setContentView(R.layout.activity_main); 
  //   viewpager 
  initViewPager(); 
 } 
 
 private void initViewPager() { 
  new JSONLoader().loadJSON(URL_GIFT, new OnJSONLoadListener() { 
   @Override 
   public void onJSONLoadComplete(String json) { 
    //        
    List<String> list = josnPare(json); 
    //       
    initView(); 
    //      viewpager  
    initImageViews(list); 
    // ViewPager      
    mPager.setAdapter(new MyViewPagerAdapter(mImageViews)); 
    //       
    initDot(mImageViews.size()); 
    //        
    mPager.postDelayed(new Runnable() { 
     @Override 
     public void run() { 
      //    ++ 
      mIndex++; 
      //       ，      
      if(mIndex >= mImageViews.size()){ 
       mIndex = 0; 
      } 
      //     
      mPager.setCurrentItem(mIndex); 
      //     
      mHandler.postDelayed(this, 1500); 
     } 
    }, 1500); 
    //         ，          
    mPager.setOnPageChangeListener(new OnPageChangeListener() { 
      
     //       
     @Override 
     public void onPageSelected(int arg0) { 
      //             
      mDotView.setEnabled(true); 
      //          
      mDotView = mDotViews.get(arg0); 
      //               
      mDotView.setEnabled(false); 
      //     
      mIndex = arg0; 
     } 
      //       
     @Override 
     public void onPageScrolled(int arg0, float arg1, int arg2) { 
       
     } 
      //         
     @Override 
     public void onPageScrollStateChanged(int arg0) { 
       
     } 
    }); 
   } 
  }); 
 } 
  
 /**         
  * @param count viewpager       
  */ 
 private void initDot(int count){ 
  mDotViews = new ArrayList<ImageView>(); 
  LinearLayout.LayoutParams params = new LinearLayout.LayoutParams( 
    LinearLayout.LayoutParams.WRAP_CONTENT, 
    LinearLayout.LayoutParams.WRAP_CONTENT); 
  //     
  params.setMargins(5, 0, 5, 0); 
  for(int i = 0; i < count; i++){ 
   ImageView image = new ImageView(this); 
   //       
   image.setImageResource(R.drawable.mydot); 
   //       ，        
   image.setTag(i); 
   //     
   image.setOnClickListener(this); 
   //       
   mLayout.addView(image, params); 
   //            
   mDotViews.add(image); 
  } 
  mDotView = mDotViews.get(0); 
  mDotView.setEnabled(false); 
 } 
  
 /** 
  *        
  */ 
 private void initImageViews(List<String> list) { 
  mImageViews = new ArrayList<ImageView>(); 
  for(String str : list){ 
   final ImageView imageView = new ImageView(this); 
   //       
   imageView.setImageResource(R.drawable.ic_launcher); 
   new ImageLoader().loadImage(URL_BASE+str, new OnImageLoadListener() { 
     
    @Override 
    public void onImageLoadComplete(String url, Bitmap bitmap) { 
     if(bitmap != null){ 
      imageView.setImageBitmap(bitmap); 
     } 
    } 
   }); 
   // ImageView       
   mImageViews.add(imageView); 
  } 
   
 } 
 /** 
  * JSON          
  * @param url 
  * @return 
  */ 
 private List<String> josnPare(String url){ 
  List<String> list = new ArrayList<String>(); 
  try { 
   JSONObject jobj = new JSONObject(url); 
   JSONArray array = jobj.getJSONArray("ad"); 
   for(int i = 0; i < array.length(); i++){ 
    JSONObject obj = (JSONObject) array.get(i); 
    list.add(obj.getString("iconurl")); 
   } 
  } catch (Exception e) { 
   e.printStackTrace(); 
  } 
  return list; 
 } 
  
 /** 
  *       
  */ 
 private void initView() { 
  //     
  mLv = (ListView) findViewById(R.id.lv_list); 
   
  View view = LayoutInflater.from(this).inflate(R.layout.activity_banner, null); 
  mPager = (ViewPager)view.findViewById(R.id.vp_image); 
  //       
  mLayout = (LinearLayout)view.findViewById(R.id.layout); 
  //     
  List<String> mList = new ArrayList<String>(); 
  for(int i = 0; i < 20; i++){ 
   mList.add("  --"+i); 
  } 
  //      
  ArrayAdapter<String> mAdapter = new ArrayAdapter<String>(this, 
    android.R.layout.simple_list_item_1, 
    android.R.id.text1, 
    mList); 
  //       
  mLv.addHeaderView(view); 
  //      
  mLv.setAdapter(mAdapter); 
  /*//       
  mLayout = (LinearLayout)findViewById(R.id.layout);*/ 
 } 
  
  
 /** 
  *           
  */ 
 @Override 
 public void onClick(View arg0) { 
  //           
  int index = Integer.parseInt(arg0.getTag().toString()); 
  // viewpager         index    
  mPager.setCurrentItem(index); 
  //           
  mDotView.setEnabled(true); 
  //      
  mDotView = (ImageView) arg0; 
  //       false 
  mDotView.setEnabled(false); 
  //     
  mIndex = index; 
 } 
 
}
注意：ここではJson解析が使われていますので、インターネット操作が必要です。必ずインターネットの権限を書きます。

実行効果:

以上が本文の全部です。皆さんの勉強に役に立つように、私たちを応援してください。