From 172581dff7e6d77b17fa8496b7be194e0d65ffe9 Mon Sep 17 00:00:00 2001
From: DevWiki <devwiki@qq.com>
Date: Fri, 31 May 2024 14:05:54 +0800
Subject: [PATCH] =?UTF-8?q?=E6=B7=BB=E5=8A=A0loading=20=E5=8A=A8=E7=94=BB?=
 =?UTF-8?q?=20fix=20web=E8=B7=B3=E8=BD=AC?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../main/ets/pages/animation/LoadingPage.ets  | 30 ++++++++++++-------
 app/src/main/ets/pages/system/SchemePage.ets  |  2 ++
 2 files changed, 21 insertions(+), 11 deletions(-)

diff --git a/app/src/main/ets/pages/animation/LoadingPage.ets b/app/src/main/ets/pages/animation/LoadingPage.ets
index f81c0a9..efa1ef3 100644
--- a/app/src/main/ets/pages/animation/LoadingPage.ets
+++ b/app/src/main/ets/pages/animation/LoadingPage.ets
@@ -6,27 +6,35 @@ import { curves } from '@kit.ArkUI';
 @Component
 export struct LoadingPage {
   @State animate: boolean = false;
-  // 第一步: 声明相关状态变量
-  @State rotateValue: number = 0; // 组件一旋转角度
+  @State rotateValue: number = 0;
+
+  @Prop @Watch('onVisibleChanged')visible: boolean = false;
+  onVisibleChanged() {
+    if (this.visible) {
+      this.animate = true;
+      // 组件一的rotate属性发生变化，所以会给组件一添加rotate旋转动画
+      this.rotateValue = this.animate ? 360 : 0;
+    }else {
+      this.animate = false;
+    }
+  }
 
   build() {
     Column() {
 
       Image(CommonRes.getImage('ic_loading'))
         .rotate({ angle: this.rotateValue })
-        .width(32)
-        .height(32)
-        .fillColor('#2196F3')
+        .width(32).height(32).fillColor('#2196F3')
         .animation({
           curve: curves.initCurve(Curve.Linear),
           playMode: PlayMode.Normal,
           iterations: -1,
-        })
-        .onAppear(() => {
-          this.animate = !this.animate;
-          // 组件一的rotate属性发生变化，所以会给组件一添加rotate旋转动画
-          this.rotateValue = this.animate ? 360 : 0;
-        })
+          duration: 1000
+        }).visibility(this.visible ? Visibility.Visible : Visibility.None)
+
+      Button('change').width('60%').height(36).onClick(() =>{
+        this.visible = !this.visible;
+      }).margin({top: 24})
     }.width('100%').height('100%').justifyContent(FlexAlign.Center)
   }
 }
\ No newline at end of file
diff --git a/app/src/main/ets/pages/system/SchemePage.ets b/app/src/main/ets/pages/system/SchemePage.ets
index 6363f4b..22d0f9c 100644
--- a/app/src/main/ets/pages/system/SchemePage.ets
+++ b/app/src/main/ets/pages/system/SchemePage.ets
@@ -22,6 +22,8 @@ export struct SchemePage {
   openScheme() {
     let context = getContext(this) as common.UIAbilityContext;
     let wantInfo: Want = {
+      action: 'ohos.want.action.viewData',
+      entities: ['entity.system.browsable'],
       uri: 'https://devwiki.net'
     }
     context.startAbility(wantInfo);