Android简易实战教程--第五十话《动画扫描》

时间:2022-09-12 20:00:59

祝新年快乐!2017(一起)前行。

转载博客请注明出处:道龙的博客

本篇简答的小案例,使用动画知识,完成一个类似雷达扫描效果,并且加入自定义进度条。对于自定义进度条前面有很详细的解析和案例了,本篇就结合动画知识串起来,并且再加入之前写过的AsynckTask知识。

读者朋友也可以阅读之前两篇小案例,读者可以参考:Android简易实战教程--第三十三话《 AsyncTask异步倒计时》

Android简易实战教程--第三十四话《 自定义SeekBar以及里面的一些小知识》

本篇源代码下载GitHub地址,开启代码传送门---------->>>https://github.com/codeydl/Demo

那就开始写代码吧:

一、首先,定义一个布局,用于放置动画、自定义进度条位置。如下:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/activity_main"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent"
>
<!--标题-->
<TextView
android:background="@color/colorAccent"
android:text="扫描动画"
android:gravity="center"
android:padding="5dp"
android:textSize="25sp"
android:layout_width="match_parent"
android:layout_height="wrap_content"/> <!--容器-->
<LinearLayout
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<!--放置动画,设置一个背景-->
<FrameLayout
android:background="@drawable/ic_scanner_malware"
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<!--设置图片,代表要添加动画的旋转指针-->
<ImageView
android:id="@+id/iv_main_scan"
android:src="@drawable/act_scanning_03"
android:layout_width="wrap_content"
android:layout_height="wrap_content"/>
</FrameLayout> <!--提示与进度条-->
<LinearLayout
android:layout_marginLeft="10dp"
android:orientation="vertical"
android:layout_gravity="center_vertical"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<TextView
android:id="@+id/tv_main_scan"
android:textSize="18sp"
android:text="正在扫描中,请稍后"
android:layout_width="wrap_content"
android:layout_height="wrap_content"/>
<ProgressBar
android:id="@+id/pb_main_scan"
android:layout_marginTop="5dp"
style="@style/Base.Widget.AppCompat.ProgressBar.Horizontal"
android:progressDrawable="@drawable/my_progress"
android:layout_width="match_parent"
android:layout_height="wrap_content"/>
</LinearLayout> </LinearLayout>
</LinearLayout>

这里进度条设置,使用自定义的进度条,我们可以这么来搞定:

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<!--指定背景:它的id需要使用系统的@android:id/background,背景选择一张图片。也可以选择自定义drawable结合shape-->
<item android:id="@android:id/background" android:drawable="@drawable/security_progress_bg"/>
<!--指定进度的样子-->
<item android:id="@android:id/progress" android:drawable="@drawable/security_progress"/> </layer-list>

二、然后进入主活动,我们这里分两个任务进行开发。

1、加载动画

//直接使用补间动画代码设置
RotateAnimation rotateAnimation = new RotateAnimation(0,360,
Animation.RELATIVE_TO_SELF,0.5f,Animation.RELATIVE_TO_SELF,0.5f);
rotateAnimation.setDuration(1000);
//设置线性,表示x和y坐标同比例变化。效果让动画匀速
rotateAnimation.setInterpolator(new LinearInterpolator());
//设置动画无限循环
rotateAnimation.setRepeatCount(Animation.INFINITE);
//开启动画
ivmainscan.startAnimation(rotateAnimation);

此时看看效果,可以看到转盘“雷达”旋转了起来。

Android简易实战教程--第五十话《动画扫描》

2、加载进度条异步任务

加载进度条使用异步任务完成,异步任务的具体操作和功能描述,读者可关注我去参考本人相关博客,有详细解析。

下面在代码中加入详细的注释,就不多做赘述了,加载进度异步任务代码如下:

//@1:对应的参数是:1、doInBackground回调中的传入的参数类型;2、执行任务execute(...)中的参数类型
//@2:进度参数,与进度有关。onProgressUpdate的参数类型
//@3:1、doInBackground的返回值类型;2、执行结果onPostExecute传入的参数类型
new AsyncTask<Integer, Integer, Boolean>() { //第一段,准备耗时操作
@Override
protected void onPreExecute() {
// 主线程执行。准备执行前调用,用于界面初始化操作
tvmainscan.setText("引擎正在扫描中,请稍后...");
} //第二段
@Override
protected Boolean doInBackground(Integer... params) {
// 执行中。子线程执行,用于耗时操作
// 在这里可以拿到执行任务execute(...)传入的参数,可以以数组形式分别取到
int start = params[0];
int end = params[1]; //真正的耗时
for (int i = start; i < end; i++) {
SystemClock.sleep(50);//每加载一个进度,睡20微秒
publishProgress(i);
}
return true;//把值返回给onPostExecute
} //用于更新进度,进度改变时候的回调,一般用于进度结果的UI更新
@Override
protected void onProgressUpdate(Integer... values) {
// 主线程执行的回调,可更新进度。values参数接收doInBackground调用publishProgress时候推过来的参数。
// 每次推一个值。因此每次数组长度就是0
int progress = values[0];
pbmainscan.setProgress(progress);
} //第三段
@Override
protected void onPostExecute(Boolean result) {
// 主线程中执行。执行完成的回调,即获得数据后的回调,一般在这里进行结果UI展示
// 这里可以接收doInBackground的返回值,获取结果
if(result){
//说明进度加载成功。
Toast.makeText(getApplicationContext(),"扫描成功!",Toast.LENGTH_SHORT).show();
tvmainscan.setText("恭喜扫描完毕");
tvmainscan.setTextColor(Color.GREEN);
}else{
Toast.makeText(getApplicationContext(),"扫描失败!",Toast.LENGTH_SHORT).show();
tvmainscan.setText("很遗憾扫描失败");
tvmainscan.setTextColor(Color.RED);
}
//执行关闭的逻辑
//1、进度条设置为不可见
pbmainscan.setVisibility(View.GONE);
//2、动画停止扫描
ivmainscan.clearAnimation();
}
}.execute(0, 100);//最小进度为0,最大进度为100

代码注释特别详细,相信很轻松看完~

那么最后看看运行效果吧:

Android简易实战教程--第五十话《动画扫描》

喜欢我的朋友可以关注我博客,有问题大家一起交流。也可以动手微信扫描下方二维码查看更多安卓文章:

打开微信搜索公众号  Android程序员开发指南  或者手机扫描下方二维码 在公众号阅读更多Android文章。

微信公众号图片:

Android简易实战教程--第五十话《动画扫描》