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

Android实现广告图片轮播效果

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

龚蓓苾晒大学合影,经营婚姻的演员,韩剧朗朗与检察官

本文实例介绍了android广告轮播图效果实现方法,分享给大家供大家参考,具体内容如下

首先看下一下布局文件:

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

  <!-- 广告条的使用 -->

  <com.xuliugen.viewpager.myviewpagertransformeranim
    android:id="@+id/viewpager"
    android:layout_width="match_parent"
    android:layout_height="200dp" />

  <!-- 广告条下边的文字 -->

  <linearlayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_alignbottom="@id/viewpager"
    android:background="#33000000"
    android:orientation="vertical" >

    <textview
      android:id="@+id/image_desc"
      android:layout_width="match_parent"
      android:layout_height="wrap_content"
      android:gravity="center"
      android:text="@string/app_name"
      android:textcolor="@android:color/white"
      android:textsize="16sp" />

    <linearlayout
      android:id="@+id/point_group"
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:layout_gravity="center_horizontal"
      android:layout_marginbottom="5dp"
      android:orientation="horizontal" >
    </linearlayout>
  </linearlayout>

</relativelayout>

 

效果很简单,从布局文件中我们看到使用了一个自定义的viewpager动画,代码如下:

package com.xuliugen.viewpager;

import java.util.hashmap;
import java.util.map;

import android.content.context;
import android.support.v4.view.viewpager;
import android.util.attributeset;
import android.view.view;

import com.nineoldandroids.view.viewhelper;

/*
 * 自定义viewpager实现动画切换效果:
 * 
 * 1、需要拿到当前切换的两个view
 * 
 * 2、一个动画的梯度值
 */
public class myviewpagertransformeranim extends viewpager {

  private view mleft;
  private view mright;

  private float mtrans;
  private float mscale;

  private static final float min_scale = 0.6f;
  private map<integer, view> mchildren = new hashmap<integer, view>();

  /*
   * 要有两个构造方法
   */
  public myviewpagertransformeranim(context context, attributeset attrs) {
    super(context, attrs);
  }

  public myviewpagertransformeranim(context context) {
    super(context);
  }

  /*
   * 设置put的方法
   */
  public void setviewforposition(view view, int position) {
    mchildren.put(position, view);
  }

  /*
   * remove的方法
   */
  public void removeviewfromposition(integer position) {
    mchildren.remove(position);
  }

  /**
   * 重写的方法
   */
  @override
  protected void onpagescrolled(int position, float offset, int offsetpixels) {

    // log.e("tag", "position =" + position + ",offset = " + offset);
    mleft = mchildren.get(position);
    mright = mchildren.get(position + 1);

    animstack(mleft, mright, offset, offsetpixels);// 创建动画效果

    super.onpagescrolled(position, offset, offsetpixels);
  }

  private void animstack(view left, view right, float offset, int offsetpixels) {
    if (right != null) {

      // 从0-1页,offset:0`1
      mscale = (1 - min_scale) * offset + min_scale;

      mtrans = -getwidth() - getpagemargin() + offsetpixels;

      viewhelper.setscalex(right, mscale);
      viewhelper.setscaley(right, mscale);

      viewhelper.settranslationx(right, mtrans);
    }
    if (left != null) {
      left.bringtofront();
    }
  }
}

mainactivity.java

package com.xuliugen.viewpager;

import java.util.arraylist;

import android.app.activity;
import android.os.bundle;
import android.os.handler;
import android.support.v4.view.pageradapter;
import android.support.v4.view.viewpager;
import android.support.v4.view.viewpager.onpagechangelistener;
import android.view.view;
import android.view.viewgroup;
import android.widget.imageview;
import android.widget.linearlayout;
import android.widget.textview;

public class mainactivity extends activity {

  private viewpager viewpager;

  private linearlayout pointgroup;

  private textview iamgedesc;

  // 图片资源id
  private final int[] imageids = { r.drawable.a, r.drawable.b, r.drawable.c,
      r.drawable.d, r.drawable.e };

  // 图片标题集合
  private final string[] imagedescriptions = { "巩俐不低俗,我就不能低俗",
      "扑树又回来啦!再唱经典老歌引万人大合唱", "揭秘北京电影如何升级", "乐视网tv版大派送", "热血屌丝的反杀" };

  private arraylist<imageview> imagelist;

  /**
   * 上一个页面的位置
   */
  protected int lastposition;

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

    viewpager = (viewpager) findviewbyid(r.id.viewpager);
    pointgroup = (linearlayout) findviewbyid(r.id.point_group);
    iamgedesc = (textview) findviewbyid(r.id.image_desc);
    iamgedesc.settext(imagedescriptions[0]);

    imagelist = new arraylist<imageview>();
    for (int i = 0; i < imageids.length; i++) {

      // 初始化图片资源
      imageview image = new imageview(this);
      image.setbackgroundresource(imageids[i]);
      imagelist.add(image);

      // 添加指示点
      imageview point = new imageview(this);
      linearlayout.layoutparams params = new linearlayout.layoutparams(
          linearlayout.layoutparams.wrap_content,
          linearlayout.layoutparams.wrap_content);

      params.rightmargin = 20;
      point.setlayoutparams(params);

      point.setbackgroundresource(r.drawable.point_bg);
      if (i == 0) {
        point.setenabled(true);
      } else {
        point.setenabled(false);
      }
      pointgroup.addview(point);
    }

    viewpager.setadapter(new mypageradapter());

    // viewpager.setcurrentitem(integer.max_value/2 -
    // (integer.max_value/2%imagelist.size())) ;

    viewpager.setonpagechangelistener(new onpagechangelistener() {

      @override
      /**
       * 页面切换后调用 
       * position 新的页面位置
       */
      public void onpageselected(int position) {

        position = position % imagelist.size();

        // 设置文字描述内容
        iamgedesc.settext(imagedescriptions[position]);

        // 改变指示点的状态
        // 把当前点enbale 为true
        pointgroup.getchildat(position).setenabled(true);
        // 把上一个点设为false
        pointgroup.getchildat(lastposition).setenabled(false);
        lastposition = position;

      }

      @override
      /**
       * 页面正在滑动的时候,回调
       */
      public void onpagescrolled(int position, float positionoffset,
          int positionoffsetpixels) {
      }

      @override
      /**
       * 当页面状态发生变化的时候,回调
       */
      public void onpagescrollstatechanged(int state) {

      }
    });

    /*
     * 自动循环: 1、定时器:timer 2、开子线程 while true 循环 3、colckmanager 4、 用handler
     * 发送延时信息,实现循环
     */
    isrunning = true;
    // 设置图片的自动滑动
    handler.sendemptymessagedelayed(0, 3000);
  }

  /**
   * 判断是否自动滚动
   */
  private boolean isrunning = false;

  private handler handler = new handler() {
    public void handlemessage(android.os.message msg) {

      // 让viewpager 滑动到下一页
      viewpager.setcurrentitem(viewpager.getcurrentitem() + 1);
      if (isrunning) {
        handler.sendemptymessagedelayed(0, 3000);
      }
    };
  };

  protected void ondestroy() {

    isrunning = false;
  };

  private class mypageradapter extends pageradapter {

    @override
    /**
     * 获得页面的总数
     */
    public int getcount() {
      return integer.max_value; // 使得图片可以循环
    }

    @override
    /**
     * 获得相应位置上的view
     * container view的容器,其实就是viewpager自身
     * position   相应的位置
     */
    public object instantiateitem(viewgroup container, int position) {

      // system.out.println("instantiateitem ::" + position);

      // 给 container 添加一个view
      container.addview(imagelist.get(position % imagelist.size()));
      // 返回一个和该view相对的object
      return imagelist.get(position % imagelist.size());
    }

    @override
    /**
     * 判断 view和object的对应关系 
     */
    public boolean isviewfromobject(view view, object object) {
      if (view == object) {
        return true;
      } else {
        return false;
      }
    }

    @override
    /**
     * 销毁对应位置上的object
     */
    public void destroyitem(viewgroup container, int position, object object) {
      // system.out.println("destroyitem ::" + position);

      container.removeview((view) object);
      object = null;
    }
  }

}

另外我们看效果图可以看出,效果图下边的几个原点是变化的,所以我们需要一个selector,如下:

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

  <item android:drawable="@drawable/point_nomal" android:state_enabled="false"/>
  <item android:drawable="@drawable/point_focured" android:state_enabled="true"/>

</selector>

以上就是本文的全部内容,希望对大家的学习有所帮助。

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

相关文章:

验证码:
移动技术网