热门标签 | HotTags
当前位置:  开发笔记 > Android > 正文

Android自定义控件实现简单的轮播图控件

这篇文章主要介绍了Android自定义控件实现简单的轮播图控件的相关资料,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下

最近要做一个轮播图的效果,网上看了几篇文章,基本上都能找到实现,效果还挺不错,但是在写的时候感觉每次都要单独去重新在Activity里写一堆代码。于是自己封装了一下。本篇轮播图实现原理原文出处:循环广告位组件的实现,这里只是做了下封装成一个控件,不必每次重复写代码了。

效果图:

实现分析
轮播图的功能就是实现左右滑动的广告、图片信息展示,那我们就用ViewPager来实现,由于考虑到用户体验,我们还需要在下面加一个指示器来标示滑动到了第几张轮播图。指示器我们可以用一个线性布局来根据要展示的轮播图设置显示的View,我们要做这样的一个控件没有什么特殊的效果,其实就是两个控件的组合,只是我们要在内部处理好它们之间的交互关系(其实就是ViewPager滚动的时候,下面指示器的展示),所以我们就用自定义控件当中的组合方式来实现。
下面开始

1、定义一个控件继承FrameLayout,写一个xml文件

public class CarouselView extends FrameLayout implements ViewPager.OnPageChangeListener {

  private Context context;

  private int totalCount =100;//总数,这是为实现无限滑动设置的

  private int showCount;//要显示的轮播图数量

  private int currentPosition =0;//当前ViewPager的位置

  private ViewPager viewPager;

  private LinearLayout carouselLayout;//展示指示器的布局

  private Adapter adapter;
  private int pageItemWidth;//每个指示器的宽度
  private boolean isUserTouched = false;

  public CarouselView(Context context) {
    super(context);
    this.cOntext= context;
  }

  public CarouselView(Context context, AttributeSet attrs) {
    super(context, attrs);
    this.cOntext= context;
  }

  public CarouselView(Context context, AttributeSet attrs, int defStyleAttr) {
    super(context, attrs, defStyleAttr);
    this.cOntext= context;
  }
<&#63;xml version="1.0" encoding="utf-8"&#63;>

上面的代码把两个要用到的控件ViewPager和carouselLayout都包含在定义的CarouselView里面了,下面就是要获取

2、onFinishInflate()中获取我们需要的控件

@Override
  protected void onFinishInflate() {
    super.onFinishInflate();
    View view = LayoutInflater.from(context).inflate(R.layout.carousel_layout,null);
    this.viewPager = (ViewPager) view.findViewById(R.id.gallery);
    this.carouselLayout = (LinearLayout)view.findViewById(R.id.CarouselLayoutPage);
    pageItemWidth = ConvertUtils.dip2px(context,5);
    this.viewPager.addOnPageChangeListener(this);
    addView(view);
  }

onFinishInflate()方法是自定义控件中常用的一个方法,它表示从XML加载组件完成了,在该方法中我们通过LayoutInflater.from(context).inflate 获取到个ViewPager对象和carouselLayout对象,并对pageItemWidth进行了赋值。
同时为viewPager设置addOnPageChangeListener。这里别忘记调用addView();否则控件就展示不了啦!

3、通过设置set方法来获取数据,同时初始化界面效果
到这一步我们已经获取到了展示轮播图的ViewPager对象,那接下来要让它展示你肯定想到了写个类继承PagerAdapter,然后重写getCount,isViewFromObject,isViewFromObject,destroyItem等方法来让ViewPager展示轮播图。但是我们又不能写得太固定,因为可能每个人想要展示的数据不一样,所以我们定义一个接口来给外部使用的人写自己的逻辑。上代码:

//定义一个接口让外部设置展示的View
public interface Adapter{
    boolean isEmpty();
    View getView(int position);
    int getCount();
  }
//ViewPager的适配器
class ViewPagerAdapter extends PagerAdapter {

    @Override
    public int getCount() {
      return totalCount;
    }

    @Override
    public boolean isViewFromObject(View view, Object object) {
      return view==object;
    }

    @Override
    public Object isViewFromObject(ViewGroup container, int position) {
      position %= showCount;
      //调用接口的getView()获取使用者要展示的View;
      View view = adapter.getView(position);
      container.addView(view);
      return view;
    }

    @Override
    public void destroyItem(ViewGroup container, int position, Object object) {
      container.removeView((View) object);
    }

    @Override
    public int getItemPosition(Object object) {
      return super.getItemPosition(object);
    }

    @Override
    public void finishUpdate(ViewGroup container) {
      super.finishUpdate(container);

      int position = viewPager.getCurrentItem();
      //实现Viewpager到第一页的实现能向左滑动
      if (position==0){
        position=showCount;
        viewPager.setCurrentItem(position,false);

      }else if (position==totalCount-1){//ViewPager到最后一页的实现向又滑动
        position = showCount - 1;
        viewPager.setCurrentItem(position,false);
      }
    }
  }
//为外部提供设置数据源的方法,同时为ViewPager做展示
public void setAdapter(Adapter adapter){
    this.adapter = adapter;
    if (adapter!=null){
      init();
    }
  }

上面的代码就是定义了一个接口让外部来设置数据,提供setAdapter来为adapter赋值,同时初始化界面效果,init()方法中就是数据的初始化,代码如下:

private void init() {
    viewPager.setAdapter(null);
    carouselLayout.removeAllViews();//清空之前的数据
    if (adapter.isEmpty()){
      return;
    }
    int count = adapter.getCount();
    showCount = adapter.getCount();
    for (int i=0;i

主要的逻辑代码就是这样啦,一个轮播图的控件就做好了。下面来看一下使用:

4、使用
xml中写我们的轮播图控件:



 

java代码中获取控件,同时设置接口

 CarouselView carouselView = (CarouselView) findViewById(R.id.CarouselView);
  carouselView.setAdapter(new CarouselView.Adapter() {
   @Override
   public boolean isEmpty() {
    return false;
   }

   @Override
   public View getView(int position) {
    View view = mInflater.inflate(R.layout.item,null);
    ImageView imageView = (ImageView) view.findViewById(R.id.image);
    imageView.setImageResource(mImagesSrc[position]);
    return view;
   }

   @Override
   public int getCount() {
    return mImagesSrc.length;
   }
  });

返回是否为空,在getView(int position)中return我们想返回的View,就是这么简单了啦。

希望本文所述对大家学习Android软件编程有所帮助。


推荐阅读
  • BeautifulSoup4 是一个功能强大的HTML和XML解析库,它能够帮助开发者轻松地从网页中提取信息。本文将介绍BeautifulSoup4的基本功能、安装方法、与其他解析工具的对比以及简单的使用示例。 ... [详细]
  • 本教程旨在指导开发者如何在Android应用中通过ViewPager组件实现图片轮播功能,适用于初学者和有一定经验的开发者,帮助提升应用的视觉吸引力。 ... [详细]
  • 在Android应用开发中,当在MenuItem中通过app:actionLayout属性使用Switch控件时,可能会遇到空指针异常的问题。本文将探讨该问题的原因及解决方案。 ... [详细]
  • SpringBoot新手入门指南
    本文旨在为初次接触SpringBoot的开发者提供一份详细的入门指导,包括如何快速搭建并运行一个简单的SpringBoot应用。通过本文,读者将了解Maven项目的构建、必要的配置文件设置以及基本的应用开发流程。 ... [详细]
  • 本视频详细介绍了如何利用J2EE、JBPM 3.x/4.3、Flex流程设计器、jQuery以及授权认证机制构建高效的企业普及版贝斯OA及工作流管理系统。 ... [详细]
  • BL550721、特点液晶驱动输出:Common输出4线,Segment输出36线内置显示寄存器364144bit2线串行接口(SCL,SDA)内置震荡电路内置液晶驱动电源电路13 ... [详细]
  • 本文介绍了如何在Windows操作系统中安装FFTW库,并详细说明了使用Visual Studio 2010进行4096点快速傅里叶变换(FFT)的步骤。包括下载预编译文件、生成库文件以及配置环境等关键环节。 ... [详细]
  • javascript——对象的概念——函数 1 (函数对象的属性和方法)
    一、创建函数函数是一种对象:Function类是对象,可以通过Function实例化一个函数,不过最多的还是利用function来创建函数。方式一:利用Function类来实例化函 ... [详细]
  • 在开发H5页面时,为了减少资源请求和简化工作流程,直接使用SVG和CSS3来创建简单的图形元素是一个高效的选择。本文将探讨如何不依赖于第三方图标库,仅通过HTML和CSS技术实现一个‘返回顶部’的图标。 ... [详细]
  • IEC60825激光产品安全标准详解
    随着激光技术在全球范围内的广泛应用,尤其是激光投影显示技术的兴起,了解和遵守相关的安全标准变得尤为重要。本文将详细介绍IEC60825激光产品安全标准及其重要性。 ... [详细]
  • Mysqlcheck作为MySQL提供的一个实用工具,主要用于数据库表的维护工作,包括检查、分析、修复及优化等操作。本文将详细介绍如何使用Mysqlcheck工具,并提供一些实践建议。 ... [详细]
  • LIN总线技术详解
    LIN(Local Interconnect Network)总线是一种基于UART/SCI(通用异步收发器/串行接口)的低成本串行通信协议,主要用于汽车车身网络中智能传感器和执行器之间的通信。 ... [详细]
  • 本文详细介绍了如何在本地环境中安装配置Frida及其服务器组件,以及如何通过Frida进行基本的应用程序动态分析,包括获取应用版本和加载的类信息。 ... [详细]
  • 第1章选择流程控制语句1.1顺序结构的基本使用1.1.1顺序结构概述是程序中最简单最基本的流程控制,没有特定的语法结构,按照代码的先后顺序,依次执行,程序中大多数的代码都是这样执行 ... [详细]
  • 本文介绍了一个基本的同步Socket程序,演示了如何实现客户端与服务器之间的简单消息传递。此外,文章还概述了Socket的基本工作流程,并计划在未来探讨同步与异步Socket的区别。 ... [详细]
author-avatar
昆明DVD导航
这个家伙很懒,什么也没留下!
PHP1.CN | 中国最专业的PHP中文社区 | DevBox开发工具箱 | json解析格式化 |PHP资讯 | PHP教程 | 数据库技术 | 服务器技术 | 前端开发技术 | PHP框架 | 开发工具 | 在线工具
Copyright © 1998 - 2020 PHP1.CN. All Rights Reserved | 京公网安备 11010802041100号 | 京ICP备19059560号-4 | PHP1.CN 第一PHP社区 版权所有