Android之仿淘宝倒计时

于 2018-11-15 11:11:10 发布
阅读量8.4k 收藏 13
点赞数 3
分类专栏： Android基础 文章标签： Android 仿淘宝倒计时 倒计时 活动倒计时
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/android_cll/article/details/84100726
版权

一：先上效果图（这里为了方便我就没弄gif图了，功能是能动的）

 

二：实现步骤：

1.自定义倒计时控件、

package com.cqxxny.myapplication;

import android.annotation.SuppressLint;
import android.content.Context;
import android.os.Handler;
import android.os.Message;
import android.util.AttributeSet;
import android.view.LayoutInflater;
import android.view.View;
import android.widget.LinearLayout;
import android.widget.TextView;
import android.widget.Toast;

import java.util.Timer;
import java.util.TimerTask;
/**
 * 功    能: 倒计时工具类
 * 所属模块:
 * 创建时间: 2018/11/15
 * 功能描述:
 */
@SuppressLint("HandlerLeak")
public class RushBuyCountDownTimerView extends LinearLayout {

	// 小时，十位
	private TextView tv_hour_decade;
	// 小时，个位
	private TextView tv_hour_unit;
	// 分钟，十位
	private TextView tv_min_decade;
	// 分钟，个位
	private TextView tv_min_unit;
	// 秒，十位
	private TextView tv_sec_decade;
	// 秒，个位
	private TextView tv_sec_unit;

	private Context context;

	private int hour_decade;
	private int hour_unit;
	private int min_decade;
	private int min_unit;
	private int sec_decade;
	private int sec_unit;
	// 计时器
	private Timer timer;

	private Handler handler = new Handler() {

		public void handleMessage(Message msg) {
			countDown();
		};
	};

	public RushBuyCountDownTimerView(Context context, AttributeSet attrs) {
		super(context, attrs);

		this.context = context;
		LayoutInflater inflater = (LayoutInflater) context
				.getSystemService(Context.LAYOUT_INFLATER_SERVICE);
		View view = inflater.inflate(R.layout.time, this);

		tv_hour_decade = (TextView) view.findViewById(R.id.tv_hour_decade);
		tv_hour_unit = (TextView) view.findViewById(R.id.tv_hour_unit);
		tv_min_decade = (TextView) view.findViewById(R.id.tv_min_decade);
		tv_min_unit = (TextView) view.findViewById(R.id.tv_min_unit);
		tv_sec_decade = (TextView) view.findViewById(R.id.tv_sec_decade);
		tv_sec_unit = (TextView) view.findViewById(R.id.tv_sec_unit);

	}

	/**
	 *
	 * @Description: 开始计时
	 * @param
	 * @return void
	 * @throws
	 */
	public void start() {

		if (timer == null) {
			timer = new Timer();
			timer.schedule(new TimerTask() {

				@Override
				public void run() {
					handler.sendEmptyMessage(0);
				}
			}, 0, 1000);
		}
	}

	/**
	 *
	 * @Description: 停止计时
	 * @param
	 * @return void
	 * @throws
	 */
	public void stop() {
		if (timer != null) {
			timer.cancel();
			timer = null;
		}
	}

	/**
	 * @throws Exception
	 *
	 * @Description: 设置倒计时的时长
	 * @param
	 * @return void
	 * @throws
	 */
	public void setTime(int hour, int min, int sec) {

		if (hour >= 60 || min >= 60 || sec >= 60 || hour < 0 || min < 0
				|| sec < 0) {
			throw new RuntimeException("Time format is error,please check out your code");
		}

		hour_decade = hour / 10;
		hour_unit = hour - hour_decade * 10;

		min_decade = min / 10;
		min_unit = min - min_decade * 10;

		sec_decade = sec / 10;
		sec_unit = sec - sec_decade * 10;

		tv_hour_decade.setText(hour_decade + "");
		tv_hour_unit.setText(hour_unit + "");
		tv_min_decade.setText(min_decade + "");
		tv_min_unit.setText(min_unit + "");
		tv_sec_decade.setText(sec_decade + "");
		tv_sec_unit.setText(sec_unit + "");

	}

	/**
	 *
	 * @Description: 倒计时
	 * @param
	 * @return boolean
	 * @throws
	 */
	private void countDown() {

		if (isCarry4Unit(tv_sec_unit)) {
			if (isCarry4Decade(tv_sec_decade)) {

				if (isCarry4Unit(tv_min_unit)) {
					if (isCarry4Decade(tv_min_decade)) {

						if (isCarry4Unit(tv_hour_unit)) {
							if (isCarry4Decade(tv_hour_decade)) {
								Toast.makeText(context, "时间到了",
										Toast.LENGTH_SHORT).show();
								stop();
							}
						}
					}
				}
			}
		}
	}

	/**
	 *
	 * @Description: 变化十位，并判断是否需要进位
	 * @param
	 * @return boolean
	 * @throws
	 */
	private boolean isCarry4Decade(TextView tv) {

		int time = Integer.valueOf(tv.getText().toString());
		time = time - 1;
		if (time < 0) {
			time = 5;
			tv.setText(time + "");
			return true;
		} else {
			tv.setText(time + "");
			return false;
		}

	}

	/**
	 *
	 * @Description: 变化个位，并判断是否需要进位
	 * @param
	 * @return boolean
	 * @throws
	 */
	private boolean isCarry4Unit(TextView tv) {

		int time = Integer.valueOf(tv.getText().toString());
		time = time - 1;
		if (time < 0) {
			time = 9;
			tv.setText(time + "");
			return true;
		} else {
			tv.setText(time + "");
			return false;
		}

	}
}

2.自定义控件xml、

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:gravity="center"
    android:orientation="horizontal">

    <TextView
        android:id="@+id/tv_hour_decade"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:background="@drawable/sousuo"
        android:gravity="center"
        android:padding="5dp"
        android:text="0"
        android:textColor="#ffffff"
        android:textSize="20dp" />

    <TextView
        android:id="@+id/tv_hour_unit"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginLeft="2dp"
        android:background="@drawable/sousuo"
        android:gravity="center"
        android:padding="5dp"
        android:text="0"
        android:textColor="#ffffff"
        android:textSize="20dp" />

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:gravity="center"
        android:text=":"
        android:padding="5dp"
        android:textColor="#454545"
        android:textSize="20dp" />

    <TextView
        android:id="@+id/tv_min_decade"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:background="@drawable/sousuo"
        android:gravity="center"
        android:text="0"
        android:padding="5dp"
        android:textColor="#ffffff"
        android:textSize="20dp"/>

    <TextView
        android:id="@+id/tv_min_unit"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginLeft="1dp"
        android:background="@drawable/sousuo"
        android:gravity="center"
        android:padding="5dp"
        android:text="0"
        android:textColor="#ffffff"
        android:textSize="20dp"/>

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:gravity="center"
        android:text=":"
        android:padding="5dp"
        android:textColor="#454545"
        android:textSize="20dp" />


    <TextView
        android:id="@+id/tv_sec_decade"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:background="@drawable/sousuo"
        android:gravity="center"
        android:text="0"
        android:padding="5dp"
        android:textColor="#ffffff"
        android:textSize="20dp"/>

    <TextView
        android:id="@+id/tv_sec_unit"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginLeft="1dp"
        android:background="@drawable/sousuo"
        android:gravity="center"
        android:padding="5dp"
        android:text="0"
        android:textColor="#ffffff"
        android:textSize="20dp" />

</LinearLayout>

3.自定义控件转圆角、

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android">

    <!-- 背景颜色 -->
    <solid android:color="#454545" />


    <!-- 控制边界线颜色和大小 -->
    <stroke
        android:width="1dp"
        android:color="#454545" />

    <!-- 控制圆角大小 -->
    <corners android:radius="5dp" />

</shape>

4.activity代码、

package com.cqxxny.myapplication;

import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;

public class MainActivity extends AppCompatActivity {
    /**
     * 功    能: 倒计时
     * 所属模块:
     * 创建时间: 2018/11/15
     * 功能描述:
     */
    private RushBuyCountDownTimerView timerView;
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        timerView = (RushBuyCountDownTimerView) findViewById(R.id.timerView);
        // 设置时间(hour,min,sec)
        timerView.setTime(10, 0, 10);
        // 开始倒计时
        timerView.start();
    }
}

5.activity的xml布局、

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:gravity="center"
    tools:context=".MainActivity">

    <com.cqxxny.myapplication.RushBuyCountDownTimerView
        android:id="@+id/timerView"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"></com.cqxxny.myapplication.RushBuyCountDownTimerView>

</LinearLayout>

--------------不喜勿喷，项目地址：https://download.csdn.net/download/android_cll/10786070

 

 

 

叶已初秋
关注
  • 3
    点赞
  • 踩
  • 13
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 0
    评论
专栏目录
仿淘宝倒计时
11-15
为了用户体验，倒计时得跑起来，所以自定义控件实现仿淘宝倒计时、
浅谈android中仅仅使用一个TextView实现高仿京东,淘宝各种倒计时
Mikyou的专栏
10-29 9940
今天给大家带来的是仅仅使用一个TextView实现一个高仿京东、淘宝、唯品会等各种电商APP的活动倒计时。最近公司一直加班也没来得及时间去整理，今天难得休息想把这个分享给大家，只求共同学习，以及自己后续的复习。为什么会想到使用一个TextView来实现呢？因为最近公司在做一些优化的工作，其中就有一个倒计时样式，原来开发的这个控件的同事使用了多个TextView拼接在一起的，实现的代码冗余比较大，故
Android定时器和倒计时实现淘宝秒杀功能
01-20
本文实例为大家分享了Android实现淘宝秒杀的具体代码，供大家参考，具体内容如下 目录结构 效果图： imageViewHolder public class imageViewHolder extends RecyclerView.ViewHolder { public ImageView imageView; public imageViewHolder(View itemView) { super(itemView); imageView = (ImageView) itemView; } } MyViewHolder public class MyView
仅使用TextView高仿京东淘宝各种APP活动倒计时样式Demo
11-08
仅使用TextView高仿京东淘宝各种APP活动倒计时样式Demo [注意：本资源来自网络，如有侵权，请联系我删除，谢谢。]
android仿淘宝倒计时控件
05-08
仿手机淘宝倒计时，自定义背景，非常好用，倒计时结束状态处理调用。
【Android界面实现】模仿淘宝客户端倒计时控件
热门推荐
赵凯强
09-26 1万+
在前面的文章中，我们分析了淘宝android客户端的一些界面时间和用户体验，今天这篇文章，主要介绍如何使用自定义控件，实现抢购倒计时的功能。     首先，我们看一下实现的效果。          实现效果很简单哈，就是一个倒计时的自定义控件。     下面我写一下
android 仿淘宝限时抢购倒计时
ン昔年昔日昔时ソ
08-17 1733
欢迎使用Markdown编辑器写博客本Markdown编辑器使用StackEdit修改而来，用它写博客，将会带来全新的体验哦： Markdown和扩展Markdown简洁的语法 代码块高亮 图片链接和图片上传 LaTex数学公式 UML序列图和流程图 离线写博客 导入导出Markdown文件 丰富的快捷键 快捷键 加粗 Ctrl + B 斜体 Ctrl + I 引用 Ctrl
Android 定时器+倒计时 仿淘宝秒杀
丶ban
01-04 6118
目录结构 imageViewHolder  public class imageViewHolder extends RecyclerView.ViewHolder { public ImageView imageView; public imageViewHolder(View itemView) { super(itemView);
Android仿淘宝倒计时
u011443596的专栏
09-02 1763
参考博客地址 效果图 布局文件 <?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:la
Android实现淘宝客户端倒计时界面
08-27
主要为大家详细介绍了Android实现淘宝客户端倒计时界面，具有一定的参考价值，感兴趣的小伙伴们可以参考一下
android studio倒计时三秒欢迎页面
12-19
一个用android studio写的倒计时进入页面Demo，主要帮助新手进行线程练习。可以点击倒计时按钮进入页面1
Android实现淘宝倒计时功能
08-26
主要为大家详细介绍了Android实现淘宝倒计时，具有一定的参考价值，感兴趣的小伙伴们可以参考一下
Android CountDownTimer实现倒计时器
08-31
主要为大家详细介绍了Android CountDownTimer实现倒计时效果的相关资料，具有一定的参考价值，感兴趣的小伙伴们可以参考一下
淘宝聚划算倒计时JS代码 - 精确到毫秒
10-15
淘宝聚划算倒计时JS代码 - 精确到毫秒 [保证可用]
Android中使用TextView实现高仿京东淘宝各种倒计时效果
01-20
今天给大家带来的是仅仅使用一个TextView实现一个高仿京东、淘宝、唯品会等各种电商APP的活动倒计时。最近公司一直加班也没来得及时间去整理，今天难得休息想把这个分享给大家，只求共同学习，以及自己后续的复习。为什么会想到使用一个TextView来实现呢？因为最近公司在做一些优化的工作，其中就有一个倒计时样式，原来开发的这个控件的同事使用了多个TextView拼接在一起的，实现的代码冗余比较大，故此项目经理就说:小宏这个就交给你来优化了，并且还要保证有一定的扩展性，当时就懵逼了。不知道从何处开始优化。然后我就查看京东，饿了么，唯品会等各个APP的倒计时，并在开发者中打开层级界面显示，发现他们都
仅使用TextView高仿京东淘宝各种APP活动倒计时样式
11-08
仅使用TextView高仿京东淘宝各种APP活动倒计时样式Demo
Android之surfaceview倒计时
最新发布
06-13
要在 Android 的 SurfaceView 中实现倒计时功能，您需要创建一个线程，该线程在 SurfaceView 上绘制计时器并更新计时器的值。以下是一个简单的示例，您可以参考： ```java public class CountdownSurfaceView extends SurfaceView implements SurfaceHolder.Callback { private SurfaceHolder mHolder; private CountdownThread mThread; private int mCountdownValue = 10; // 倒计时的初始值 public CountdownSurfaceView(Context context, AttributeSet attrs) { super(context, attrs); mHolder = getHolder(); mHolder.addCallback(this); } @Override public void surfaceCreated(SurfaceHolder holder) { mThread = new CountdownThread(mHolder, mCountdownValue); mThread.start(); } @Override public void surfaceChanged(SurfaceHolder holder, int format, int width, int height) { } @Override public void surfaceDestroyed(SurfaceHolder holder) { boolean retry = true; mThread.setRunning(false); while (retry) { try { mThread.join(); retry = false; } catch (InterruptedException e) { // 重试 } } } private class CountdownThread extends Thread { private SurfaceHolder mThreadHolder; private int mCountdownValue; private boolean mIsRunning = true; public CountdownThread(SurfaceHolder holder, int countdownValue) { mThreadHolder = holder; mCountdownValue = countdownValue; } public void setRunning(boolean isRunning) { mIsRunning = isRunning; } @Override public void run() { while (mIsRunning) { Canvas canvas = null; try { canvas = mThreadHolder.lockCanvas(); synchronized (mThreadHolder) { drawCountdown(canvas); Thread.sleep(1000); // 每秒钟更新一次计时器 mCountdownValue--; if (mCountdownValue == 0) { break; // 计时器结束 } } } catch (InterruptedException e) { // 重试 } finally { if (canvas != null) { mThreadHolder.unlockCanvasAndPost(canvas); } } } } private void drawCountdown(Canvas canvas) { Paint paint = new Paint(); paint.setColor(Color.WHITE); paint.setTextSize(100); canvas.drawColor(Color.BLACK); canvas.drawText(String.valueOf(mCountdownValue), getWidth() / 2, getHeight() / 2, paint); } } } ``` 在这个例子中，我们创建了一个 CountdownSurfaceView 类，它继承自 SurfaceView，并实现了 SurfaceHolder.Callback 接口。在 surfaceCreated() 方法中，我们创建了一个 CountdownThread 线程，并启动该线程。在 CountdownThread 线程中，我们使用 Canvas 绘制计时器，并使用 Thread.sleep() 方法使线程休眠一秒钟。每次线程醒来时，我们更新计时器的值，并检查计时器是否结束。如果计时器结束，我们退出线程。最后，在 surfaceDestroyed() 方法中，我们停止线程并等待线程结束。 请注意，在这个例子中，我们将计时器的值绘制在 SurfaceView 的中心。您可以根据自己的需要更改这个位置。

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

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

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

叶已初秋

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付：¥1
获取中
扫码支付

您的余额不足，请更换扫码支付或充值

打赏作者

实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

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

余额充值