当前位置： 移动技术网 > IT编程>移动开发>Android > Android实现轮播图片展示效果

Android实现轮播图片展示效果

2019年07月29日  | 移动技术网IT编程  | 我要评论

上海工程技术大学怎么样,金丝熊怎么养,王一鸣个人资料

本文实例为大家分享了android轮播图片的展示，供大家参考，具体内容如下

实现逻辑

1.创建xml布局文件,使用viewpager完成轮播图片

2.初始化viewpager控件,然后为控件设置适配器,创建出来的适配器实现里面的四个方法

3.四个方法分别是getcount isviewfromobject instantiateitem destroyitem

4.在oncreat方法中,加载图片资源,将图片id存在集合中,使图片能够在页面中显示,(图片之所以能够在页面中显示,是因为在适配器中的instantiateitem方法中获取了集合中的图片元素)

5.图片下方的文字显示:图片下方之所以会有文字,可以通过初始化控件,在viewpager监听器中的onpageselected方法中tv_desc.settext(descs[position]);这样文字就可以跟随者图片进行切换

6.文字下方的小圆点的切换:在xml布局中设置一个linlayout布局,然后再oncreat方法中设置小圆点,通过linearlayout.layoutparams layoutparams = new linearlayout.layoutparams(10, 10);的方法引入小圆点(具体代码可以参考下方的initdot方法)

7.要想让小圆点随着页面的切换而切换,可以定义下方的changedots的方法,让此方法在监听器中的onpageselected方法中进行调用

8.图片的无限轮播的实现:可以使适配器中的getcount返回值设为一个很大很大的值,同时在instantiateitem方法中设置position position = position % imageresids.length;防止索引越界异常,这样就可以使图片无限轮播,但是此时还有一个问题就是,右边可以无限轮播,但是左边是无法无限轮播的,这个问题的解决办法是在oncreat方法中设置当前选中的条目viewpager.setcurrentitem(count / 2);这样两边都可以实现无限轮播

9.图片自动切换的处理:使用handler机制实现页面的延时更新,同时为了防止内存溢出,需要在页面可见时,也就是activity的onstart方法中发送消息,在页面消失时,也就是onstop方法中删除消息

布局文件

<?xml version="1.0" encoding="utf-8"?>
<relativelayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="@+id/activity_main"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context="com.example.a2_.mainactivity">

<android.support.v4.view.viewpager
  android:id="@+id/vp"
  android:layout_width="match_parent"
  android:layout_height="250dp">
</android.support.v4.view.viewpager>

<linearlayout
  android:orientation="vertical"
  android:gravity="center"
  android:background="#66000000"
  android:layout_alignbottom="@id/vp"
  android:layout_width="match_parent"
  android:layout_height="50dp">

  <textview
    android:id="@+id/desc"
    android:text="描述文本"
    android:textcolor="#ffffff"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content" />

  <linearlayout
    android:id="@+id/layout_dot"
    android:orientation="horizontal"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content">

  </linearlayout>
</linearlayout>
</relativelayout>

核心代码

package com.example.a2_;

import android.os.handler;
import android.os.message;
import android.support.v4.view.pageradapter;
import android.support.v4.view.viewpager;
import android.support.v7.app.appcompatactivity;
import android.os.bundle;
import android.view.view;
import android.view.viewgroup;
import android.widget.imageview;
import android.widget.linearlayout;
import android.widget.textview;

import java.util.arraylist;

public class mainactivity extends appcompatactivity {
private static final int update_item = 1;
private arraylist<imageview> imageviews = new arraylist<>();
private int[] imageresids = {r.mipmap.icon_1, r.mipmap.icon_2, r.mipmap.icon_3,
    r.mipmap.icon_4, r.mipmap.icon_5};

private string[] descs = {"为梦想坚持", "我相信我是黑马", "黑马公开课", "google/io", "轻松1w+"};
private viewpager viewpager;
private textview tv_desc;
private linearlayout layout_dot;
private int count = 10000000;
private handler handler = new handler() {
  @override
  public void handlemessage(message msg) {
    switch (msg.what) {
      case update_item:
        updataitem();
        break;
    }
    super.handlemessage(msg);
  }
};

@override
protected void oncreate(bundle savedinstancestate) {
  super.oncreate(savedinstancestate);
  setcontentview(r.layout.activity_main);

  //初始化控件
  viewpager = (viewpager) findviewbyid(r.id.vp);
  tv_desc = (textview) findviewbyid(r.id.desc);
  layout_dot = (linearlayout) findviewbyid(r.id.layout_dot);
  //给viewpager设置适配器
  viewpager.setadapter(new mypageradapter());
  //对viewpager设置监听器
  viewpager.addonpagechangelistener(new viewpager.onpagechangelistener() {

    //当页面滚动时触发的时间
    @override
    public void onpagescrolled(int position, float positionoffset, int positionoffsetpixels) {

    }

    //当页面被选中时触发的方法
    @override
    public void onpageselected(int position) {
      //对position进行处理
      position = position % imageviews.size();
      //当页面被选中的时候,改变描述文本
      tv_desc.settext(descs[position]);
      changedots(position);
    }

    //当页面状态滚动状态发生改变时触发的事件
    @override
    public void onpagescrollstatechanged(int state) {
      //当页面空闲状态被改变的时候
      if (state == viewpager.scroll_state_idle) {
        handler.sendemptymessagedelayed(update_item, 3000);
      } else {
        handler.removemessages(update_item);
      }
    }
  });


  //初始化图片
  initimage();
  //初始化文字下方的点
  initdot();
  //当加载页面的时候,默认让第一个文本加载出来
//    initdescfirst();

  //使两边都可以无限轮播
  viewpager.setcurrentitem(count / 2);
//页面加载时更新
  updataitem();
}

private void updataitem() {
  int index = viewpager.getcurrentitem();
  viewpager.setcurrentitem(++index);
  handler.sendemptymessagedelayed(update_item, 3000);
}

//选中对应的原点
private void changedots(int position) {
  //先把所有的点恢复为白色
  for (int i = 0; i < layout_dot.getchildcount(); i++) {
    view view = layout_dot.getchildat(i);
    view.setselected(false);
  }
  //获取当前被选中的条目 设置为选中状态
  layout_dot.getchildat(position).setselected(true);

}

//初始化文字下方的点
private void initdot() {
  linearlayout.layoutparams layoutparams = new linearlayout.layoutparams(10, 10);
  layoutparams.setmargins(4, 4, 4, 4);
  for (int i = 0; i < imageviews.size(); i++) {
    view view = new view(this);
    view.setbackgroundresource(r.drawable.seletor_dot);
    view.setlayoutparams(layoutparams);
    layout_dot.addview(view);
  }
}

//当加载页面的时候,默认让第一个文本加载出来
private void initdescfirst() {
  tv_desc.settext(descs[0]);
  changedots(0);
}

//添加图片,准备一个imageview集合,用来交给instantiateitem添加到页面
private void initimage() {
  for (int i = 0; i < imageresids.length; i++) {
    //创建出imageview对象
    imageview imageview = new imageview(getapplicationcontext());
    imageview.setimageresource(imageresids[i]);
    imageviews.add(imageview);
  }
}

private class mypageradapter extends pageradapter {

  @override
  public int getcount() {
    return count;
  }

  @override
  public boolean isviewfromobject(view view, object object) {
    //判断这个view是不是通过instantiateitem创建出来的
    return view == object;
  }

  //用来创建条目
  @override
  public object instantiateitem(viewgroup container, int position) {
    position = position % imageresids.length;
    //获取条目
    imageview imageview = imageviews.get(position);
    container.addview(imageview);
    return imageview;
  }

  //用来销毁条目,,且最多会创建出三个条目,多出来的条目将会被销毁
  @override
  public void destroyitem(viewgroup container, int position, object object) {

    //销毁创建的条目
    container.removeview((view) object);
  }
}

@override
protected void onstart() {
  super.onstart();
  //当页面显示的时候,更新轮播图
  handler.sendemptymessagedelayed(update_item, 3000);
}

@override
protected void onstop() {
  super.onstop();
  //当页面不可见时,停止更新
  handler.removecallbacksandmessages(null);
}
}


以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持移动技术网。

您可能感兴趣的文章:

如对本文有疑问，请在下面进行留言讨论，广大热心网友会与你互动！！ 点击进行留言回复

相关文章:

验证码：
最近更新的文章
大家感兴趣的文章
移动技术网