自定义封装 banner 组件
1. 效果图预览

2.基本功能
一个简单方便的轮播图组件,基于viewpager 基础上进行的封装。
可设置 项目中图片,网络图片, View;
支持循环自动播放,手势滑动切换,item点击事件,可设置 点点的样式宽高、颜色、大小、位置 ,;
可设置蒙层;可设置 是否允许滑动;可设置 是否允许循环。
3.基本实现
1. 自定义属性
<declare-styleable name="BannerLayoutStyle">
<attr name="maskStartColor" format="color|reference" />
<attr name="maskEndColor" format="color|reference" />
<attr name="selectedIndicatorColor" format="color|reference" />
<attr name="unSelectedIndicatorColor" format="color|reference" />
<attr name="indicatorShape" format="enum">
<enum name="rect" value="0" />
<enum name="oval" value="1" />
</attr>
<attr name="selectedIndicatorHeight" format="dimension|reference" />
<attr name="selectedIndicatorWidth" format="dimension|reference" />
<attr name="unSelectedIndicatorHeight" format="dimension|reference" />
<attr name="unSelectedIndicatorWidth" format="dimension|reference" />
<attr name="indicatorPosition" format="enum">
<enum name="centerBottom" value="0" />
<enum name="rightBottom" value="1" />
<enum name="leftBottom" value="2" />
<enum name="centerTop" value="3" />
<enum name="rightTop" value="4" />
<enum name="leftTop" value="5" />
</attr>
<attr name="indicatorSpace" format="dimension|reference" />
<attr name="indicatorMargin" format="dimension|reference" />
<attr name="autoPlayDuration" format="integer|reference" />
<attr name="scrollDuration" format="integer|reference" />
<attr name="isAutoPlay" format="boolean" />
<attr name="defaultImage" format="integer|reference" />
<attr name="isIndicatorVisible" format="boolean" />
<attr name="cornerRadii" format="dimension|reference" />
</declare-styleable>
2.基本方法
//添加本地图片路径
public void setViewRes(List<Integer> viewRes) {。。。} //添加网络图片路径
public void setViewUrls(List<String> urls) {。。。} //添加任意View视图
private void setViews2(final List<View> views) {。。。}
// 设置是否允许 循环
public void setLoop(boolean loop) { } // 设置是否可以滑动
public void setSlideable(boolean slideable) { }
更多用法 详见代码,这里就不全部粘贴了。
3.使用示例:
<com.dzq.widget.CustomBannerView
android:id="@+id/banner"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
app:autoPlayDuration="2000"
app:defaultImage="@drawable/bg_banner"
app:indicatorMargin="@dimen/indicatorMargin"
app:indicatorPosition="rightBottom"
app:indicatorShape="oval"
app:indicatorSpace="@dimen/indicatorSpace"
app:isAutoPlay="true"
app:isIndicatorVisible="true"
app:scrollDuration="1000"
app:selectedIndicatorColor="@color/color_ec407a"
app:selectedIndicatorHeight="5dp"
app:selectedIndicatorWidth="5dp"
app:unSelectedIndicatorColor="@color/color_71d9e7"
app:unSelectedIndicatorHeight="5dp"
app:unSelectedIndicatorWidth="5dp" /> <com.dzq.widget.CustomBannerView
android:id="@+id/banner2"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="5dp"
android:layout_weight="1"
app:autoPlayDuration="2000"
app:defaultImage="@drawable/bg_banner"
app:indicatorMargin="@dimen/indicatorMargin"
app:indicatorPosition="rightBottom"
app:indicatorShape="rect"
app:indicatorSpace="@dimen/indicatorSpace"
app:isAutoPlay="false"
app:isIndicatorVisible="true"
app:scrollDuration="1000"
app:selectedIndicatorColor="@color/color_ec407a"
app:selectedIndicatorHeight="5dp"
app:selectedIndicatorWidth="10dp"
app:unSelectedIndicatorColor="@color/color_71d9e7"
app:unSelectedIndicatorHeight="10dp"
app:unSelectedIndicatorWidth="5dp" /> <com.dzq.widget.CustomBannerView
android:id="@+id/banner3"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="5dp"
android:layout_weight="1"
app:cornerRadii="5dp"
app:indicatorMargin="@dimen/indicatorMargin"
app:indicatorPosition="centerTop"
app:indicatorShape="rect"
app:indicatorSpace="@dimen/indicatorSpace"
app:isAutoPlay="false"
app:isIndicatorVisible="true"
app:maskEndColor="#00000000"
app:maskStartColor="#99000000"
app:scrollDuration="1000"
app:selectedIndicatorColor="#00CAA9"
app:selectedIndicatorHeight="10dp"
app:selectedIndicatorWidth="25dp"
app:unSelectedIndicatorColor="#26000000"
app:unSelectedIndicatorHeight="10dp"
app:unSelectedIndicatorWidth="10dp" />
导入自己项目
How to
To get a Git project into your build:
Step 1. Add the JitPack repository to your build file
Add it in your root build.gradle at the end of repositories:
allprojects {
repositories {
...
maven { url 'https://jitpack.io' }
}
}
Step 2. Add the dependency
dependencies {
compile 'com.github.dingzuoqiang:CustomBannerView:v1.0'
}
自定义封装 banner 组件的更多相关文章
- iOS开发之自定义表情键盘(组件封装与自动布局)
下面的东西是编写自定义的表情键盘,话不多说,开门见山吧!下面主要用到的知识有MVC, iOS开发中的自动布局,自定义组件的封装与使用,Block回调,CoreData的使用.有的小伙伴可能会问写一个自 ...
- 自定义组件开发:使用v-model封装el-pagination组件
1.前言 通过封装el-pagination组件开发自定义分页组件的类似文章网上已经有很多了,但看了一圈,总是不如意,于是决定还是自己动手搞一个. 2.背景 2.1.常规分页处理方法 利用el-pag ...
- jQuery自定义插件--banner图滚动
前言 jQuery是一个功能强大的库,提供了开发JavaScript项目所需的所有核心函数.很多时候我们使用jQuery的原因就是因为其使用插件的功能,然而,有时候我们还是需要使用自定义代码来扩展这些 ...
- 使用shadow dom封装web组件
什么是shadow dom? 首先我们先来看看它长什么样子.在HTML5中,我们只用写如下简单的两行代码,就可以通过 <video> 标签来创建一个浏览器自带的视频播放器控件. <v ...
- 封装bootstrap-treegrid组件
封装bootstrap-treegrid组件 阅读目录 一.开源的treegrid 1.组件效果预览 2.组件开源地址 二.封装treegrid 1.组件封装的必要性 2.组件封装代码示例 3.封 ...
- react初探(二)之父子组件通信、封装公共组件
一.前言 在组件方面react和Vue一样的,核心思想玩的就是组件,下面举两个组件常用的情景. 场景一:假如我们现在有一个页面包含表格以及多个弹框,这种时候如果将这个页面的业务代码写在一个组件中,那么 ...
- React Native实战系列教程之自定义原生UI组件和VideoView视频播放器开发
React Native实战系列教程之自定义原生UI组件和VideoView视频播放器开发 2016/09/23 | React Native技术文章 | Sky丶清| 4 条评论 | 1 ...
- 如何发布自定义的UI 组件库到 npmjs.com 并且编写 UI组件说明文档
记录基于 antd 封装业务组件并发布到npm 上的过程:(TS + React + Sass) 初始化项目: 1.yarn create react-app winyhui --typescript ...
- 封装Vue组件的一些技巧
封装Vue组件的一些技巧 本文同步在个人博客shymean.com上,欢迎关注 写Vue有很长一段时间了,除了常规的业务开发之外,也应该思考和反思一下封装组件的正确方式.以弹窗组件为例,一种实现是在需 ...
随机推荐
- [转]chrome 的devtools 中setting 开启workspace , 也有点用处。不是很大
转载的,原文: http://wiki.jikexueyuan.com/project/chrome-devtools/saving-changes-with-workspaces.html ---- ...
- react jsx 常见问题
问题一: Expected to return a value in arrow function 解决方案: 修改后: // 使用 store return ( <div> <h1 ...
- php 获取今天,本周,本月,三个月内,半年内,今年的开始和结束时间
$now = time(); //今天 $today_audit_num = 0; $today_use_num = 0; $beginTim ...
- Ext sqlserver C# 数据库备份还原代码,给大家参考下
<%@ Page Language="C#" Inherits="System.Web.Mvc.ViewPage<dynamic>" %& ...
- tomcat的HTTPS
完美配置Tomcat的HTTPS 博客分类: Tomcat HTTPS Tomcat配置HTTPS的文章到处都有,过程也比较简单,随后文中会转一段过来. 但对于启用APR情况下报异常“java.l ...
- [办公应用]如何打印较小边距的PPT讲义(或者每页打印16页)
关键词:打印 PPT 讲义 4张 边距 今天同事问我如何打印PowerPoint的讲义.她自己使用PowerPoint打印讲义,设置每页4张,但是页边距太大:觉得浪费很大. 经过网上查阅后,现将方 ...
- 一些Razor语法
Layout asp.net mvc中的一些子视图忽然不行了,点击主视图后发现没有弹出来. 通过浏览器调试,发现打开子视图时,加载了大量的JS,CSS等.真奇怪啊,这些都是在主视图加载的啊,怎么子视图 ...
- easyUI里的checkbox编辑
数据源如果有布尔值,那么在UI里,最合适的控件应该就是checkbox了. easyUI的datagrid中,列的checkbox酱紫设置: {field:'status',title:'Status ...
- iOS开发——常见BUG——window决定程序的状态栏管理问题
Xcode7升级之后遇到的问题 问题一: 老项目在Xcode6上运行没有任何问题,但在Xcode7上运行直接崩了! 经过一波分析: 发现是因为我顶部状态栏处添加了topWindow,用于处理Tab ...
- SQL Server 运行计划操作符具体解释(1)——断言(Assert)
前言: 非常多非常多地方对于语句的优化,一般比較靠谱的回复即使--把运行计划发出来看看.当然那些仅仅看语句就说怎样怎样改代码,我一直都是拒绝的,由于这样的算是纯蒙.依据本人经验,大量的性能问题单纯从语 ...