android按钮进度动画,Android 实现环形进度按钮circular-progress-button

※效果

1cafcdcc19e54fe69c2035f8.html

※简介

显示进度的按钮,可用于数据的提交,系统登陆等,动画效果很棒,提升用户体验。

※使用说明

Declare button inside your layout XML file:android

android:id="@+id/btnWithText"

android:layout_width="196dp"

android:layout_height="64dp"

android:layout_marginTop="16dp"

android:textColor="@color/white"

android:textSize="18sp"

app:textComplete="@string/Complete"

app:textError="@string/Error"

app:textIdle="@string/Upload" />

Button state depends on progress:git

normal state [0]

progress state [1-99]

success state [100]

error state [-1]

To change progress use CircularProgressButton.setProgress(int value) method.github

Idle stateapp

CircularProgressButton.setProgress(0)ide

To change text app:textIdle="@string/Upload"

To change background color app:colorIdle="@color/green"

1cafcdcc19e54fe69c2035f8.html

Progress state 1布局

CircularProgressButton.setProgress(1) will automatically morph button from idle (square shape) state to progress (circle shape) state.动画

To change indicator color app:colorIndicator="@color/blue"

To change indicator background color app:colorIndicatorBackground="@color/grey"

To change circle background color app:colorProgress="@color/white"

1cafcdcc19e54fe69c2035f8.html

Progress state 50spa

CircularProgressButton.setProgress(50).net

1cafcdcc19e54fe69c2035f8.html

Complete state 100code

CircularProgressButton.setProgress(-1)

To change text app:textError="@string/Error"

To change background color app:colorError="@color/red"

1cafcdcc19e54fe69c2035f8.html

Error state -1

CircularProgressButton.setProgress(-1)

To change text app:textComplete="@string/Complete"

To change background color app:colorComplete="@color/green"

1cafcdcc19e54fe69c2035f8.html

You can set rounded corners

app:cornerRadius="48dp"

1cafcdcc19e54fe69c2035f8.html

You can use icons for complete & error states

app:iconComplete="@drawable/ic_action_accept"

1cafcdcc19e54fe69c2035f8.html

app:iconError="@drawable/ic_action_cancel"

1cafcdcc19e54fe69c2035f8.html

※代码

1.按钮的几种状态

初始状态 [0]

加载中 [1-99]

加载成功 [100]

加载失败 [-1]

经过调用此方法改变CircularProgressButton.setProgress(int value)

2.修改进度条样式

修改加载进度的颜色 app:colorIndicator="@color/blue"

修改加载进度的背景色 app:colorIndicatorBackground="@color/grey"

修改中间圆形的颜色 app:colorProgress="@color/white"

3.其余属性

失败时的文字 app:textError="@string/Error"

失败时的背景色 app:colorError="@color/red"

成功时的文字 app:textComplete="@string/Complete"

成功时的背景色 app:colorComplete="@color/green"

设置按钮圆角 app:cornerRadius="48dp"

设置成功时的图标 app:iconComplete="@drawable/ic_action_accept"

设置失败时的图标 app:iconError="@drawable/ic_action_cancel"

※注意事项

一行放置一个以上的按钮时须要注意一下,由于按钮点击后变为进度框时视图的宽度要发生改变,因此位置可能发生变化,须要注意下你的布局,能够放到按比例分开的线性布局,或放相对布局中定义宽度让它始终居中

※常见错误

※项目地址

https://github.com/dmytrodanylyk/circular-progress-button

※DEMO下载地址

http://download.csdn.net/detail/u010785585/7666287

※楼主博客

http://blog.csdn.net/linglongxin24

(这里会稍早些更新,还会定时更新些平时的一些开发技巧)

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值