倒计时时间控件

在做一些电商或购物的app时,我们经常会看到倒计时抢购的标示,今天恰有时间把项目中用到的该控件提取出来,有需要的可以参考下

======================================================================================================

版权所有,如需转载请标明出处:http://blog.csdn.net/you4580

=======================================================================================================

<?xml version="1.0" encoding="utf-8"?>

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"

android:layout_width="fill_parent"

android:layout_height="fill_parent"

android:orientation="horizontal" >

<TextView

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:text="@string/ele_surplus"

android:textColor="#999999"

android:textSize="14sp" />

<TextView

android:id="@+id/electricity_time_day"

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:layout_marginLeft="3dp"

android:layout_marginRight="3dp"

android:background="@drawable/electricity_countdown"

android:gravity="center"

android:minWidth="24dp"

android:padding="3dp"

android:textColor="#1A7FCF"

android:textSize="12sp" />

<TextView

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:text="天"

android:textColor="#999999"

android:textSize="14sp" />

<TextView

android:id="@+id/electricity_time_hour"

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:layout_marginLeft="3dp"

android:layout_marginRight="3dp"

android:background="@drawable/electricity_countdown"

android:gravity="center"

android:minWidth="24dp"

android:padding="3dp"

android:textColor="#1A7FCF"

android:textSize="12sp" />

<TextView

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:text="时"

android:textColor="#999999"

android:textSize="14sp" />

<TextView

android:id="@+id/electricity_time_min"

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:layout_marginLeft="3dp"

android:layout_marginRight="3dp"

android:background="@drawable/electricity_countdown"

android:gravity="center"

android:minWidth="24dp"

android:padding="3dp"

android:textColor="#1A7FCF"

android:textSize="12sp" />

<TextView

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:text="分"

android:textColor="#999999"

android:textSize="14sp" />

<TextView

android:id="@+id/electricity_time_mse"

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:layout_marginLeft="3dp"

android:layout_marginRight="3dp"

android:background="@drawable/electricity_countdown"

android:gravity="center"

android:minWidth="24dp"

android:padding="3dp"

android:textColor="#1A7FCF"

android:textSize="12sp" />

<TextView

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:text="秒"

android:textColor="#999999"

android:textSize="14sp" />

</LinearLayout>

======================================================================================================

/**

* TimeTextView 倒计时控件

*

* @DESCRIPTION:

* @AUTHOR:you4580

* @VERSION:v1.0

* @DATE:2015-4-20

*/

public class TimeTextView extends LinearLayout{

private Context mContext;

private TextView mDay,mHour,mMin,mMse;

private long days,hours,minutes,seconds;

private boolean run = true; //是否启动了

private Handler handler = new Handler(){

@Override

public void handleMessage(Message msg) {

switch (msg.what) {

case 0:

if (run) {

if(computeTime()){

setUi();

handler.sendEmptyMessageDelayed(0, 1000);

}

}

break;

}

}

};

public TimeTextView(Context context){

super(context);

this.mContext = context;

inflateLayout();

};

public TimeTextView(Context context, AttributeSet attrs) {

super(context, attrs);

this.mContext = context;

inflateLayout();

}

@SuppressLint("NewApi")

public TimeTextView(Context context, AttributeSet attrs,int defStyle) {

super(context, attrs, defStyle);

this.mContext = context;

inflateLayout();

}

private void inflateLayout(){

this.addView(LayoutInflater.from(mContext).inflate(R.layout.time_textview, null));

mDay = (TextView) this.findViewById(R.id.electricity_time_day);

mHour = (TextView) this.findViewById(R.id.electricity_time_hour);

mMin = (TextView) this.findViewById(R.id.electricity_time_min);

mMse = (TextView) this.findViewById(R.id.electricity_time_mse);

}

public void setTime(String day,String hour,String minute,String second){

if(TextUtils.isEmpty(day)){

days = 0;

}else{

days = Long.parseLong(day);

}

if(TextUtils.isEmpty(hour)){

hours = 0;

}else{

hours = Long.parseLong(hour);

}

if(TextUtils.isEmpty(minute)){

minutes = 0;

}else{

minutes = Long.parseLong(minute);

}

if(TextUtils.isEmpty(second)){

seconds = 0;

}else{

seconds = Long.parseLong(second);

}

setUi();

handler.removeMessages(0);

//每隔1秒钟发送一次handler消息

handler.sendEmptyMessageDelayed(0,1000);

}

private void setUi(){

mDay.setText(String.valueOf(days));

mHour.setText(String.valueOf(hours));

mMin.setText(String.valueOf(minutes));

mMse.setText(String.valueOf(seconds));

}

private boolean computeTime(){

boolean flag = true;

seconds--;

if (seconds < 0) {

minutes--;

seconds = 59;

if (minutes < 0) {

minutes = 59;

hours--;

if (hours < 0) {

hours = 23;

days--;

if(days<0){

flag = false;

}

}

}

}

return flag;

}

public void stopComputeTime(){

run = false;

}

}

==================================================================================================

调用自定义控件的布局文件

<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:paddingBottom="@dimen/activity_vertical_margin"

android:paddingLeft="@dimen/activity_horizontal_margin"

android:paddingRight="@dimen/activity_horizontal_margin"

android:paddingTop="@dimen/activity_vertical_margin"

tools:context="com.example.timetextview.MainActivity" >

<com.example.timetextview.view.TimeTextView

android:id="@+id/electricity_countdown"

android:layout_width="wrap_content"

android:layout_height="wrap_content" />

</LinearLayout>

===================================================================================================

public class MainActivity extends ActionBarActivity {

private TimeTextView mTimeTextView;

@Override

protected void onCreate(Bundle savedInstanceState) {

super.onCreate(savedInstanceState);

setContentView(R.layout.activity_main);

mTimeTextView=(TimeTextView) findViewById(R.id.electricity_countdown);

//为控件设置一个初始时间,通常是服务器给返回一组时间

mTimeTextView.setTime("5","00","00","00");

}

}

=======================================================================================================================

时间: 2024-10-12 21:41:29

倒计时时间控件的相关文章

vue小荔枝,时间控件,动态按月份增减。

依赖框架有jq,bootstrap3.0,vue2.0; 自封装(搬运)时间控件,bootstrap-datetimepicker.资源下载:看这里 需求: 默认本地时间,相隔一个月 四个选项:1一个月,一个季度,半年,一年. 如果结束日期不变,那么默认递增即可,如果结束日期改变了,以变更的日期递增月份. html结构: <div id="app"> <div class="col-md-5 form-inline"> <div cla

jquery-ui日期时间控件实现

日期控件和时间控件为独立控件,日期时间控件要同一时候导入日期控件和时间控件的js,然后在日期控件加入时间控件显示參数,没有导入时间控件js.日期控件函数设置的时间控件參将包错 日期控件官网网址:http://jqueryui.com/ 日期控件js:jquery-ui.js 相应函数及默认属性设置:function Datepicker() 时间控件官网网址:http://plugins.jquery.com/jt.timepicker/ 时间控件js:jquery-ui-timepicker-

从零开始学_JavaScript_系列(九)——dojo(2)(AJAX、时间控件、鼠标事件、样式修改、事件移除、消息发布订阅)

(21)和(22)写的不好,跳过. (23)AJAX异步加载 插件:dojo/request 参数:request 语法(get): request.get(URL).then(成功回调函数,失败回调函数); 第一个回调函数是成功的,参数用response:(也可以用其他的) 第二个回调函数是失败的,参数用error:(也可以用其他的) 注: ①读取本地比较简单,直接填写本地的url即可: ②如果读取服务器端(比如数据库),那么需要相应的支持,例如python脚本等(我自己目前对python.和

My97DatePicker时间控件

之前一直使用easyui控件无法实现只显示yyyy年MM月格式或者显示yyyyMM格式.相比My97DatePicker时间控件更为强大些. 只要在页面引用如下脚本,WdatePicker.js内部会引用其它js. <script type="text/javascript" src="<%=root%>/Common/My97DatePicker/WdatePicker.js"></script> 然后在input中编写oncl

DatePicker日期与时间控件

DatePicker日期与时间控件 一.简介 二.方法 三.代码实例 四.收获

rf对时间控件的操作

1.如何去掉readonly属性 前端对于时间控件的设置,有时是为了限制用户不能进行手动输入方式进行选择时间,避免在手动输入的时候超限或者输入格式不正确,导致一些不必要的验证麻烦,这是前端开发工程师就会在前端代码中加入readonly属性,但是对于手动测试来说的话,这种只能进行点击控件进行选择时间,而对于自动测试来说,这样的方式可能是行不通,因为这个需要认证时间控件的有效性很多个选择,自动化变得更加麻烦, 是不是就没有办法进行了呢?答案是否点的,例如: 那该怎么进行设置呢?这个是前人踩过的坑,后

VB6.0中,日期、时间控件不允许为空时,采用文本框与日期、时间控件相互替换赋值(解决方案)

VB6.0中,日期.时间控件不允许为空时,采用文本框与日期.时间控件相互替换赋值,或许是一个不错的选择. 实现效果如下图: 代码如下: 文本框txtStopTime1 时间框DTStopTime1 格式3 - dtpCustom  HH:mm:ss Private Sub Form_Load()       txtStopTime1.ZOrder       DTStopTime1.Top = txtStopTime1.Top       DTStopTime1.Left = txtStopTi

关于bootstrap时间控件datetimepicker的位置错乱问题

最近遇到datetimepicker这个时间控件在加载到网页显示时会发生错乱,具体解决如下: 1.首先我的源代码是从网站下载的:http://www.bootcss.com/p/bootstrap-datetimepicker/demo.htm 采用的源码是:sample in bootstrap v2文件夹下的: 2.考虑到位置错乱问题应该是在 js文件中,通过查找最终确定在bootstrap-datetimepicker.js中的问题:     应将其中的place:代码修改如下: plac

[转]一种简单的js时间控件

使用方法: 粘贴代码到文本文档中,文档名称为datetime.js,然后在html文件中引用如下代码即可 <input name="shijian1" id="shijian1" type="text" class="sang_Calender" /> <script type="text/javascript" src="js/datetime.js"><