diff --git a/entry/src/main/ets/entryability/EntryAbility.ets b/entry/src/main/ets/entryability/EntryAbility.ets
index e166e5f6fc5b27d56cd06639083807b60d4c695f..865728319a78d1184b8b46efe849367784fe5d33 100644
--- a/entry/src/main/ets/entryability/EntryAbility.ets
+++ b/entry/src/main/ets/entryability/EntryAbility.ets
@@ -16,6 +16,7 @@
 import { AbilityConstant, UIAbility, Want } from '@kit.AbilityKit';
 import { hilog } from '@kit.PerformanceAnalysisKit';
 import { window } from '@kit.ArkUI';
+import { BusinessError } from '@kit.BasicServicesKit';
 
 export default class EntryAbility extends UIAbility {
   onCreate(want: Want, launchParam: AbilityConstant.LaunchParam) {
@@ -41,6 +42,29 @@ export default class EntryAbility extends UIAbility {
         hilog.error(0x0000, 'testTag', 'Failed to load the content. Cause: %{public}s', JSON.stringify(err) ?? '');
         return;
       }
+      let windowClass: window.Window | undefined = undefined;
+      windowStage.getMainWindow((err: BusinessError, data) => {
+        let errCode: number = err.code;
+        if (errCode) {
+          hilog.error(0x0000, 'testTag', 'Failed to obtain the main window. Cause: ', JSON.stringify(err));
+          return;
+        }
+        try {
+          windowClass = data;
+          let isLayoutFullScreen = true;
+          windowClass.setWindowLayoutFullScreen(isLayoutFullScreen).then(() => {
+            hilog.info(0x0000, 'testTag', 'Succeeded in setting the window layout to full-screen mode.');
+          });
+          let avoidArea = windowClass.getWindowAvoidArea(window.AvoidAreaType.TYPE_SYSTEM);
+          // Set the height of the status bar.
+          AppStorage.setOrCreate('statusBarHeight', data.getUIContext().px2vp(avoidArea.topRect.height));
+          AppStorage.setOrCreate('bottomHeight', data.getUIContext()
+            .px2vp(windowClass.getWindowAvoidArea(window.AvoidAreaType.TYPE_NAVIGATION_INDICATOR).bottomRect.height));
+        } catch (exception) {
+          hilog.error(0x0000, '[EntryAbility]',
+            `Failed to set the system bar to be invisible. Cause code: ${exception.code}, message: ${exception.message}`);
+        }
+      })
       hilog.isLoggable(0x0000, 'testTag', hilog.LogLevel.INFO);
       hilog.info(0x0000, 'testTag', 'Succeeded in loading the content. Data: %{public}s', JSON.stringify(data) ?? '');
     });
diff --git a/entry/src/main/ets/pages/RankPage.ets b/entry/src/main/ets/pages/RankPage.ets
index 24c6796f523aa7cf518ea20bf7afcae21002ec03..7477d11e16498f024b6214f90414de0252ca72a9 100644
--- a/entry/src/main/ets/pages/RankPage.ets
+++ b/entry/src/main/ets/pages/RankPage.ets
@@ -13,7 +13,6 @@
  * limitations under the License.
  */
 
-import { promptAction } from '@kit.ArkUI';
 import { RankViewModel } from '../viewmodel/RankViewModel';
 import { RankData } from '../viewmodel/RankData';
 import { ListHeaderComponent } from '../view/ListHeaderComponent';
@@ -26,6 +25,8 @@ let rankModel: RankViewModel = new RankViewModel();
 @Entry
 @Component
 struct RankPage {
+  @StorageLink('statusBarHeight') statusBarHeight: number = 0;
+  @StorageLink('bottomHeight') bottomHeight: number = 0;
   @State dataSource1: RankData[] = [];
   @State dataSource2: RankData[] = [];
   // The State is used to decide whether to switch the data of RankList.
@@ -73,6 +74,10 @@ struct RankPage {
       // The style of List component.
       this.RankList(Style.CONTENT_WIDTH)
     }
+    .padding({
+      top: this.statusBarHeight,
+      bottom: this.bottomHeight
+    })
     .backgroundColor($r('app.color.background'))
     .height(WEIGHT)
     .width(WEIGHT)