diff --git a/entry/src/main/ets/application/PhotoAlbum.ets b/entry/src/main/ets/application/PhotoAlbum.ets
index 8fcefbf42de2cfe17ca93d490bfdde53fb21d256..3154fc2aa46b60fb1d7862b7c41eb0f397c1661c 100644
--- a/entry/src/main/ets/application/PhotoAlbum.ets
+++ b/entry/src/main/ets/application/PhotoAlbum.ets
@@ -24,10 +24,9 @@ let storage = LocalStorage.getShared();
 @Entry(storage)
 @Component
 struct PhotoAlbum {
-  @State sideBarStatus: boolean = true;
-  @StorageProp('currentBreakPoint') currentBreakPoint: string = 'sm';
-  @StorageProp('currentBreakpoint') curBp: string = CommonConstants.BREAK_POINT_SM;
+  @StorageProp('currentBreakPoint') curBp: string = CommonConstants.BREAK_POINT_SM;
   @StorageProp('topRectHeight') topRectHeight: number = 0;
+  @State sideBarStatus: boolean = this.curBp !== CommonConstants.BREAK_POINT_SM;
 
   build() {
     GridRow() {
@@ -46,12 +45,12 @@ struct PhotoAlbum {
           }
           .divider({ strokeWidth: 0.5, color: $r('sys.color.comp_divider') })
           .controlButton({
-            left: new BreakpointType(16 + CommonConstants.BACK_SIZE, 24 + CommonConstants.BACK_SIZE,
-              32 + CommonConstants.BACK_SIZE).GetValue(this.curBp),
+            left: 16 + CommonConstants.BACK_SIZE,
             top: px2vp(this.topRectHeight),
             width: 24,
             height: 24
           })
+          .showSideBar(this.curBp !== CommonConstants.BREAK_POINT_SM)
           .onChange((value: boolean) => {
             this.sideBarStatus = value;
           })
@@ -62,7 +61,7 @@ struct PhotoAlbum {
               .fontSize($r('sys.float.Title_M'))
           }
           .margin({
-            left: new BreakpointType(16, 24, 32).GetValue(this.currentBreakPoint),
+            left: new BreakpointType(16, 24, 32).GetValue(this.curBp),
             top: px2vp(this.topRectHeight)
           })
           .backgroundColor(Color.Transparent)
@@ -75,7 +74,7 @@ struct PhotoAlbum {
       }
     }
     .onBreakpointChange((breakpoint: string) => {
-      this.currentBreakPoint = breakpoint;
+      this.curBp = breakpoint;
     })
   }
 }
\ No newline at end of file
diff --git a/entry/src/main/ets/common/MailContent.ets b/entry/src/main/ets/common/MailContent.ets
index 28e84d304adac033f25ed8d19a0d99f40e58c732..152671df477cffe84947a68db3089e6dd091b212 100644
--- a/entry/src/main/ets/common/MailContent.ets
+++ b/entry/src/main/ets/common/MailContent.ets
@@ -26,7 +26,7 @@ export struct MailContent {
     new OperateTabs($r('sys.symbol.trash'), $r('app.string.delete')),
     new OperateTabs($r('sys.symbol.dot_grid_2x2'), $r('app.string.more')),
   ]
-  @StorageProp('currentBreakpoint') curBp: string = CommonConstants.BREAK_POINT_SM;
+  @StorageProp('currentBreakPoint') curBp: string = CommonConstants.BREAK_POINT_SM;
   @StorageProp('bottomRectHeight') bottomRectHeight: number = 0;
   @StorageProp('topRectHeight') topRectHeight: number = 0;
 
diff --git a/entry/src/main/ets/common/MailSideBar.ets b/entry/src/main/ets/common/MailSideBar.ets
index 597fc7c89b29a1d0a66d3c6935750a46e74bbe1e..c4bb725c5c0063795ae4954ec48dc00bff686c6b 100644
--- a/entry/src/main/ets/common/MailSideBar.ets
+++ b/entry/src/main/ets/common/MailSideBar.ets
@@ -40,7 +40,7 @@ struct AccountInfo {
     'xxxxxxxxxxxxx',
     'xxxxxxxxxxxxx',
   ]
-  @StorageProp('currentBreakpoint') curBp: string = CommonConstants.BREAK_POINT_SM;
+  @StorageProp('currentBreakPoint') curBp: string = CommonConstants.BREAK_POINT_SM;
 
   @Builder
   accountInfo() {
diff --git a/entry/src/main/ets/common/PhotoContent.ets b/entry/src/main/ets/common/PhotoContent.ets
index 5092f7c7daeb953c26a2bcb17481362e40617fa2..8c060ae8d7b0d6cab954e64e2520d3019c0320c4 100644
--- a/entry/src/main/ets/common/PhotoContent.ets
+++ b/entry/src/main/ets/common/PhotoContent.ets
@@ -31,7 +31,7 @@ export struct PhotoContent {
   ]
   @State columnsTemplate: string = '1fr 1fr 1fr';
   @Link @Watch('onStateChange') sideBarStatus: boolean;
-  @StorageProp('currentBreakpoint') currentBreakPoint: string = CommonConstants.BREAK_POINT_SM;
+  @StorageProp('currentBreakPoint') currentBreakPoint: string = CommonConstants.BREAK_POINT_SM;
   @StorageProp('topRectHeight') topRectHeight: number = 0;
 
   aboutToAppear() {
diff --git a/entry/src/main/ets/common/PhotoSideBar.ets b/entry/src/main/ets/common/PhotoSideBar.ets
index 9a9c88067c90fa8e7f20a0563f060a24a0caaa37..43afaa21b46c667e7c83188a5aa923398a3bbbed 100644
--- a/entry/src/main/ets/common/PhotoSideBar.ets
+++ b/entry/src/main/ets/common/PhotoSideBar.ets
@@ -30,7 +30,7 @@ export struct PhotoSideBar {
     new PhotoType($r('app.string.pictureType'), 22),
     new PhotoType($r('app.string.hidden'), 1),
   ];
-  @StorageProp('currentBreakpoint') curBp: string = CommonConstants.BREAK_POINT_SM;
+  @StorageProp('currentBreakPoint') curBp: string = CommonConstants.BREAK_POINT_SM;
   @StorageProp('topRectHeight') topRectHeight: number = 0;
 
   build() {