想要实现的效果图如下:
点击“倒计时开始”按钮,会出现从10到0的倒计时动画。说是动画,其实并不是用animation等来制作,而仅仅是用TextView更新文字的方式来实现动画效果,很esay,直接上图。
第一步:制作圆形背景图
在android中,我们会用shape定义各种各样的形状,它能实现渐变色、虚线/分割线、边框、半透明、半透明阴影效果。圆形背景图为矢量图,先上代码:
<?xml version="1.0" encoding="UTF-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="oval">
<solid android:color="@color/white" />
<stroke
android:width="4dp"
android:color="@color/white" />
<padding
android:top="1dp"
android:left="2dp"
android:right="2dp"
android:bottom="1dp"/>
<size
android:width="20dp"
android:height="20dp" />
</shape>
解释
- solid 实心填充颜色,十六进制颜色值,这里设置了60%半透明度白色的效果
- stroke 描边,外边框,可以设置颜色和宽度.同时,该属性也可以用来画虚线,通过设置dashGap和dashWidth两个属性控制虚线间隔和长度
- padding 内容距离边框的值
- size 指定大小,shape为oval模式时,width和height相等时,代表正圆,否则de为椭圆
第二步:规划布局文件,设置TextView的背景
按照文初看到的效果图,布局文件中需要有一个可点击的Button,和一个可以变更数字的TextView。
- 首先,隐藏TextView的显示,只显示一个“倒计时开始”的Button。
-
点击“倒计时开始”后,将Button隐藏,将TextView显示出来。
代码罗列如下:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout 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:background="@color/gray"
android:gravity="center"
tools:context="com.example.server.testapplication.MainActivity">
<TextView
android:id="@+id/count_text"
android:layout_width="350dp"
android:layout_height="350dp"
android:background="@drawable/circle"
android:gravity="center"
android:textColor="@color/black"
android:textSize="240sp"
android:visibility="gone" />
<Button
android:id="@+id/count_button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="center"
android:text="倒计时开始..." />
</RelativeLayout>
-
第三步:实现代码逻辑,用Handler实现动态更新TextView内容
- 初始化控件
- 设置Button的监听方式为内部类监听,原理是通过子线程发送消息,在主线程中更新UI。
- 定义Handler内部类用于接收并处理来自子线程的消息,并判断当前的count值若大于0,继续延时发送消息,直到数字变为0.
package com.example.server.testapplication; import android.app.Activity; import android.os.Bundle; import android.os.Handler; import android.os.Message; import android.view.View; import android.widget.Button; import android.widget.TextView; public class MainActivity extends Activity { private static final int START_COUNTING = 1; private static final int COUNT_NUMBER = 10; private Button mCountDown; private TextView mStartCount; private MyHandler mHandler = new MyHandler(); private ButtonListener mButtonListener = new ButtonListener(); @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); init(); } private void init() { mCountDown = (Button) findViewById(R.id.count_button); mCountDown.setOnClickListener(mButtonListener); mStartCount = (TextView) findViewById(R.id.count_text); } private class ButtonListener implements View.OnClickListener { @Override public void onClick(View v) { mCountDown.setVisibility(View.GONE); mStartCount.setVisibility(View.VISIBLE); Message msg = mHandler.obtainMessage(); msg.what = START_COUNTING; msg.obj = COUNT_NUMBER; mHandler.sendMessageDelayed(msg, 10); } } private class MyHandler extends Handler { @Override public void handleMessage(Message msg) { super.handleMessage(msg); switch (msg.what) { case START_COUNTING: int count = (int) msg.obj; mStartCount.setText(count + ""); if (count > 0) { Message msg1 = obtainMessage(); msg1.what = START_COUNTING; msg1.obj = count - 1; sendMessageDelayed(msg1, 500); } break; default: break; } } }; }
END
如果你一不小心,已经看完了,恭喜你,并没有彩蛋。
我只能祝福你成为
一个年轻的梦想者,
热爱代码,
不受束缚!