GithubHelp home page GithubHelp logo

mcxtzhang / animshopbutton Goto Github PK

View Code? Open in Web Editor NEW
1.3K 21.0 180.0 4.93 MB

A shopping cart button with a telescopic displacement rotation animation ...一个带伸缩位移旋转动画的购物车按钮

Home Page: http://blog.csdn.net/zxt0601/article/details/54235736

License: Apache License 2.0

Java 100.00%
shopping-cart-button animation ele

animshopbutton's Introduction

AnimShopButton

A shopping cart button with a telescopic displacement rotation animation ...

一个仿饿了么 带伸缩位移旋转动画的购物车按钮

注意,本控件非继承自ViewGroup,而是纯自定义View,实现的仿饿了么加入购物车控件,自带闪转腾挪动画的按钮。

图1 项目中使用的效果,考虑到了View回收复用

并且可以看到在RecyclerView中使用,切换LayoutManager也是没有问题的,

项目中使用的效果

图2 Demo效果,测试各种属性值

图2 Demo效果,测试各种属性值

图3 最新静态图

图3 最新静态图,测试各种属性值

Article

相关博文:

http://blog.csdn.net/zxt0601/article/details/54235736

想经济上支持我 or 想通过视频看我是怎么实现的:

http://edu.csdn.net/course/detail/3898

Import

Step 1. Add the JitPack repository to your build file

Step 1. 在项目根build.gradle文件中增加JitPack仓库依赖。

    allprojects {
		repositories {
			...
			maven { url "https://jitpack.io" }
		}
	}

Step 2. Add the dependency

    dependencies {
	        compile 'com.github.mcxtzhang:AnimShopButton:V1.2.0'
	}

Usage

xml:

	<!--使用默认UI属性-->
    <com.mcxtzhang.lib.AnimShopButton
        android:id="@+id/btn1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        app:maxCount="3"/>
    <!--设置了两圆间距-->
    <com.mcxtzhang.lib.AnimShopButton
        android:id="@+id/btn2"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        app:count="3"
        app:gapBetweenCircle="90dp"
        app:maxCount="99"/>
    <!--仿饿了么-->
    <com.mcxtzhang.lib.AnimShopButton
        android:id="@+id/btnEle"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        app:addEnableBgColor="#3190E8"
        app:addEnableFgColor="#ffffff"
        app:hintBgColor="#3190E8"
        app:hintBgRoundValue="15dp"
        app:hintFgColor="#ffffff"
        app:maxCount="99"/>

注意: 加减点击后,具体的操作,要根据业务的不同来编写了,设计到实际的购物车可能还有写数据库操作,或者请求接口等,要操作成功后才执行动画、或者修改count,这一块代码每个人写法可能不同。

使用时,可以重写onDelClick() onAddClick()方法,并在合适的时机回调onCountAddSuccess() onCountDelSuccess()以执行动画。

效果图如图2.

Attributes

name format description 中文解释
isAddFillMode boolean Plus button is opened Fill mode default is stroke (false) 加按钮是否开启fill模式 默认是stroke(false)
addEnableBgColor color The background color of the plus button 加按钮的背景色
addEnableFgColor color The foreground color of the plus button 加按钮的前景色
addDisableBgColor color The background color when the button is not available 加按钮不可用时的背景色
addDisableFgColor color The foreground color when the button is not available 加按钮不可用时的前景色
isDelFillMode boolean Plus button is opened Fill mode default is stroke (false) 减按钮是否开启fill模式 默认是stroke(false)
delEnableBgColor color The background color of the minus button 减按钮的背景色
delEnableFgColor color The foreground color of the minus button 减按钮的前景色
delDisableBgColor color The background color when the button is not available 减按钮不可用时的背景色
delDisableFgColor color The foreground color when the button is not available 减按钮不可用时的前景色
radius dimension The radius of the circle 圆的半径
circleStrokeWidth dimension The width of the circle 圆圈的宽度
lineWidth dimension The width of the line (+ - sign) 线(+ - 符号)的宽度
gapBetweenCircle dimension The spacing between two circles 两个圆之间的间距
numTextSize dimension The textSize of draws the number 绘制数量的textSize
maxCount integer max count 最大数量
count integer current count 当前数量
hintText string The hint text when number is 0 数量为0时,hint文字
hintBgColor color The hint background when number is 0 数量为0时,hint背景色
hintFgColor color The hint foreground when number is 0 数量为0时,hint前景色
hingTextSize dimension The hint text size when number is 0 数量为0时,hint文字大小
hintBgRoundValue dimension The background fillet value when number is 0 数量为0时,hint背景圆角值
ignoreHintArea boolean The UI/animation whether ignores the hint area UI显示、动画是否忽略hint收缩区域
perAnimDuration integer The duration of each animation, in ms 每一段动画的执行时间,单位ms
hintText string The hint text when number is 0 数量为0时,hint文字
replenishTextColor color TextColor in replenish status 补货中状态的文字颜色
replenishTextSize dimension TextSize in replenish status 补货中状态的文字大小
replenishText string Text hint in replenish status 补货中状态的文字
这么多属性够你用了吧。

Where to find me:

Github

CSDN

稀土掘金

简书

QQ群 :557266366


History

Version : 1.1.0,Time: 2017/01/12

  • 1 Feature : Add a boolean variable ignoreHintArea :The UI/animation whether ignores the hint area
  • 2 Feature : Add a int variable perAnimDuration : The duration of each animation, in ms

Version : 1.2.0 Time: 2017/02/08

  • 1 Feature : Add a status: replenishment.Click is not allowed at this time.
  • Judgment by setReplenish (boolean) and isReplenish ()

animshopbutton's People

Contributors

mcxtzhang avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

animshopbutton's Issues

建议增加minCount属性。

发现FailType中有COUNT_MIN,但是却无法设置最小值,建议增加这一功能,在某些情况下数量是不能为0的。

无法设置数字的颜色

如果底色为深色的话,在显示数量的时候会看不清,而方法中找不到设置的方法,还请指点或者添加一个属性,谢谢

不具体的长度

服务器的数据每个商品最大长度不一样,点减号减到0的时候显示加入购物车,再次点击加入购物车点击不了
,如果指定一个默认的值才没问题,请教一下怎么解决这种办法呢

点击事件

建议将onDelClick()和onAddClick()修饰符protected改成public

希望可以添加的新的添加删除监听

我在初始化的时候把传给你 然后再回调的时候 你把传回给我 这样做的好处是 在列表中可以对所有的回调接口进行管理 而不是每一次都新建一个Listener
ps: 这里T当然指的是泛型了

ignoreHintArea模式加号点击区域大于圆圈区域

您好,打扰了。
我感觉当在app:ignoreHintArea="true"模式的时候,加号点击区域变大算是bug
所以我在919行加了
if (isIgnoreHintArea()) {
if (mAddRegion.contains((int) event.getX(), (int) event.getY()))
onAddClick();
}else{
onAddClick();
}

在recyclerview中重新刷新数据时setCount数量不变或是错乱

首页界面viewpager中有3个fragment,fragment中用recyclerView显示商品列表,当在购物车编辑购买数量后用 EventBus 通知首页刷新商品列表,打log发现数据有改变,但 AnimShopButton中的数量确没变化,一开始还以为是 notifyDataSetChanged() 无效,但测试发现界面刷新了,但 AnimShopButton 数量还是没改变。

之前还碰到过,在商品列表中添加或减少购买数量,其他商品的 AnimShopButton 数量跟着改变,数字错乱

没有及时刷新

BottomSheetLayout 显示在AnimShopButton上面, 在BottomSheetLayout 修改AnimShopButton数量 ,没有及时更新,关闭屏幕 ,再打开手机屏幕 数量就刷新了

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.