【Harmony OS】【JAVA UI】webView动画加载资源加载动画交互_webview设置加载动画

 在HarmonyOS中webview加载网页的时候，需要有进度条，或者加载动画进行用户感知的交互，这样可以优化用户体验，因此今天写一篇加载动画（效果如下）用于同学们进行学习，怎么实现？首先我们需要学习“CommonDialog”“ WebView”“动画开发指导”三个知识储备

我们分为“准备阶段”，“自定义CommonDialog实现”，“动画实现”，“webview的实现”，“运行效果”五个步骤进行实现。

1.准备阶段

在resources \base\ media\目录下准备一张loading图片（图片如下）存放位置如下

Loading图片

存放位置

2.       自定义CommonDialog的实现

2.1新建xml命名为general_dialog.xml,在该xml文件绘画一张图片（代码如下）

<?xml version="1.0" encoding="utf-8"?>
 
<DirectionalLayout
 
    xmlns:ohos="http://schemas.huawei.com/res/ohos"
 
    ohos:height="80vp"
 
    ohos:orientation="vertical"
 
    ohos:alignment="center"
 
    ohos:width="80vp">
 
    <Image
 
        ohos:id="$+id:loading"
 
        ohos:height="match_parent"
 
        ohos:width="match_parent"
 
        ohos:scale_mode="clip_center"
 
        ohos:image_src="$media:loading"/>
 
</DirectionalLayout>

效果图如下

2.2新建GeneralDialog文件，我们参考HarmonyOS 的自定义CommonDialog场景示例

具体代码如下

package com.harmony.alliance.mydemo.utils;
 
import java.util.Optional;
 
import com.harmony.alliance.mydemo.ResourceTable;
import ohos.agp.animation.Animator;
import ohos.agp.animation.AnimatorProperty;
import ohos.agp.animation.AnimatorValue;
import ohos.agp.colors.RgbColor;
import ohos.agp.components.*;
import ohos.agp.components.element.ShapeElement;
import ohos.agp.utils.LayoutAlignment;
import ohos.agp.window.dialog.CommonDialog;
import ohos.agp.window.service.WindowManager;
import ohos.app.Context;
 
public class GeneralDialog {
    private float dim = -1f;
    private   CommonDialog sDialog;
    private  Context mContext;
    private boolean mOutsideTouchClosable = false;
    public  GeneralDialog(Context context){
        this.mContext=context;
    }
    public void show() {
        if (sDialog != null) {
            sDialog.show();
            if (dim >= 0) {
                changeDialogDim(sDialog, dim);
            }
        }
    }
    public void remove(){
        if (sDialog != null) {