Android 倒计时控件 CountDownView的实例代码详解

一个精简可自定义的倒计时控件,使用 Canvas.drawArc() 绘制。实现了应用开屏页的圆环扫过的进度条效果。

代码见https://github.com/hanjx-dut/CountDownView

使用

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

dependencies {
 implementation 'com.github.hanjx-dut:CountDownView:1.1'
}

实现的效果

效果图

对应的view:

 <com.hanjx.ui.CountDownView
  android:id="@+id/count_down_1"
  android:layout_width="wrap_content"
  android:layout_height="wrap_content"
  android:layout_gravity="center_horizontal"
  app:auto_start="true"
  app:text_mode="time_variant"
  app:duration="3000"
  app:paint_stroke="3dp"/>

 <com.hanjx.ui.CountDownView
  android:id="@+id/count_down_2"
  android:layout_width="wrap_content"
  android:layout_height="wrap_content"
  android:layout_gravity="center_horizontal"
  app:finished_color="#000000"
  app:auto_start="true"
  app:start_angle="90"
  app:text_mode="time_variant"
  app:duration="3000"
  app:paint_stroke="3dp"/>

 <com.hanjx.ui.CountDownView
  android:id="@+id/count_down_3"
  android:layout_width="wrap_content"
  android:layout_height="wrap_content"
  android:layout_gravity="center_horizontal"
  app:finished_color="#FF0000"
  app:unfinished_color="#00FF00"
  app:auto_start="true"
  app:duration="2000"
  app:refresh_interval="quick"
  app:text="跳过"
  app:text_size="12sp"
  app:text_color="#FF0000"
  app:text_mode="fixed"
  app:paint_stroke="2dp"/>

 <com.hanjx.ui.CountDownView
  android:id="@+id/count_down_4"
  android:layout_width="wrap_content"
  android:layout_height="wrap_content"
  android:layout_gravity="center_horizontal"
  app:auto_start="true"
  app:text_mode="fixed"
  app:clockwise="false"
  app:text=""
  app:duration="2000"
  app:paint_stroke="3dp"/>

 <com.hanjx.ui.CountDownView
  android:id="@+id/count_down_5"
  android:layout_width="wrap_content"
  android:layout_height="wrap_content"
  android:layout_gravity="center_horizontal"
  app:text_mode="time_variant"
  app:duration="5000"
  app:paint_stroke="1.5dp"/>

全部属性:

<declare-styleable name="CountDownView">
  <attr name="duration" format="integer"/> <!-- 总时间 -->
  <attr name="refresh_interval"> <!-- 刷新间隔 ms -->
   <enum name="normal" value="16"/>
   <enum name="quick" value="11"/>
   <enum name="slow" value="20"/>
  </attr>
  <attr name="paint_stroke" format="dimension"/> <!-- 圆环宽度 -->
  <attr name="finished_color" format="color"/> <!-- 扫过完成的颜色 -->
  <attr name="unfinished_color" format="color"/> <!-- 未完成的颜色 -->
  <attr name="start_angle" format="float"/> <!-- 起始角度 默认 -90 即顶部 -->
  <attr name="clockwise" format="boolean"/> <!-- 顺时针 默认 true -->
  <attr name="auto_start" format="boolean"/> <!-- 自动开始 默认 false -->

  <!-- 文字 -->
  <attr name="text" format="string"/> <!-- 设置文字 -->
  <attr name="text_mode"> <!-- 文字模式 固定 / 随时间倒数(默认)-->
   <enum name="fixed" value="0"/>
   <enum name="time_variant" value="1"/>
  </attr>
  <attr name="text_size" format="dimension"/> <!-- 文字尺寸 -->
  <attr name="text_color" format="color"/> <!-- 文字颜色 -->
 </declare-styleable>

文字部分没有提供更多的自定义属性,可以通过 setTextDrawer()对画笔和文字进行自定义,如 demo 中的第五个:

CountDownView countDownView = findViewById(R.id.count_down_5);
countDownView.setTextDrawer(new CountDownView.TextDrawer() {
 @Override
 public void setTextPaint(Paint paint, long leftTime, int textMode) {
  if (leftTime < 2000) {
   paint.setTextSize(SizeUtils.sp2px(12));
  }
  paint.setTypeface(Typeface.DEFAULT_BOLD);
  paint.setColor(0xFFFF802E);
 }

 @Override
 public String getText(long leftTime, int mode, String originText) {
  if (leftTime < 2000) {
   return "跳过";
  }
  return String.format("%ss", leftTime == 0 ? leftTime : leftTime / 1000 + 1);
 }
});

监听

countDownView.setCountDownListener(new CountDownView.CountDownListener() {
 @Override
 public void onTick(long leftTime, float finishedAngle) {
  // leftTime: 剩余时间, finishedAngle: 扫过的角度
 }

 @Override
 public void onStop(boolean reset) {
  // 主动调用 countDownView.stop() 时会触发此回调
 }

 @Override
 public void onFinished() {

 }
});

ps:接口都有默认实现,可以选择实现任意方法

总结

到此这篇关于Android 倒计时控件 CountDownView的实例代码详解的文章就介绍到这了,更多相关Android 倒计时控件 CountDownView内容请搜索我们以前的文章或继续浏览下面的相关文章希望大家以后多多支持我们!

(0)

相关推荐

  • android自定义倒计时控件示例

    自定义TextView控件TimeTextView代码: 复制代码 代码如下: import android.content.Context;import android.content.res.TypedArray;import android.graphics.Paint;import android.text.Html;import android.util.AttributeSet;import android.widget.TextView; import com.new0315.R;

  • Android自带倒计时控件Chronometer使用方法详解

    公司的以前的项目,看到使用了这个Android自带的倒计时控件Chronometer,现在整合了一下 先看看效果: <Chronometer android:id="@+id/chronometer" android:layout_width="wrap_content" android:layout_height="30dp" /> <Button android:onClick="start" andro

  • Android倒计时控件 Splash界面5秒自动跳转

    现在很多app的首页都有一个倒计时控件,比如说3秒或者5秒自动跳转界面,或者点击控件直接跳过 首先,自定义控件CircleProgressbar(参考网上资料) package com.zhoujian.mykeep.view; import android.annotation.TargetApi; import android.content.Context; import android.content.res.ColorStateList; import android.content.

  • Android基于CountDownView的时间控件扩展

    首先,新年的一年里祝大家,心想事成,鸡年大吉.去年的时候,我们做时间控件的时候一直遗留一个问题那就是正计时控件一直没有好的解决方案,我们很想把CountDownView既支持正计时又能支持倒计时.基于这个想法,便有了今天这篇文章,原理不在介绍,其实很简单,主要是我们知道怎么用,此控件的优点有: * 实现了正计时倒计时的统一 * 优化了Adapter,不再绑定控件Id * 一个属性实现正倒计时 * 不在为具体的时间属性设置别名 具体用法 1.xml文件 属性 app:isCountUp="fals

  • Android 倒计时控件 CountDownView的实例代码详解

    一个精简可自定义的倒计时控件,使用 Canvas.drawArc() 绘制.实现了应用开屏页的圆环扫过的进度条效果. 代码见https://github.com/hanjx-dut/CountDownView 使用 allprojects { repositories { ... maven { url 'https://jitpack.io' } } } dependencies { implementation 'com.github.hanjx-dut:CountDownView:1.1'

  • Android自定义指示器时间轴效果实例代码详解

    指示器时间轴在外卖.购物类的APP里会经常用到,效果大概就像下面这样,看了网上很多文章,大都是自己绘制,太麻烦,其实通过ListView就可以实现. 在Activity关联的布局文件activity_main.xml中放置一个ListView,代码如下.由于这个列表只是用于展示信息,并不需要用户去点击,所以将其clickable属性置为false:为了消除ListView点击产生的波纹效果,我们设置其listSelector属性的值为透明:我们不需要列表项之间的分割线,所以设置其divider属

  • Android实现图片自动切换功能(实例代码详解)

    在Android中图片的自动切换不仅可以实现自动切换,而且还可以使用手动切换.而且一般在切换的时候,在图片下方还带有其他内容的切换,用来标记是第几个图片的切换. 这种效果在我们日常生活中很常见,例如某宝购物,一些商城都可以使用到,用户体验度极好,今天小编就通过实例代码给大家分享android 图片自动切换功能的实现. 实现效果如下: 具体的示例代码如下: 布局代码: <?xml version="1.0" encoding="utf-8"?> <S

  • Android 实现控件悬浮效果实例代码

    随着移动互联网的快速发展,它已经和我们的生活息息相关了,在公交地铁里面都能看到很多人的人低头看着自己的手机屏幕,从此"低头族"一词就产生了,作为一名移动行业的开发人员,我自己也是一名"低头族",上下班时间在公交地铁上看看新闻来打发下时间,有时候也会看看那些受欢迎的App的一些界面效果,为什么人家的app那么受欢迎?跟用户体验跟UI设计也有直接的关系,最近在美团和大众点评的App看到如下效果,我感觉用户好,很人性化,所以自己也尝试着实现了下,接下来就讲解下实现思路!

  • Android MarginDesign控件TabLayout导航栏使用详解

    TabLayout的使用简单介绍 比如在平常的项目中实现这样的效果,一般都是都会使用viewPageIndicate等几个开源框架直接实现,或者使用自定义的HorizontalScroll再配合ViewPage+Fragment实现.在谷歌推出marginDesign之后,实现这种效果可以直接使用TabLayout实现.另外Tablayout可以通过自定义View自定义导航栏的效果.这样使用的时候更加灵活多变. 首先需要导入design包 在app的build.gradle下添加design的包

  • 简单仿写Android控件SlidingMenu的实例代码

    SlidingMenu (侧滑菜单形式)在android开发过程中,经常用到,这次我们通过一个简单案例来仿写SlidingMenu 的大体功能,下面 是主要实现的代码: java代码:(重写onTouchEvent方法 处理侧滑菜单处的事件分发机制) public class SlidingMenu extends ViewGroup implements OnClickListener { private View menu; private View main; private int me

  • Android开发之拖动条/滑动条控件、星级评分控件功能的实例代码

    ProgressBar有2个子控件: SeekBar   拖动条控件 RatingBar   星级评分控件 1.拖动条控件 <SeekBar android:layout_width="300dp" android:layout_height="wrap_content" android:id="@+id/seekBar" android:min="0" android:max="100" andro

  • android倒计时控件示例

    本文为大家分享了android倒计时控件,供大家参考,具体代码如下 /* * Copyright (C) 2012 The * Project * All right reserved. * Version 1.00 2012-2-11 * Author veally@foxmail.com */ package com.ly.sxh.view; import android.content.Context; import android.database.ContentObserver; im

  • Android实现状态栏和虚拟按键背景颜色的变化实例代码详解

    今天介绍一下,我在项目开发过程中,实现状态栏和虚拟按键背景颜色变化的方法,实现方式是,通过隐藏系统的状态栏和虚拟按键的背景,实现图片和背景显示到状态栏和虚拟按键下方.下面来看实现代码: 实现状态栏背景的设置 状态栏工具类 public class StatusBarUtil { /** * 设置沉浸式状态栏 * * @param activity 需要设置的activity */ public static void setTransparent(Activity activity) { //A

  • Android快速开发系列 10个常用工具类实例代码详解

    打开大家手上的项目,基本都会有一大批的辅助类,今天特此整理出10个基本每个项目中都会使用的工具类,用于快速开发~~在此感谢群里给我发项目中工具类的兄弟/姐妹~ 1.日志工具类L.java package com.zhy.utils; import android.util.Log; /** * Log统一管理类 * * * */ public class L { private L() { /* cannot be instantiated */ throw new UnsupportedOpe

随机推荐