图片自动轮播图

看到简书的app有一个图片轮播图,于是兴趣就跑了过来

基本效果如下


工作目录


话不多说,看代码

Step-one:布局文件

activity_main.xml

<?xml version="1.0" encoding="utf-8"?>

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"

android:layout_width="fill_parent"

android:layout_height="fill_parent"

android:background="#FFFFFF"

android:orientation="vertical" >

<LinearLayout

android:id="@+id/image_carousel"

android:orientation="vertical"

android:layout_width="match_parent"

android:layout_height="wrap_content">

</LinearLayout>

</LinearLayout>


banner.xml

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"

android:layout_width="match_parent"

android:layout_height="match_parent"

android:orientation="vertical" >

<FrameLayout

android:layout_width="match_parent"

android:layout_height="210dp" >

<android.support.v4.view.ViewPager

android:id="@+id/vp"

android:layout_width="match_parent"

android:layout_height="210dp" >

<RelativeLayout

android:layout_width="match_parent"

android:layout_height="wrap_content"

android:layout_gravity="bottom"

android:background="@drawable/shadow_article" >

<TextView

android:id="@+id/tv_date"

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:layout_above="@+id/author_layout"

android:layout_marginBottom="10dp"

android:layout_marginLeft="10dp"

android:maxLines="2"

android:text="3月4日"

android:textColor="@color/white"

android:textSize="18sp" >

<TextView

android:id="@+id/tv_title"

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:layout_above="@+id/author_layout"

android:layout_marginBottom="10dp"

android:layout_marginLeft="10dp"

android:layout_marginRight="10dp"

android:layout_toRightOf="@+id/tv_date"

android:maxLines="2"

android:text="我和令计划只是同姓"

android:textColor="@color/white"

android:textSize="18sp" >

<RelativeLayout

android:id="@+id/author_layout"

android:layout_width="match_parent"

android:layout_height="wrap_content"

android:layout_alignParentBottom="true"

android:layout_marginLeft="10dp"

android:gravity="center_vertical"

android:paddingBottom="20dp" >

<TextView

android:id="@+id/tv_pre"

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:text="文章选题来自"

android:textColor="@color/white"

android:textSize="12sp" >

<TextView

android:id="@+id/tv_topic_from"

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:layout_toRightOf="@+id/tv_pre"

android:text="阿宅的"

android:textColor="@color/white"

android:textSize="12sp" >

<TextView

android:id="@+id/tv_topic"

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:layout_marginLeft="10dp"

android:layout_toRightOf="@+id/tv_topic_from"

android:text="“我想知道令狐安和令计划有什么关系?”"

android:textColor="@color/white"

android:textSize="12sp" >

</RelativeLayout>

</RelativeLayout>

<LinearLayout

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:layout_marginTop="10dip"

android:layout_gravity="bottom|center_horizontal"

android:layout_marginBottom="10dp"

android:gravity="center" >

<View

android:id="@+id/v_dot0"

style="@style/dot_style"

android:background="@drawable/dot_focused"

android:visibility="invisible" >

<View

android:id="@+id/v_dot1"

style="@style/dot_style"

android:visibility="invisible">

<View

android:id="@+id/v_dot2"

style="@style/dot_style"

android:visibility="invisible">

<View

android:id="@+id/v_dot3"

style="@style/dot_style"

android:visibility="invisible">

<View

android:id="@+id/v_dot4"

style="@style/dot_style"

android:visibility="invisible" >

</LinearLayout>

</FrameLayout>

</LinearLayout>


Step-two:java文件

AdDomain.class

packagecom.samego.alic.imageloader;

/**

*广告实体

**/

public class AdDomain {

private  String   id;//广告id

private  String  date;//日期

private  String  title;//标题

private  String  topicFrom;//选题来自

private  String  topic;//选题

private String imgUrl;//图片url

private  boolean  isAd;//是否为广告

private   String  startTime;//广告开始时间

private  String endTime;//广告结束时间

private  String  targetUrl;//目标url

private  int  width;//宽

private  int  height;//高

private  boolean  available;//是否可用

public  String  getId() {

return  id;

}

public  void  setId(String id) {

this.id= id;

}

public  String  getTitle() {

return  title;

}

public   void  setTitle(String title) {

this.title= title;

}

public  String  getImgUrl() {

return  imgUrl;

}

public  void  setImgUrl(String imgUrl) {

this.imgUrl= imgUrl;

}

public  boolean  isAd() {

return  isAd;

}

public   void  setAd(boolean  isAd) {

this.isAd= isAd;

}

public  String  getDate() {

return  date;

}

public void  setDate(String  date) {

this.date= date;

}

public  String  getTopic() {

return  topic;

}

public   void  setTopic(String topic) {

this.topic= topic;

}

public  String  getTopicFrom() {

return  topicFrom;

}

public  void  setTopicFrom(String  topicFrom) {

this.topicFrom= topicFrom;

}

public  String  getStartTime() {

return  startTime;

}

public void  setStartTime(String  startTime) {

this.startTime= startTime;

}

public  String  getEndTime() {

return   endTime;

}

public void  setEndTime(String  endTime) {

this.endTime= endTime;

}

public  String  getTargetUrl() {

return  targetUrl;

}

public  void  set  TargetUrl(String  targetUrl) {

this.targetUrl= targetUrl;

}

public  int  getWidth() {

return   width;

}

public  void  setWidth(int  width) {

this.width= width;

}

public intgetHeight() {

return  height;

}

public  void  setHeight(intheight) {

this.height= height;

}

public boolean  isAvailable() {

return  available;

}

public  void   setAvailable(boolean  available) {

this.available= available;

}

}


ImageCarousel.class 封装好了的图片轮播主类

packagecom.samego.alic.imageloader;

importandroid.content.Context;

importandroid.graphics.Bitmap;

importandroid.os.Handler;

importandroid.os.Parcelable;

importandroid.support.v4.view.PagerAdapter;

importandroid.support.v4.view.ViewPager;

importandroid.view.LayoutInflater;

importandroid.view.View;

importandroid.view.ViewGroup;

importandroid.widget.ImageView;

importandroid.widget.LinearLayout;

importandroid.widget.TextView;

importcom.nostra13.universalimageloader.cache.disc.impl.UnlimitedDiscCache;

importcom.nostra13.universalimageloader.cache.memory.impl.LruMemoryCache;

importcom.nostra13.universalimageloader.core.DisplayImageOptions;

importcom.nostra13.universalimageloader.core.ImageLoader;

importcom.nostra13.universalimageloader.core.ImageLoaderConfiguration;

importcom.nostra13.universalimageloader.core.assist.ImageScaleType;

importcom.nostra13.universalimageloader.core.assist.QueueProcessingType;

importjava.io.File;

importjava.util.ArrayList;

importjava.util.List;

importjava.util.concurrent.Executors;

importjava.util.concurrent.ScheduledExecutorService;

importjava.util.concurrent.TimeUnit;

/**

*图片轮播主类

* Created by alic on 16-3-23.

*/

public classImageCarouselextendsLinearLayout {

privateLinearLayoutlinearLayout=this;

privateContextcontext;

privateContextapplicationContext;

public staticStringIMAGE_CACHE_PATH="imageloader/Cache";//图片缓存路径

//异步加载图片

privateImageLoadermImageLoader;

privateDisplayImageOptionsoptions;

//定义的五个指示点

privateViewdot0;

privateViewdot1;

privateViewdot2;

privateViewdot3;

privateViewdot4;

//轮播banner的数据

privateListadList;

privateListimageViews;//滑动的图片集合

privateListdots;//图片标题正文的那些点

privateListdotList;

privateTextViewtv_date;

privateTextViewtv_title;

privateTextViewtv_topic_from;

privateTextViewtv_topic;

private intcurrentItem=0;//当前图片的索引号

privateViewPageradViewPager;

privateScheduledExecutorServicescheduledExecutorService;

privateHandlerhandler=newHandler() {

public voidhandleMessage(android.os.Message msg) {

adViewPager.setCurrentItem(currentItem);

}

};

/**

*构造函数绘画一个轮播图

*

*@paramcontext

*@paramapplicationContext

*/

publicImageCarousel(Context context,Context applicationContext) {

super(context);

this.context= context;

this.applicationContext= applicationContext;

linearLayout= (LinearLayout) LayoutInflater.from(context).inflate(R.layout.banner, null);

//使用ImageLoader之前初始化

initImageLoader();

//获取图片加载实例

mImageLoader= ImageLoader.getInstance();

options=newDisplayImageOptions.Builder()

.showStubImage(R.drawable.ad)

.showImageForEmptyUri(R.drawable.ad)

.showImageOnFail(R.drawable.ad)

.cacheInMemory(true).cacheOnDisc(true)

.bitmapConfig(Bitmap.Config.RGB_565)

.imageScaleType(ImageScaleType.EXACTLY).build();

initAdData();

startAd();

}

/**

*获取轮播图的LinearLayout

*

*@return

*/

publicLinearLayoutgetLinearLayout() {

returnlinearLayout;

}

/**

*初始化图片的加载

*/

private voidinitImageLoader() {

File cacheDir = com.nostra13.universalimageloader.utils.StorageUtils

.getOwnCacheDirectory(applicationContext,

IMAGE_CACHE_PATH);

DisplayImageOptions defaultOptions =newDisplayImageOptions.Builder()

.cacheInMemory(true).cacheOnDisc(true).build();

ImageLoaderConfiguration config =newImageLoaderConfiguration.Builder(

context).defaultDisplayImageOptions(defaultOptions)

.memoryCache(newLruMemoryCache(12*1024*1024))

.memoryCacheSize(12*1024*1024)

.discCacheSize(32*1024*1024).discCacheFileCount(100)

.discCache(newUnlimitedDiscCache(cacheDir))

.threadPriority(Thread.NORM_PRIORITY-2)

.tasksProcessingOrder(QueueProcessingType.LIFO).build();

ImageLoader.getInstance().init(config);

}

/**

*初始化轮播图的数据处理

*/

private voidinitAdData() {

//广告数据

adList=getBannerAd();

imageViews=newArrayList();

//点

dots=newArrayList();

dotList=newArrayList();

dot0=linearLayout.findViewById(R.id.v_dot0);

dot1=linearLayout.findViewById(R.id.v_dot1);

dot2=linearLayout.findViewById(R.id.v_dot2);

dot3=linearLayout.findViewById(R.id.v_dot3);

dot4=linearLayout.findViewById(R.id.v_dot4);

dots.add(dot0);

dots.add(dot1);

dots.add(dot2);

dots.add(dot3);

dots.add(dot4);

tv_date= (TextView)linearLayout.findViewById(R.id.tv_date);

tv_title= (TextView)linearLayout.findViewById(R.id.tv_title);

tv_topic_from= (TextView)linearLayout.findViewById(R.id.tv_topic_from);

tv_topic= (TextView)linearLayout.findViewById(R.id.tv_topic);

adViewPager= (ViewPager)linearLayout.findViewById(R.id.vp);

adViewPager.setAdapter(newMyAdapter());//设置填充ViewPager页面的适配器

//设置一个监听器,当ViewPager中的页面改变时调用

adViewPager.setOnPageChangeListener(newMyPageChangeListener());

addDynamicView();

}

private voidaddDynamicView() {

//动态添加图片和下面指示的圆点

//初始化图片资源

for(inti =0;i

ImageView imageView =newImageView(context);

//异步加载图片

mImageLoader.displayImage(adList.get(i).getImgUrl(),imageView,options);

imageView.setScaleType(ImageView.ScaleType.CENTER_CROP);

imageViews.add(imageView);

dots.get(i).setVisibility(View.VISIBLE);

dotList.add(dots.get(i));

}

}

/**

*启动轮播图

*/

private voidstartAd() {

scheduledExecutorService= Executors.newSingleThreadScheduledExecutor();

//当Activity显示出来后,每两秒切换一次图片显示

scheduledExecutorService.scheduleAtFixedRate(newScrollTask(),1,5,

TimeUnit.SECONDS);

}

/**

*启动轮播图的任务

*/

private classScrollTaskimplementsRunnable {

@Override

public voidrun() {

synchronized(adViewPager) {

currentItem= (currentItem+1) %imageViews.size();

handler.obtainMessage().sendToTarget();

}

}

}

private classMyPageChangeListenerimplementsViewPager.OnPageChangeListener {

private intoldPosition=0;

@Override

public voidonPageScrollStateChanged(intarg0) {

}

@Override

public voidonPageScrolled(intarg0, floatarg1, intarg2) {

}

@Override

public voidonPageSelected(intposition) {

currentItem= position;

AdDomain adDomain =adList.get(position);

tv_title.setText(adDomain.getTitle());//设置标题

tv_date.setText(adDomain.getDate());

tv_topic_from.setText(adDomain.getTopicFrom());

tv_topic.setText(adDomain.getTopic());

dots.get(oldPosition).setBackgroundResource(R.drawable.dot_normal);

dots.get(position).setBackgroundResource(R.drawable.dot_focused);

oldPosition= position;

}

}

private classMyAdapterextendsPagerAdapter {

@Override

public intgetCount() {

returnadList.size();

}

@Override

publicObjectinstantiateItem(ViewGroup container, intposition) {

ImageView iv =imageViews.get(position);

((ViewPager) container).addView(iv);

finalAdDomain adDomain =adList.get(position);

//在这个方法里面设置图片的点击事件

iv.setOnClickListener(newOnClickListener() {

@Override

public voidonClick(View v) {

//处理跳转逻辑

}

});

returniv;

}

@Override

public voiddestroyItem(View arg0, intarg1,Object arg2) {

((ViewPager) arg0).removeView((View) arg2);

}

@Override

public booleanisViewFromObject(View arg0,Object arg1) {

returnarg0 == arg1;

}

@Override

public voidrestoreState(Parcelable arg0,ClassLoader arg1) {

}

@Override

publicParcelablesaveState() {

return null;

}

@Override

public voidstartUpdate(View arg0) {

}

@Override

public voidfinishUpdate(View arg0) {

}

}

/**

*轮播广播模拟数据

*

*@return

*/

public staticListgetBannerAd() {

List adList =newArrayList();

AdDomain adDomain =newAdDomain();

adDomain.setId("108078");

adDomain.setDate("3月4日");

adDomain.setTitle("title");

adDomain.setTopicFrom("阿宅");

adDomain.setTopic("theme");

adDomain.setImgUrl("http://img.taodiantong.cn/v55183/infoimg/2013-07/130720115322ky.jpg");

adDomain.setAd(false);

adList.add(adDomain);

AdDomain adDomain2 =newAdDomain();

adDomain2.setId("108078");

adDomain2.setDate("3月5日");

adDomain2.setTitle("title");

adDomain2.setTopicFrom("小巫");

adDomain2.setTopic("“theme”");

adDomain2.setImgUrl("http://img.taodiantong.cn/v55183/infoimg/2013-07/130720115322ky.jpg");

adDomain2.setAd(false);

adList.add(adDomain2);

AdDomain adDomain3 =newAdDomain();

adDomain3.setId("108078");

adDomain3.setDate("3月6日");

adDomain3.setTitle("title");

adDomain3.setTopicFrom("旭东");

adDomain3.setTopic("“theme”");

adDomain3.setImgUrl("http://img.taodiantong.cn/v55183/infoimg/2013-07/130720115322ky.jpg");

adDomain3.setAd(false);

adList.add(adDomain3);

AdDomain adDomain4 =newAdDomain();

adDomain4.setId("108078");

adDomain4.setDate("3月7日");

adDomain4.setTitle("title");

adDomain4.setTopicFrom("小软");

adDomain4.setTopic("“theme”");

adDomain4.setImgUrl("http://img.taodiantong.cn/v55183/infoimg/2013-07/130720115322ky.jpg");

adDomain4.setAd(false);

adList.add(adDomain4);

AdDomain adDomain5 =newAdDomain();

adDomain5.setId("108078");

adDomain5.setDate("3月8日");

adDomain5.setTitle("title");

adDomain5.setTopicFrom("大熊");

adDomain5.setTopic("“theme”");

adDomain5.setImgUrl("http://img.taodiantong.cn/v55183/infoimg/2013-07/130720115322ky.jpg");

adDomain5.setAd(true);//代表是广告

adList.add(adDomain5);

returnadList;

}

}


MainActivity.class主测试类

packagecom.samego.alic.imageloader;

importandroid.app.Activity;

importandroid.os.Bundle;

importandroid.widget.LinearLayout;

/**

* Created by alic on 16-3-23.

*/

public classMainActivityextendsActivity {

privateLinearLayoutimageCarouselLinearLayout;

privateLinearLayoutlayout;

@Override

protected voidonCreate(BundlesavedInstanceState) {

super.onCreate(savedInstanceState);

setContentView(R.layout.activity_main);

ImageCarousel imageCarousel =newImageCarousel(this,getApplicationContext());

imageCarouselLinearLayout= imageCarousel.getLinearLayout();

layout= (LinearLayout) findViewById(R.id.image_carousel);

layout.addView(imageCarouselLinearLayout);

}

}

网上的基本都是还没有封装好的或者需要引入很重的库文件。

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

发表于

我来说两句

0 条评论
登录 后参与评论

相关文章

来自专栏向治洪

android 特卖列表倒计时卡顿问题

在Android的开发中,我们经常遇见倒计时的操作,通常使用Timer和Handler共同操作来完成。当然也可以使用Android系统控件CountDownTi...

3279
来自专栏Android开发指南

3.CursorAdapter

39915
来自专栏Android干货

浅谈RecyclerView(完美替代ListView,GridView)

5466
来自专栏向治洪

仿qq最新侧滑菜单

为了后续对这个项目进行优化,比如透明度动画、背景图的位移动画,以及性能上的优化。 我把这个项目上传到github上面,请大家随时关注。 github地址 htt...

5129
来自专栏向治洪

仿淘宝收货地址,本地数据库

谁说咱们攻城狮不能写出既幽默又能懂的博客呢,本人想推出一系列博文,可以给刚接触Android开发的做一个参考,也可以与接触Android已久的各路大神比较一下,...

1.3K7
来自专栏向治洪

viewpager循环滚动和自动轮播的问题

ViewPager是一个常用的android组件,不过通常我们使用ViewPager的时候不能实现左右无限循环滑动,在滑到边界的时候会看到一个不能翻页的动画,...

3436
来自专栏向治洪

android自定义状态栏颜色

我们知道IOS上的应用,状态栏的颜色总能与应用标题栏颜色保持一致,用户体验很不错,那安卓是否可以呢?若是在安卓4.4之前,答案是否定的,但在4.4之后,谷歌允...

3276
来自专栏向治洪

android来电归属地提醒

现在市面上常用的一些拨号软件的一个功能,来电归属地。拨号的时候,会在拨号界面出现一个号码归属地的小框框。效果如下:而且这个小窗体还可以自定义风格,并且可以自由移...

2577
来自专栏向治洪

android电话拦截

其实大家可以下载 xxx卫士看下,它设置来电拒接模式后,都是会启动设置MMI指令的界面。然后再去“设置->通话设置->来电转接”,看看 “占线时转接” 设置好的...

5339
来自专栏Android开发经验

常用的代码片段,不断更新

1482

扫码关注云+社区

领取腾讯云代金券