diff --git a/windowpiplibrary/src/main/ets/component/VideoPlayComponent.ets b/windowpiplibrary/src/main/ets/component/VideoPlayComponent.ets
index 51eecf44b9f5d1de0c4f2c9514ccd8fe512f3b7d..3d1b215689165ac8072e0c38ac57cf5d37bb6074 100644
--- a/windowpiplibrary/src/main/ets/component/VideoPlayComponent.ets
+++ b/windowpiplibrary/src/main/ets/component/VideoPlayComponent.ets
@@ -103,7 +103,7 @@ export struct VideoPlayComponent {
 
   async startPip(): Promise<void> {
     if (!this.pipController) {
-      Logger.info(`[${TAG}] pipController create error`);
+      Logger.info(TAG, `pipController create error`);
       return;
     }
     await this.pipController.startPiP();
@@ -112,7 +112,7 @@ export struct VideoPlayComponent {
 
   async stopPip(): Promise<void> {
     if (!this.pipController) {
-      Logger.info(`[${TAG}] pipController is not exist`);
+      Logger.info(TAG, `pipController is not exist`);
       return;
     }
     await this.pipController.stopPiP();
@@ -137,6 +137,9 @@ export struct VideoPlayComponent {
       contentWidth: this.curBp === 'sm' ? 16 : this.curBp === 'md' ? 16 : 3,
       contentHeight: this.curBp === 'sm' ? 9 : this.curBp === 'md' ? 9 : 2
     });
+    // Add initial state setup
+    this.curState = 'STOPPED';
+
     this.pipController.on('stateChange', (state: PiPWindow.PiPState, reason: string) => {
       this.onStateChange(state, reason);
       if (state === PiPWindow.PiPState.STOPPED || state === PiPWindow.PiPState.STARTED) {
@@ -193,7 +196,7 @@ export struct VideoPlayComponent {
       default:
         break;
     }
-    Logger.info(`[${TAG}] onStateChange: ${this.curState}, reason: ${reason}`);
+    Logger.info(TAG, `onStateChange: ${this.curState}, reason: ${reason}`);
   }
 
   onActionEvent(event: PiPWindow.PiPActionEventType, status: number | undefined): void {
@@ -211,7 +214,7 @@ export struct VideoPlayComponent {
         break;
     }
     this.buttonAction = event + `-status:${status}`;
-    Logger.info(`[${TAG}] onActionEvent: ${this.buttonAction} status:${status}}`);
+    Logger.info(TAG, `onActionEvent: ${this.buttonAction} status:${status}}`);
   }
 
   showToast() {
@@ -221,7 +224,7 @@ export struct VideoPlayComponent {
         duration: 2000
       }));
     } catch (error) {
-      Logger.error(`showToast args error code is ${error.code}, message is ${error.message}}`);
+      Logger.error(TAG, `showToast args error code is ${error.code}, message is ${error.message}}`);
     }
   }
 
@@ -354,7 +357,7 @@ export struct VideoPlayComponent {
               controller: this.mXComponentController
             })
               .onLoad(() => {
-                Logger.info(`[${TAG}] XComponent onLoad`);
+                Logger.info(TAG, ` XComponent onLoad`);
                 this.surfaceId = this.mXComponentController.getXComponentSurfaceId();
                 this.player = new AVPlayer(this.surfaceId, CommonConstants.AVPLAYER_TYPE, this.getUIContext().getHostContext()!);
                 this.player.avPlayerFdSrc();
@@ -405,7 +408,11 @@ export struct VideoPlayComponent {
                 this.hintMsgVisibility = true;
                 this.changePipControllerStatusStart();
               } else {
-                this.createPip();
+                if (this.pipController) {
+                  this.startPip();
+                } else {
+                  this.createPip();
+                }
                 this.hintMsgVisibility = true;
                 this.changePipControllerStatusStart();
               }
diff --git a/windowpiplibrary/src/main/ets/constants/CommonConstants.ets b/windowpiplibrary/src/main/ets/constants/CommonConstants.ets
index 69ddccaee5994510f3ced0a281ff9e1b0da5a31f..786c4df30dc53b70849bd800ad8d420742e3e58d 100644
--- a/windowpiplibrary/src/main/ets/constants/CommonConstants.ets
+++ b/windowpiplibrary/src/main/ets/constants/CommonConstants.ets
@@ -102,7 +102,7 @@ export class CommonConstants {
   /**
    * NavDestination page name.
    */
-  public static readonly NAV_DESTINATION_NAME: string = 'PlayVideo';
+  public static readonly NAV_DESTINATION_NAME: string = 'VideoPlayComponent';
   /**
    * Control width.
    */
diff --git a/windowpiplibrary/src/main/ets/player/AVPlayer.ets b/windowpiplibrary/src/main/ets/player/AVPlayer.ets
index 5aadbe24b0587940d6c0d422e36f1df9ec9a38eb..2310a3c92afe9c8094f967c78b3289ec033688b4 100644
--- a/windowpiplibrary/src/main/ets/player/AVPlayer.ets
+++ b/windowpiplibrary/src/main/ets/player/AVPlayer.ets
@@ -19,6 +19,8 @@ import { resourceManager } from '@kit.LocalizationKit';
 import { media } from '@kit.MediaKit';
 import Logger from '../utils/Logger';
 
+const TAG: string = '[AVPlayer]';
+
 export class AVPlayer {
   private avPlayer?: media.AVPlayer;
   // The surfaceID is used to display the screen.
@@ -55,11 +57,11 @@ export class AVPlayer {
   setAVPlayerCallback(): void {
     // Callback function for seek operation result.
     this.avPlayer?.on('seekDone', (seekDoneTime: number) => {
-      Logger.info(`AVPlayer seek succeeded, seek time is ${seekDoneTime}`);
+      Logger.info(TAG, `AVPlayer seek succeeded, seek time is ${seekDoneTime}`);
     });
     // error callback listens to the function.
     this.avPlayer?.on('error', (err: BusinessError) => {
-      Logger.info(`Invoke avPlayer failed, code is ${err.code}, message is ${err.message}`);
+      Logger.info(TAG, `Invoke avPlayer failed, code is ${err.code}, message is ${err.message}`);
       // Call the RESET call to reset the resource to trigger the idle state.
       this.avPlayer?.reset();
       this.avPlayer?.play();
@@ -73,7 +75,7 @@ export class AVPlayer {
       switch (state) {
         // After the RESET API is successfully called, the state machine is triggered.
         case 'idle':
-          Logger.info('AVPlayer state idle called.');
+          Logger.info(TAG, 'AVPlayer state idle called.');
           if (!this.jumpNext) {
             // Call the release operation to destroy the instance object.
             this.avPlayer?.release();
@@ -85,18 +87,18 @@ export class AVPlayer {
           break;
         // After avplayer sets the playback source, this status is reported.
         case 'initialized':
-          Logger.info('AVPlayer state initialized called.');
+          Logger.info(TAG, 'AVPlayer state initialized called.');
           // You don't need to set the display screen when the playback asset is audio-only.
           this.avPlayer.surfaceId = this.surfaceID;
           this.avPlayer.prepare().then(() => {
-            Logger.info('AVPlayer prepare succeeded.');
+            Logger.info(TAG, 'AVPlayer prepare succeeded.');
           }, (err: BusinessError) => {
-            Logger.error(`Invoke prepare failed, code is ${err.code}, message is ${err.message}`);
+            Logger.error(TAG, `Invoke prepare failed, code is ${err.code}, message is ${err.message}`);
           });
           break;
         // After the prepare call is successful, the state machine is reported.
         case 'prepared':
-          Logger.info('AVPlayer state prepared called.');
+          Logger.info(TAG, 'AVPlayer state prepared called.');
           // Call the playback API to start playback.
           if (this.playStatus) {
             this.avPlayer.play();
@@ -104,31 +106,31 @@ export class AVPlayer {
           break;
         // After the play is successfully invoked, the state machine is triggered.
         case 'playing':
-          Logger.info('AVPlayer state playing called.');
+          Logger.info(TAG, 'AVPlayer state playing called.');
           this.jumpNext = false;
           break;
         // After pause is successfully invoked, the state machine is triggered.
         case 'paused':
-          Logger.info('AVPlayer state paused called.');
+          Logger.info(TAG, 'AVPlayer state paused called.');
           break;
         // After the playback ends, the state machine is triggered.
         case 'completed':
-          Logger.info('AVPlayer state completed called.');
+          Logger.info(TAG, 'AVPlayer state completed called.');
           // Call the playback end API.
           this.playNext();
           break;
         // After the stop API is successfully called, the state machine is triggered.
         case 'stopped':
-          Logger.info('AVPlayer state stopped called.');
+          Logger.info(TAG, 'AVPlayer state stopped called.');
           // Call the reset operation to initialize the avplayer state.
           this.avPlayer.reset();
           break;
         case 'released':
-          Logger.info('AVPlayer state released called.');
+          Logger.info(TAG, 'AVPlayer state released called.');
           this.avPlayer.release();
           break;
         default:
-          Logger.info('AVPlayer state unknown called.');
+          Logger.info(TAG, 'AVPlayer state unknown called.');
           break;
       }
     });