Android上的縫循環(huán)廣告位實現(xiàn)方法似乎有很多種方法吨悍,還有的大神用RecyclerView實現(xiàn)了。但是,我試了一下用ViewPager瞧毙,好像這個更簡便一點。
先看一下效果圖:
ViewPagerAD.gif
demo中用到了:
- Gson 一個谷歌的Json解析庫寄症,速度快宙彪,很好用。
- Glide 用于加載圖片的第三方庫有巧,如絲般順暢释漆。
- Volley 網(wǎng)絡(luò)請求的第三方庫,比較早就有了篮迎,現(xiàn)在仍很多人用男图。
如果對以上這三個庫不了解的話示姿,建議先去看看。
初始化那些什么的就不說了逊笆,我們直接說重點的栈戳。
布局
很簡單,ViewPager+LinearLayout难裆。底下的LinearLayout是用來顯示圓點的子檀。
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true"
android:orientation="vertical"
tools:context="com.sonnyzoom.viewpagerad.MainActivity">
<android.support.v7.widget.Toolbar
android:id="@+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="?attr/colorPrimary"
app:popupTheme="@style/AppTheme.PopupOverlay" />
<android.support.v4.view.ViewPager
android:id="@+id/viewPager"
android:layout_width="match_parent"
android:layout_height="180dp" />
<LinearLayout
android:id="@+id/linearLayout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center_horizontal"
android:orientation="horizontal" />
</LinearLayout>
實現(xiàn)過程
既然用到ViewPager,肯定需要一個適配器PagerAdapter:
class MyAdapter extends PagerAdapter {
@Override
public int getCount() {
return Integer.MAX_VALUE; //最大值乃戈,可以認為無限大褂痰,反正你劃不到盡頭就行了
}
@Override
public boolean isViewFromObject(View view, Object object) {
return view == object;
}
@Override
public Object instantiateItem(ViewGroup container, final int position) {
//在0~imageViewList.size()之間循環(huán)
int index = position % imageViewList.size();
imageViewList.get(index).setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
//處理圖片點擊事件....
Log.e("點擊圖片:",position % imageViewList.size()+"");
}
});
if (imageViewList.size() > 0) {
View view = imageViewList.get(index);
if (container.equals(view.getParent())) {
container.removeView(view);
}
container.addView(view);
return view;
}
return null;
}
@Override
public void destroyItem(ViewGroup container, int position, Object object) {
int index = position % imageViewList.size();
container.removeView(imageViewList.get(index));
}
}
然后用Volley請求網(wǎng)絡(luò),拿到數(shù)據(jù):
RequestQueue requestQueue = Volley.newRequestQueue(getApplicationContext());
StringRequest request = new StringRequest(URL, new Response.Listener<String>() {
@Override
public void onResponse(String s) {
//拿到網(wǎng)絡(luò)請求的數(shù)據(jù)
doSomething(s);
}
}, new Response.ErrorListener() {
@Override
public void onErrorResponse(VolleyError volleyError) {
Log.e(TGA, "", volleyError);
}
});
requestQueue.add(request);
用Gson解析症虑,得到圖片的Url的List缩歪,即imgs。同時new一個ImageView谍憔,用Glide加載后添加到image的List即imageViewList匪蝙,ImageView dot為小圓點。設(shè)置適配器韵卤,啟動線程:
private void doSomething(String s) {
DataInfo info = gson.fromJson(s, DataInfo.class);
DataInfo.DataEntity entity = info.getData();
imgs = entity.getImgs();
for (int i = 0; i < imgs.size(); i++) {
ImageView imageView = new ImageView(this);
imageView.setScaleType(ImageView.ScaleType.CENTER_INSIDE);
Glide.with(this)
.load(imgs.get(i).getPic_url_yasha())
.diskCacheStrategy(DiskCacheStrategy.ALL)
.into(imageView);
imageViewList.add(imageView);
ImageView dot = new ImageView(this);
dot.setImageResource(R.drawable.point_normal);
dot.setPadding(10, 5, 10, 5);
linearLayout.addView(dot);
}
MyAdapter adapter = new MyAdapter();
viewPager.setAdapter(adapter);
viewPager.setCurrentItem(currentIndex);
viewPager.addOnPageChangeListener(this);
handler.post(r);
}
用于循環(huán)播放的線程:
private Handler handler = new Handler();
Runnable r = new Runnable() {
@Override
public void run() {
if (isCyclical) {
if (System.currentTimeMillis() - lastTime > 2000) {
currentIndex++;
viewPager.setCurrentItem(currentIndex);
lastTime = System.currentTimeMillis();
}
//遞歸循環(huán)骗污,圖片切換速度3秒一張
handler.postDelayed(r, 3000);
}
}
};
伴隨圖片切換而切換的底部小圓點:
private void setCurrentSelector(int index) {
for (int i = 0; i < linearLayout.getChildCount(); i++) {
ImageView child = (ImageView) linearLayout.getChildAt(i);
if (i == index) {
child.setImageResource(R.drawable.point_selected);
} else {
child.setImageResource(R.drawable.point_normal);
}
}
}
最后在onDestroy()方法里面把循環(huán)線程停掉,不然你退出程序它還在運行:
@Override
protected void onDestroy() {
super.onDestroy();
isCyclical = false; //Activity退出后沈条,圖片循環(huán)線程停止
}
主要實現(xiàn)過程就醬紫~
附上全部代碼:
package com.sonnyzoom.viewpagerad;
import android.os.Bundle;
import android.os.Handler;
import android.support.v4.view.PagerAdapter;
import android.support.v4.view.ViewPager;
import android.support.v7.app.AppCompatActivity;
import android.support.v7.widget.Toolbar;
import android.util.Log;
import android.view.View;
import android.view.ViewGroup;
import android.widget.ImageView;
import android.widget.LinearLayout;
import com.android.volley.RequestQueue;
import com.android.volley.Response;
import com.android.volley.VolleyError;
import com.android.volley.toolbox.StringRequest;
import com.android.volley.toolbox.Volley;
import com.bumptech.glide.Glide;
import com.bumptech.glide.load.engine.DiskCacheStrategy;
import com.google.gson.Gson;
import com.sonnyzoom.viewpagerad.bean.DataInfo;
import java.util.ArrayList;
import java.util.List;
public class MainActivity extends AppCompatActivity implements ViewPager.OnPageChangeListener {
public static final String URL = "http://spark.api.xiami.com/sdk?v=sdk&method=mobile.sdk-image&device_id=de717e77-6330-3c13-b601-e3c6228d4f16&api_key=bbf59448b1d2a0254d033bfe3b4d8a30&call_id=1443063251736&api_sig=5c29b6c2ffed24d7f5b481d7deb0511e";
public static final String TGA = "MainActivity";
private ViewPager viewPager;
private LinearLayout linearLayout;
private List<DataInfo.DataEntity.ImgsEntity> imgs;
private List<ImageView> imageViewList;
private int currentIndex=300; //初始值可以設(shè)置大一點,防止左劃到盡頭诅炉。
private long lastTime;
private Gson gson;
private boolean isCyclical = true;
private Handler handler = new Handler();
Runnable r = new Runnable() {
@Override
public void run() {
if (isCyclical) {
if (System.currentTimeMillis() - lastTime > 2000) {
currentIndex++;
viewPager.setCurrentItem(currentIndex);
lastTime = System.currentTimeMillis();
}
//遞歸循環(huán)蜡歹,圖片切換速度3秒一張
handler.postDelayed(r, 3000);
}
}
};
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar);
setSupportActionBar(toolbar);
viewPager = (ViewPager) findViewById(R.id.viewPager);
linearLayout = (LinearLayout) findViewById(R.id.linearLayout);
imgs = new ArrayList<>();
imageViewList = new ArrayList<>();
gson = new Gson();
RequestQueue requestQueue = Volley.newRequestQueue(getApplicationContext());
StringRequest request = new StringRequest(URL, new Response.Listener<String>() {
@Override
public void onResponse(String s) {
//拿到網(wǎng)絡(luò)請求的數(shù)據(jù)
doSomething(s);
}
}, new Response.ErrorListener() {
@Override
public void onErrorResponse(VolleyError volleyError) {
Log.e(TGA, "", volleyError);
}
});
requestQueue.add(request);
}
private void doSomething(String s) {
DataInfo info = gson.fromJson(s, DataInfo.class);
DataInfo.DataEntity entity = info.getData();
imgs = entity.getImgs();
for (int i = 0; i < imgs.size(); i++) {
ImageView imageView = new ImageView(this);
imageView.setScaleType(ImageView.ScaleType.CENTER_INSIDE);
Glide.with(this)
.load(imgs.get(i).getPic_url_yasha())
.diskCacheStrategy(DiskCacheStrategy.ALL)
.into(imageView);
imageViewList.add(imageView);
ImageView dot = new ImageView(this);
dot.setImageResource(R.drawable.point_normal);
dot.setPadding(10, 5, 10, 5);
linearLayout.addView(dot);
}
MyAdapter adapter = new MyAdapter();
viewPager.setAdapter(adapter);
viewPager.setCurrentItem(currentIndex);
viewPager.addOnPageChangeListener(this);
handler.post(r);
}
@Override
public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) {
}
@Override
public void onPageSelected(final int position) {
Log.e("位置:", position + "");
currentIndex = position;
int index = position % imageViewList.size();
setCurrentSelector(index);
lastTime = System.currentTimeMillis();
}
@Override
public void onPageScrollStateChanged(int state) {
}
private void setCurrentSelector(int index) {
for (int i = 0; i < linearLayout.getChildCount(); i++) {
ImageView child = (ImageView) linearLayout.getChildAt(i);
if (i == index) {
child.setImageResource(R.drawable.point_selected);
} else {
child.setImageResource(R.drawable.point_normal);
}
}
}
class MyAdapter extends PagerAdapter {
@Override
public int getCount() {
return Integer.MAX_VALUE; //最大值,可以認為無限大涕烧,反正你劃不到盡頭就行了
}
@Override
public boolean isViewFromObject(View view, Object object) {
return view == object;
}
@Override
public Object instantiateItem(ViewGroup container, final int position) {
//在0~imageViewList.size()之間循環(huán)
int index = position % imageViewList.size();
imageViewList.get(index).setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
//處理圖片點擊事件....
Log.e("點擊圖片:",position % imageViewList.size()+"");
}
});
if (imageViewList.size() > 0) {
View view = imageViewList.get(index);
if (container.equals(view.getParent())) {
container.removeView(view);
}
container.addView(view);
return view;
}
return null;
}
@Override
public void destroyItem(ViewGroup container, int position, Object object) {
int index = position % imageViewList.size();
container.removeView(imageViewList.get(index));
}
}
@Override
protected void onDestroy() {
super.onDestroy();
isCyclical = false; //Activity退出后月而,圖片循環(huán)線程停止
}
}
源碼已上傳:Github
有什么錯誤或者建議可以在評論下面留言。