您的位置:首页 > 移动开发 > Android开发

Android中自定义View仿京东秒杀倒计时

2017-06-19 17:36 435 查看

Android中自定义View仿京东秒杀倒计时

效果图

1.创建View:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:padding="@dimen/j2dp">

<LinearLayout
android:id="@+id/lay_days"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:orientation="horizontal"
android:gravity="center">
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="@drawable/goodsdetail_timer_bg"
android:gravity="center"
android:paddingLeft="3dp"
android:paddingRight="3dp">

<TextView
android:id="@+id/tv_days_decade"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="0"
android:textColor="@color/text_10"
android:textSize="@dimen/j18dp"
android:textStyle="bold"
/>

<TextView
android:id="@+id/tv_days_unit"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="0"
android:textColor="@color/text_10"
android:textSize="@dimen/j18dp"
android:textStyle="bold"
/>
</LinearLayout>
<TextView
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:gravity="center"
android:text=
4000
"天"
android:textSize="@dimen/j12dp"
android:textColor="@color/white"/>
</LinearLayout>
<LinearLayout
android:id="@+id/lay_hour"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="@drawable/goodsdetail_timer_bg"
android:gravity="center"
android:paddingLeft="3dp"
android:paddingRight="3dp">

<TextView
android:id="@+id/tv_hour_decade"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="0"
android:textColor="@color/text_10"
android:textSize="@dimen/j18dp"
android:textStyle="bold"
/>

<TextView
android:id="@+id/tv_hour_unit"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="0"
android:textColor="@color/text_10"
android:textSize="@dimen/j18dp"
android:textStyle="bold"
/>
</LinearLayout>

<TextView
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_marginLeft="@dimen/j3dp"
android:layout_marginRight="@dimen/j3dp"
android:gravity="center"
android:text=":"
android:textColor="@color/white"
android:textSize="@dimen/j18dp"/>

<LinearLayout
android:id="@+id/lay_min"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="@drawable/goodsdetail_timer_bg"
android:gravity="center"
android:paddingLeft="3dp"
android:paddingRight="3dp">

<TextView
android:id="@+id/tv_min_decade"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="0"
android:textColor="@color/text_10"
android:textSize="@dimen/j18dp"
android:textStyle="bold"
/>

<TextView
android:id="@+id/tv_min_unit"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="0"
android:textColor="@color/text_10"
android:textSize="@dimen/j18dp"
android:textStyle="bold"
/>
</LinearLayout>

<TextView
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_marginLeft="@dimen/j3dp"
android:layout_marginRight="@dimen/j3dp"
android:gravity="center"
android:text=":"
android:textColor="@color/white"
android:textSize="@dimen/j18dp"/>

<LinearLayout
android:id="@+id/lay_s"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="@drawable/goodsdetail_timer_bg"
android:gravity="center"
android:paddingLeft="3dp"
android:paddingRight="3dp">

<TextView
android:id="@+id/tv_sec_decade"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="0"
android:textColor="@color/text_10"
android:textSize="@dimen/j18dp"
android:textStyle="bold"
/>

<TextView
android:id="@+id/tv_sec_unit"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="0"
android:textColor="@color/text_10"
android:textSize="@dimen/j18dp"
android:textStyle="bold"
/>
</LinearLayout>
</LinearLayout>


goodsdetail_timer_bg.xml

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android" >
<solid android:color="@color/white" />
<!-- 设置矩形的四个角为弧形 -->
<!-- android:radius 弧形的半径 -->
<corners android:radius="1dp" />
<!-- 圆角边框颜色 -->
<stroke android:width="2dp" android:color="#ffffff" />
</shape>


2.重写View:

@SuppressLint("HandlerLeak")
public class GoodsDetailTimerView extends LinearLayout {

// 天数,十位
private TextView tv_days_decade;
// 天数,个位
private TextView tv_days_unit;
// 小时,十位
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 LinearLayout layHour, layMin, layS, layDays;

private Context context;

private int day;
private int days_decade;
private int days_unit;
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 interface OnTimeOutCallBack {
void onCallBack();
}

private OnTimeOutCallBack callBack;

public GoodsDetailTimerView(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.view_goodsdetailtimer, this);

tv_days_decade = (TextView) view.findViewById(R.id.tv_days_decade);
tv_days_unit = (TextView) view.findViewById(R.id.tv_days_unit);
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);

layDays = (LinearLayout) view.findViewById(R.id.lay_days);
layHour = (LinearLayout) view.findViewById(R.id.lay_hour);
layMin = (LinearLayout) view.findViewById(R.id.lay_min);
layS = (LinearLayout) view.findViewById(R.id.lay_s);
}

public void setOnTimeOutCallBack(OnTimeOutCallBack callBack) {
this.callBack = callBack;
}

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

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

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

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

/**
* @param
* @return void
* @throws Exception
* @throws
* @Description: 设置倒计时的时长
*/
public void setTime(int day, int hour, int min, int sec) {
try {
if (hour >= 24 || min >= 60 || sec >= 60 || hour < 0 || min < 0 || sec < 0) {
throw new RuntimeException("Time format is error,please check out your code");
}
this.day = day;
days_decade = day / 10;
days_unit = day - days_decade * 10;
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_days_decade.setText(days_decade + "");
tv_days_unit.setText(days_unit + "");
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 + "");

if (day <= 0) {
layDays.setVisibility(GONE);
} else {
layDays.setVisibility(VISIBLE);
}
} catch (Exception e) {
e.printStackTrace();
}
}

/**
* @param
* @return boolean
* @throws
* @Description: 倒计时
*/
private void countDown() {
if (isCarry4Unit(tv_sec_unit)) {
if (isCarry4Decade(tv_sec_decade)) {
if (isCarry4Unit(tv_min_unit)) {
if (isCarry4Decade(tv_min_decade)) {
if (isHourUnit(tv_hour_unit)) {
if (isHourDecade(tv_hour_decade)) {
if (isDayUnit(tv_days_unit)) {
if (isDayDecade(tv_days_decade)) {
if (callBack != null) {
callBack.onCallBack();
}
Log.d("TEST", "时间到了");
stop();
}
}
}
}
}
}
}
}
}

/**
* @param
* @return boolean
* @throws
* @Description: 天数变化十位,并判断是否需要进位
*/
private boolean isDayDecade(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;
}

}

/**
* @param
* @return boolean
* @throws
* @Description: 天数变化个位,并判断是否需要进位
*/
private boolean isDayUnit(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;
}

}

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

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

}

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

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

}

/**
* @param
* @return boolean
* @throws
* @Description: 分钟、秒钟变化十位,并判断是否需要进位
*/
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;
}

}

/**
* @param
* @return boolean
* @throws
* @Description: 分钟、秒钟变化个位,并判断是否需要进位
*/
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;
}

}
}


<GoodsDetailTimerView
android:id="@+id/timerView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"/>


启动计时器

GoodsDetailTimerView timerView=(LinearLayout) view.findViewById(R.id.lay_timerview);
timerView.setTime(day, hour, min, s);// 设置时间(day,hour,min,sec)
timerView.start();// 开始倒计时


timerView.stop();// 停止倒计时
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: