android 后台执行耗时利用等待界面提高用户体验

效果图:

在这里插入图片描述

具体实现

  1. 创建视图ProgressDialog:WaitingDialog


public class WaitingDialog extends ProgressDialog {

    private Context context;
    private ImageView waiting_img;

    public WaitingDialog(Context context) {
        super(context);
        this.context = context;
    }

    public WaitingDialog(Context context, int theme) {
        super(context, theme);
        this.context = context;
    }

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        // 从布局文件中实例化视图
        View view = View.inflate(getContext(), R.layout.waiting_dialog, null);

        // 加载动画资源文件
        Animation operatingAnim = AnimationUtils.loadAnimation(getContext(), R.anim.anim_upload_progress);
        // 设置动画插值器(可选)
        LinearInterpolator lin = new LinearInterpolator();
        operatingAnim.setInterpolator(lin);

        // 获取ImageView实例
        waiting_img = (ImageView) view.findViewById(R.id.waiting_img);
        // 将动画应用于ImageView
        waiting_img.setAnimation(operatingAnim);
        // 将视图设置为Activity的内容视图
        setContentView(view);
    }
}

  1. 创建WaitingDialog的XML布局放进layout目录里,名称waiting_dialog.xml
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:gravity="center"
    android:layout_height="match_parent"
    android:layout_width="match_parent"
    android:orientation="vertical" >

    <LinearLayout
        android:gravity="center"
        android:background="#80000000"
        android:layout_width="2000dp"
        android:orientation="vertical"
        android:layout_height="2000dp">
        //转圈的图片

        <ImageView
            android:id="@+id/waiting_img"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_centerInParent="true"
            android:src="@drawable/waiting" />
        <TextView
            android:paddingTop="20dp"
            android:layout_width="wrap_content"
            android:text="正在加载中,请稍后..."
            android:textColor="#FFFFFFFF"
            android:layout_height="wrap_content"/>

    </LinearLayout>

</LinearLayout>
  1. res新建目录anim,加入三个动画文件anim_upload_progress.xml、slide_in_bottom.xml、slide_out_bottom.xml

//1. anim_upload_progress.xml
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
    <rotate
        android:duration="1000"
        android:fromDegrees="0"
        android:interpolator="@android:anim/linear_interpolator"
        android:pivotX="50%"
        android:pivotY="50%"
        android:repeatCount="-1"
        android:toDegrees="360" />
</set>
<!--<set xmlns:android="http://schemas.android.com/apk/res/android">-->
    <!-- 设置动画的类型为旋转动画 -->
<!--    <rotate-->
    <!-- 设置动画的持续时间为1000毫秒 -->
<!--    android:duration="1000"-->
    <!-- 设置动画的起始角度为0-->
<!--    android:fromDegrees="0"-->
    <!-- 设置动画的插值器为线性插值器 -->
<!--    android:interpolator="@android:anim/linear_interpolator"-->
    <!-- 设置动画的旋转中心点在X轴上的位置为50% -->
<!--    android:pivotX="50%"-->
    <!-- 设置动画的旋转中心点在Y轴上的位置为50% -->
<!--    android:pivotY="50%"-->
    <!-- 设置动画的重复次数为无限次 -->
<!--    android:repeatCount="-1"-->
    <!-- 设置动画的结束角度为360-->
<!--    android:toDegrees="360" />-->
<!--</set>-->
<!--    //在正中心,在1秒内,从0度转到360度,不停止-->


// 2. slide_in_bottom.xml
<?xml version="1.0" encoding="utf-8"?>
<!-- res/anim/slide_in_bottom.xml -->
<set xmlns:android="http://schemas.android.com/apk/res/android">
    <translate
        android:fromYDelta="100%p"
        android:toYDelta="0"
        android:duration="300" />
</set>

// 3. slide_out_bottom.xml
<?xml version="1.0" encoding="utf-8"?>
<!-- res/anim/slide_out_bottom.xml -->
<set xmlns:android="http://schemas.android.com/apk/res/android">
    <translate
        android:fromYDelta="0"
        android:toYDelta="100%p"
        android:duration="300" />
</set>
  1. res/values目录下,添加Dialog主题资源文件
<resources xmlns:tools="http://schemas.android.com/tools">
    <!-- Base application theme. -->
    <style name="progressDialog" parent="@android:style/Theme.Dialog">
        <item name="android:windowFrame">@null</item>
        <item name="android:windowIsFloating">true</item>
        <!-- 是否浮现在activity之上 -->
        <item name="android:windowIsTranslucent">false</item>
        <!-- 半透明 -->
        <item name="android:windowNoTitle">true</item>
        <!-- 无标题 -->
        <item name="android:windowBackground">@android:color/transparent</item>
        <item name="android:backgroundDimEnabled">false</item>
        <!-- 模糊 -->
        <!-- <item name="android:windowContentOverlay">@null</item> -->

    </style>

</resources>

  1. ** 使用**

public class MainActivity extends AppCompatActivity {
    private WaitingDialog waitingDialog;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        waitingDialog = new WaitingDialog(this, R.style.progressDialog);
        //设置不可点击外边取消动画
        waitingDialog.setCanceledOnTouchOutside(false);
        waitingDialog.show();

        //因为放在点击事件中会在后台一次性执行完,得不到实时效果,无奈有此
        Timer timer = new Timer();
        TimerTask task = new TimerTask() {
            @Override
            public void run() {
                cancelProgressDialog();
            }
        };
        timer.schedule(task, 5000);

    }


    private void cancelProgressDialog() {
        if (waitingDialog != null && waitingDialog.isShowing()) {
            waitingDialog.cancel();
        }
    }

}
  1. activity对应的布局
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:padding="20dp"
    android:gravity="top"
    android:layout_height="match_parent"
    tools:context=".MainActivity">

    <TextView
        android:textSize="30sp"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="android等待界面" />

</LinearLayout>
  1. drawable资源,名称:waiting.png。这个可以自去网上找自己喜欢的图标下载。推荐阿里巴巴矢量图标库,登录就能下载
    在这里插入图片描述

注意

在实际应用中需要注意线程问题,一般来说,它只有在主线程UI中调用才会显示。

评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

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

余额充值