Merge remote-tracking branch 'origin/main'

@@ -173,6 +173,7 @@ export { CreatorsBean } from './src/main/ets/bean/content/CreatorsBean';
 export { MasterDetailRes } from './src/main/ets/bean/user/MasterDetailRes';
 
 export { ReserveItemBean } from './src/main/ets/bean/live/ReserveItemBean';
+export { PageTrackBean } from './src/main/ets/bean/component/PageTrackBean';
 
 
 

+/**
+ * pageinfo数据，仅埋点用
+ */
+export class PageTrackBean {
+  pageId: string = ''; // 页面id
+  pageName: string = ''; // 名称
+}
\ No newline at end of file

@@ -5,7 +5,7 @@ import PageModel from '../../viewmodel/PageModel';
 import { autoRefresh, onActionEnd, onActionStart, onActionUpdate } from '../../utils/PullDownRefresh';
 import LoadMoreLayout from './LoadMoreLayout';
 import { CompParser } from '../CompParser';
-import { CompDTO } from 'wdBean';
+import { CompDTO, PageTrackBean } from 'wdBean';
 import PageHelper from '../../viewmodel/PageHelper';
 import { channelSkeleton } from '../skeleton/channelSkeleton'
 import { ProcessUtils } from 'wdRouter/Index';
@@ -30,6 +30,9 @@ export struct PageComponent {
   private listScroller: Scroller = new Scroller();
   private panOption: PanGestureOptions = new PanGestureOptions({ direction: PanDirection.Up | PanDirection.Down })
   needload: boolean = true;
+  // page相关埋点数据，各组件需要，自行取用
+  @Provide pageTrackBean: PageTrackBean = new PageTrackBean()
+
   build() {
     Column() {
       if (this.pageModel.viewType == ViewType.LOADING) {
@@ -265,8 +268,14 @@ export struct PageComponent {
       this.pageModel.channelId = this.channelId;
       this.pageModel.currentPage = 1;
       this.pageModel.pageTotalCompSize = 0;
-      PageHelper.getInitCacheData(this.pageModel, this.pageAdvModel)
-      PageHelper.getInitData(this.pageModel, this.pageAdvModel)
+      PageHelper.getInitCacheData(this.pageModel, this.pageAdvModel).then(() => {
+        this.pageTrackBean.pageId = this.pageId
+        this.pageTrackBean.pageName = this.pageModel.pageInfo.name
+      })
+      PageHelper.getInitData(this.pageModel, this.pageAdvModel).then(() => {
+        this.pageTrackBean.pageId = this.pageId
+        this.pageTrackBean.pageName = this.pageModel.pageInfo.name
+      })
     }, 100)
   }
 }

-import { DateTimeUtils, PermissionUtil } from 'wdKit'
+import { BreakpointSystem, DateTimeUtils, PermissionUtil } from 'wdKit'
 import { PrivacySettingModel } from '../../model/PrivacySettingModel'
 import { Params } from 'wdBean';
 import { WDRouterPage, WDRouterRule } from 'wdRouter';
 import { HttpUtils } from 'wdNetwork/Index';
 import { TrackingPageBrowse, TrackConstants, TrackingButton } from 'wdTracking/Index';
+import { TitleBackComponent } from '../setting/TitleBackComponent';
 
 const TAG = 'PrivacySettingPage';
 const DiyString = '开启个性化推荐'
@@ -18,6 +19,17 @@ export struct PrivacySettingPage {
   tipsEnd = '中相应权限使用规则'
   pageShowTime:number = 0;
   pageHideTime:number = 0;
+  @StorageProp('currentBreakpoint') @Watch("currentChanged")currentBreakpoint: string = 'sm';
+  private breakpointSystem = new BreakpointSystem();
+  @State percent:number = 1
+
+  currentChanged(){
+    if(this.currentBreakpoint == "md" || this.currentBreakpoint == "lg"){
+      this.percent = 0.7
+    }else {
+      this.percent = 1
+    }
+  }
 
   onPageShow(): void {
     this.getPermissionStatus();
@@ -32,6 +44,8 @@ export struct PrivacySettingPage {
   }
 
   aboutToAppear() {
+    this.breakpointSystem.register();
+    this.currentChanged()
     if (!HttpUtils.getUserId()) {
       this.listData.splice(0, 1);
     }
@@ -43,6 +57,10 @@ export struct PrivacySettingPage {
 
   }
 
+  aboutToDisappear(): void {
+    this.breakpointSystem.unregister();
+  }
+
   async getPermissionStatus() {
     const permissionUtil = new PermissionUtil();
     for (const element of this.listData) {
@@ -57,25 +75,27 @@ export struct PrivacySettingPage {
   }
 
   build() {
-    Navigation() {
+    Column(){
+      TitleBackComponent({title:"隐私设置"})
+
       //滑动区域
       this.PrivacySettingComponentsUI()
+    }.backgroundColor('#F8F8F8')
+    .width("100%")
+    .height("100%")
 
-    }.titleMode(NavigationTitleMode.Mini)
-    .title('隐私设置')
-    .backgroundColor('#F8F8F8')
   }
 
   @Builder PrivacySettingComponentsUI() {
     Column() {
 
-      List({ space: '23lpx' }) {
+      List({ space: `${this.calcHeight(23)}lpx` }) {
         ForEach(this.listData, (item: PrivacySettingModel, index:number) => {
           ListItem() {
             if (item.privacyName == DiyString) {
-              getTuiJianCell({ item:item, index:index });
+              getTuiJianCell({ item:item, index:index ,percent:$percent});
             } else {
-              getArrowCell({ item:item, index:index });
+              getArrowCell({ item:item, index:index ,percent:$percent});
             }
           }.onClick(() => {
             if (item.privacyName == DiyString) {
@@ -103,32 +123,33 @@ export struct PrivacySettingPage {
             }
           })
         })
-      }
-      .padding({ left: '29lpx', right: '29lpx' })
-      .margin({ top: '38lpx' })
+      }.width('100%')
+      .padding({ left: `${this.calcHeight(29)}lpx`, right: `${this.calcHeight(29)}lpx` })
+      .margin({ top: `${this.calcHeight(38)}lpx` })
+      
 
       Row() {
         Text(this.tips)
-          .fontSize('25lpx')
+          .fontSize(`${this.calcHeight(25)}lpx`)
           .textAlign(TextAlign.Start)
           .fontColor($r("app.color.color_666666"))
-          .margin({ left: '29lpx', top: '46lpx' })
+          .margin({ left: `${this.calcHeight(29)}lpx`, top: `${this.calcHeight(46)}lpx` })
         // .backgroundColor(Color.Orange)
         Text(this.privacyTips)
-          .fontSize('25lpx')
+          .fontSize(`${this.calcHeight(25)}lpx`)
           .textAlign(TextAlign.Start)
           .fontColor('#ED2800')
-          .margin({ top: '46lpx' })
+          .margin({ top: `${this.calcHeight(46)}lpx` })
           .onClick(() => {
             //跳转隐私政策
             let bean={contentID:"2",pageID:""} as Params
             WDRouterRule.jumpWithPage(WDRouterPage.loginProtocolPage,bean)
           })
         Text(this.tipsEnd)
-          .fontSize('25lpx')
+          .fontSize(`${this.calcHeight(25)}lpx`)
           .textAlign(TextAlign.Start)
           .fontColor($r("app.color.color_666666"))
-          .margin({ top: '46lpx' })
+          .margin({ top: `${this.calcHeight(46)}lpx` })
       }
 
     }
@@ -137,6 +158,10 @@ export struct PrivacySettingPage {
     .backgroundColor('#F8F8F8')
     .alignItems(HorizontalAlign.Start)
   }
+
+  calcHeight(value:number): number{
+    return value * this.percent
+  }
 }
 
 
@@ -144,6 +169,7 @@ export struct PrivacySettingPage {
 struct getArrowCell {
   @ObjectLink item: PrivacySettingModel;
   index:number = 0;
+  @Link percent:number
   // 右文字+箭头cell
   // @Builder getArrowCell(item:PrivacySettingModel, index) {
   build() {
@@ -151,28 +177,32 @@ struct getArrowCell {
       // 左侧标题
       Text(this.item.privacyName)
         .fontColor('#666666')
-        .fontSize('31lpx')
+        .fontSize(`${this.calcHeight(31)}lpx`)
 
       Row() {
         Text(this.item.permission ? '已开启' : '去设置')
           .fontColor(this.item.permission ? '#666666' : '#CCCCCC')
-          .fontSize('31lpx')
-          .margin({ right: '8lpx' })
+          .fontSize(`${this.calcHeight(31)}lpx`)
+          .margin({ right: `${this.calcHeight(8)}lpx` })
 
         Image($r('app.media.mine_user_arrow'))
-          .width('27lpx')
-          .height('27lpx')
+          .width(`${this.calcHeight(27)}lpx`)
+          .height(`${this.calcHeight(27)}lpx`)
           .objectFit(ImageFit.Auto)
       }
 
     }
     .alignItems(VerticalAlign.Center)
     .justifyContent(FlexAlign.SpaceBetween)
-    .height('97lpx')
+    .height(`${this.calcHeight(97)}lpx`)
     .width('100%')
-    .padding({ left: '29lpx', right: '29lpx' })
+    .padding({ left: `${this.calcHeight(29)}lpx`, right: `${this.calcHeight(29)}lpx` })
     .backgroundColor('#FFFFFF')
-    .borderRadius('8lpx')
+    .borderRadius(`${this.calcHeight(8)}lpx`)
+  }
+
+  calcHeight(value:number): number{
+    return value * this.percent
   }
 }
 
@@ -180,6 +210,7 @@ struct getArrowCell {
 struct getTuiJianCell {
   @ObjectLink item: PrivacySettingModel;
   index:number = 0;
+  @Link percent:number
   build() {
     Column() {
 
@@ -187,12 +218,12 @@ struct getTuiJianCell {
         // 左侧标题
         Text(this.item.privacyName)
           .fontColor('#666666')
-          .fontSize('31lpx')
+          .fontSize(`${this.calcHeight(31)}lpx`)
 
         Row() {
           Toggle({ type: ToggleType.Switch, isOn: this.item.permission })
-            .height('58lpx')
-            .width('96lpx')
+            .height(`${this.calcHeight(58)}lpx`)
+            .width(`${this.calcHeight(96)}lpx`)
               .selectedColor('#ED2700')
             .onChange((isOn: boolean) => {
               // this.privacySwitch = isOn;
@@ -203,25 +234,29 @@ struct getTuiJianCell {
       }
       .alignItems(VerticalAlign.Center)
       .justifyContent(FlexAlign.SpaceBetween)
-      .height('97lpx')
+      .height(`${this.calcHeight(97)}lpx`)
       .width('100%')
 
 
       Blank()
         .backgroundColor('#EDEDED')
-        .height('1lpx')
+        .height(`${this.calcHeight(1)}lpx`)
 
       Text(DiyCloseTipsString)
         .fontColor('#999999')
-        .fontSize('23lpx')
-        .margin({ right: '8lpx' })
-        .height('69lpx')
+        .fontSize(`${this.calcHeight(23)}lpx`)
+        .margin({ right: `${this.calcHeight(8)}lpx` })
+        .height(`${this.calcHeight(69)}lpx`)
 
-    }
+    }.width('100%')
     .alignItems(HorizontalAlign.Start)
     .backgroundColor('#FFFFFF')
-    .borderRadius('8lpx')
-    .padding({ left: '29lpx', right: '29lpx' })
+    .borderRadius(`${this.calcHeight(8)}lpx`)
+    .padding({ left: `${this.calcHeight(29)}lpx`, right: `${this.calcHeight(29)}lpx` })
+  }
+
+  calcHeight(value:number): number{
+    return value * this.percent
   }
 }
 

@@ -2,7 +2,7 @@ import { MineSettingComponent } from '../setting/MineSettingComponent';
 import { AccountAndSecurityLayout } from '../setting/AccountAndSecurityLayout';
 import router from '@ohos.router';
 import { Params } from 'wdBean';
-import { DateTimeUtils } from 'wdKit/Index';
+import { BreakpointSystem, DateTimeUtils } from 'wdKit/Index';
 import { TrackingPageBrowse, TrackConstants } from 'wdTracking/Index';
 
 @Entry
@@ -51,6 +51,7 @@ struct SettingPage {
         AccountAndSecurityLayout({enterActivityTime:this.enterActivityTime})
       }
     }.setFullWidth()
+    .backgroundColor($r("app.color.white"))
   }
 
   // 私有方法

 import { BottomNavi, CommonConstants, SpConstants } from 'wdConstant';
-import { Logger, SPHelper, StringUtils } from 'wdKit';
+import { BreakpointSystem, Logger, SPHelper, StringUtils } from 'wdKit';
 import PageViewModel from '../../viewmodel/PageViewModel';
 import storageStatistics from "@ohos.file.storageStatistics";
 import { BusinessError } from '@ohos.base';
@@ -25,6 +25,17 @@ export struct MineSettingComponent {
   @State cacheSize: number = 0
   @State accountState:boolean=false
   preferences: dataPreferences.Preferences | null = null;
+  @StorageProp('currentBreakpoint') @Watch("currentChanged")currentBreakpoint: string = 'sm';
+  private breakpointSystem = new BreakpointSystem();
+  @State percent:number = 1
+
+  currentChanged(){
+    if(this.currentBreakpoint == "md" || this.currentBreakpoint == "lg"){
+      this.percent = 0.7
+    }else {
+      this.percent = 1
+    }
+  }
 
   dialogController: CustomDialogController = new CustomDialogController({
     builder: MyCustomDialog({
@@ -43,6 +54,8 @@ export struct MineSettingComponent {
     customStyle: true
   })
   aboutToAppear() {
+    this.breakpointSystem.register();
+    this.currentChanged()
     // 获取设置页面数据
     this.getSettingPageData()
 
@@ -54,6 +67,10 @@ export struct MineSettingComponent {
 
   }
 
+  aboutToDisappear(): void {
+    this.breakpointSystem.unregister();
+  }
+
   async getAccountState(){
     let userId=await SPHelper.default.get(SpConstants.USER_ID,'') as string
     if(userId==''){
@@ -91,13 +108,13 @@ export struct MineSettingComponent {
             if (item.type == 0) {
               Column() {
                 this.getArrowCell(item,index)
-              }.padding({ left: '27lpx' }).height('117lpx').justifyContent(FlexAlign.Center)
+              }.padding({ left: `${this.calcHeight(27)}lpx` }).height(`${this.calcHeight(117)}lpx`).justifyContent(FlexAlign.Center)
             } else if (item.type == 1) {
               Column() {
                 this.getSwitchCell(item,index)
-              }.padding({ left: '27lpx' }).height('117lpx').justifyContent(FlexAlign.Center)
+              }.padding({ left: `${this.calcHeight(27)}lpx` }).height(`${this.calcHeight(117)}lpx`).justifyContent(FlexAlign.Center)
             } else {
-              Column().width('100%').height('15lpx').backgroundColor(0xf0f0f0)
+              Column().width('100%').height(`${this.calcHeight(15)}lpx`).backgroundColor(0xf0f0f0)
             }
           }
         })
@@ -112,7 +129,7 @@ export struct MineSettingComponent {
   @Builder itemHead(text: string) {
     // 列表分组的头部组件，对应联系人分组A、B等位置的组件
     if (text.length > 0) {
-      Row().width('100%').height('20lpx').backgroundColor(0xf0f0f0)
+      Row().width('100%').height(`${this.calcHeight(20)}lpx`).backgroundColor(0xf0f0f0)
     }
   }
 
@@ -125,28 +142,29 @@ export struct MineSettingComponent {
           // 判断有没有图片
           if (0) {
             Image('https://pic.rmb.bdstatic.com/e182cf67c341d1128d2a6cc05886bf62.jpeg@s_0,h_2000')
-              .height('38lpx')
-              .margin({ right: '5lpx' })
+              .height(`${this.calcHeight(38)}lpx`)
+              .margin({ right: `${this.calcHeight(5)}lpx` })
 
             Text(`${item.title}`)
-              .margin({ top: '8lpx' })
-              .height('38lpx')
+              .margin({ top: `${this.calcHeight(8)}lpx` })
+              .height(`${this.calcHeight(38)}lpx`)
               .fontColor('#333333')
-              .fontSize('29lpx')
+              .fontSize(`${this.calcHeight(29)}lpx`)
           } else {
             Text(`${item.title}`)
-              .margin({ top: '8lpx' })
-              .height('38lpx')
+              .margin({ top: `${this.calcHeight(8)}lpx` })
+              .height(`${this.calcHeight(38)}lpx`)
               .fontColor('#333333')
-              .fontSize('29lpx')
+              .fontSize(`${this.calcHeight(29)}lpx`)
           }
         }.width('60%')
 
         // 右侧文案和右箭头
         Row() {
           Toggle({ type: ToggleType.Switch, isOn: item.switchState })
-            .height('50lpx')
-            .margin({ left: '81lpx', right: '29lpx' })
+            .height(`${this.calcHeight(50)}lpx`)
+            .width(`${this.calcHeight(96)}lpx`)
+            .margin({ left: `${this.calcHeight(81)}lpx`, right: `${this.calcHeight(29)}lpx` })
             .selectedColor("#ED2800")
             .onChange((isOn: boolean) => {
               if(item.itemType=='push_switch'){
@@ -168,13 +186,13 @@ export struct MineSettingComponent {
               }
             })
         }.width('40%')
-        .margin({ right: '29lpx' })
+        .margin({ right: `${this.calcHeight(29)}lpx` })
         .justifyContent(FlexAlign.End)
 
       }
       .alignItems(VerticalAlign.Center)
       .justifyContent(FlexAlign.SpaceBetween)
-    }.height('54lpx')
+    }.height(`${this.calcHeight(54)}lpx`)
   }
 
   // 右文字+箭头cell
@@ -185,10 +203,10 @@ export struct MineSettingComponent {
         // 左侧logo和标题
         Row() {
           Text(`${item.title}`)
-            .margin({ top: '8lpx' })
-            .height('38lpx')
+            .margin({ top: `${this.calcHeight(8)}lpx` })
+            .height(`${this.calcHeight(38)}lpx`)
             .fontColor('#333333')
-            .fontSize('29lpx')
+            .fontSize(`${this.calcHeight(29)}lpx`)
         }.width('60%')
 
         // 右侧文案和右箭头
@@ -197,13 +215,13 @@ export struct MineSettingComponent {
             .fontColor('#999999')
             .maxLines(1)
           Image($r('app.media.mine_user_arrow_2'))
-            .width('27lpx')
-            .height('27lpx')
+            .width(`${this.calcHeight(27)}lpx`)
+            .height(`${this.calcHeight(27)}lpx`)
             .objectFit(ImageFit.Auto)
             .interpolation(ImageInterpolation.High)
-          Column().width('29lpx')
+          Column().width(`${this.calcHeight(29)}lpx`)
         }.width('40%')
-        .margin({ right: '29lpx' })
+        .margin({ right: `${this.calcHeight(29)}lpx` })
         .justifyContent(FlexAlign.End)
 
       }
@@ -211,7 +229,7 @@ export struct MineSettingComponent {
       .justifyContent(FlexAlign.SpaceBetween)
 
     }
-    .height('54lpx')
+    .height(`${this.calcHeight(54)}lpx`)
     .onClick(() => {
       if (item.itemType == 'account') {
         trackButtonClick("settingPageAccountManagement")
@@ -266,6 +284,10 @@ export struct MineSettingComponent {
     }
     this.preferences.on('change', observer);
   }
+
+  calcHeight(value:number): number{
+    return value * this.percent
+  }
 }
 
 function trackButtonClick(buttonName: string){

@@ -13,7 +13,7 @@ import { PlayerBottomView } from '../view/PlayerBottomView';
 import { PlayerRightView } from '../view/PlayerRightView';
 import { DisplayDirection } from 'wdConstant/Index';
 import { CommentDialogView } from '../view/CommentDialogView';
-import { window } from '@kit.ArkUI';
+import { componentUtils, window } from '@kit.ArkUI';
 import { PlayerFullScreenView } from '../view/PlayerFullScreenView';
 import { OperRowListView, publishCommentModel } from 'wdComponent/Index';
 import { ParamType, TrackConstants } from 'wdTracking/Index';
@@ -207,14 +207,17 @@ export struct DetailPlayShortVideoPage {
    * 屏幕变化动态计算播放器宽高
    */
   calculatePlayerRect() {
-    let width = this.windowWidth
-    let height = this.windowHeight
+    const windowClass = WindowModel.shared.getWindowClass(); // 获取应用主窗口
+    const rect: window.Rect = windowClass.getWindowProperties().windowRect;
+
+    let width = rect.width
+    let height = rect.height
     if (this.displayDirection === DisplayDirection.VERTICAL) {
-      width = this.windowWidth
-      height = this.windowHeight
+      width = rect.width
+      height = rect.height
     } else {
-      width = this.windowHeight
-      height = this.windowWidth
+      width = rect.height
+      height = rect.width
     }
     // 视频宽高比屏幕大，则宽度撑满
     if (this.ratio > width / height) {
@@ -225,7 +228,7 @@ export struct DetailPlayShortVideoPage {
       this.playerHeight = '100%'
       this.playerWidth = px2vp(height * this.ratio)
     }
-    console.log('calculatePlayerRect=====', this.windowWidth, this.windowHeight)
+    console.log('calculatePlayerRect=====', width, height)
 
   }
 
@@ -287,6 +290,7 @@ export struct DetailPlayShortVideoPage {
       .width('100%')
 
     }
+    .id('video-container')
     .height('100%')
     .width('100%')
     .onAreaChange(() => this.calculatePlayerRect())
@@ -314,7 +318,9 @@ export struct DetailPlayShortVideoPage {
 
   @Builder
   playerViewBuilder() {
-    Stack({alignContent: this.showCommentList && this.index === this.currentIndex ? Alignment.Top : Alignment.Center}) {
+    Stack({
+      alignContent: this.showCommentList && this.index === this.currentIndex ? Alignment.Top : Alignment.Center
+    }) {
       WDPlayerRenderView({
         playerController: this.playerController,
         onLoad: async () => {

-import { Logger, EmitterEventId, EmitterUtils, DateTimeUtils,CustomToast, StringUtils, NetworkUtil  } from 'wdKit'
+import { Logger, EmitterEventId, EmitterUtils, DateTimeUtils,CustomToast, StringUtils, NetworkUtil,
+  BreakpointSystem  } from 'wdKit'
 import router from '@ohos.router'
 import { LoginViewModel } from './LoginViewModel'
 import { LoginInputComponent } from './LoginInputComponent'
@@ -56,6 +57,17 @@ struct LoginPage {
 
   loginViewModel = new LoginViewModel()
   @State isProtocol:boolean=false
+  @StorageProp('currentBreakpoint') @Watch("currentChanged")currentBreakpoint: string = 'sm';
+  private breakpointSystem = new BreakpointSystem();
+  @State percent:number = 1
+
+  currentChanged(){
+    if(this.currentBreakpoint == "md" || this.currentBreakpoint == "lg"){
+      this.percent = 0.7
+    }else {
+      this.percent = 1
+    }
+  }
   onCodeSend() {
     Logger.debug(TAG, "isCodeSend:" + this.isCodeSend + "")
     if (this.isCodeSend) {
@@ -66,6 +78,12 @@ struct LoginPage {
 
   aboutToAppear() {
     Logger.debug(TAG, "aboutToAppear:" + this.isCodeSend + "")
+    this.breakpointSystem.register();
+    this.currentChanged()
+  }
+
+  aboutToDisappear(): void {
+    this.breakpointSystem.unregister();
   }
 
   onPageShow() {
@@ -144,10 +162,10 @@ struct LoginPage {
             Text("登录")
               .borderRadius(4)
               .fontColor(this.isSubmit ? "#FFFFFFFF" : "#66FFFFFF")
-              .fontSize("31lpx")
+              .fontSize(`${this.calcHeight(31)}lpx`)
               .fontWeight(400)
-              .margin({ top: 20 })
-              .lineHeight("50lpx")
+              .margin({ top: `${this.calcHeight(20)}` })
+              .lineHeight(`${this.calcHeight(50)}lpx`)
 				      .height(44)
               .textAlign(TextAlign.Center)
               .width("100%")
@@ -170,9 +188,9 @@ struct LoginPage {
           if (!this.checkCodePage) {
             Text('忘记密码')
               .fontColor('#666666')
-              .fontSize("31lpx")
+              .fontSize(`${this.calcHeight(31)}lpx`)
               .fontWeight(400)
-              .lineHeight("38lpx")
+              .lineHeight(`${this.calcHeight(38)}lpx`)
               .margin({ top: 16 })
               .onClick(() => {
                 TrackingButton.click("loginPageForgotPassword",TrackConstants.PageName.Login_Page,TrackConstants.PageName.Login_Page)
@@ -217,7 +235,8 @@ struct LoginPage {
 
       ProtocolComponent({
         cancelMethod: (): void => this.cancelProtocol(),
-        agreeMethod: (): void => this.agreeProtocol()
+        agreeMethod: (): void => this.agreeProtocol(),
+        percent:$percent
       })
         .visibility(this.isProtocol ? Visibility.Visible : Visibility.None)
 
@@ -301,15 +320,15 @@ struct LoginPage {
       Row() {
         Row() {
           Image(this.checkCodePage ? $r('app.media.login_qt') : $r('app.media.login_other_password'))
-            .size({ width: "35lpx", height: "35lpx" })
-            .margin({right:"8lpx"})
-            .height("38lpx")
-            .width("38lpx")
+            .size({ width: `${this.calcHeight(35)}lpx`, height: `${this.calcHeight(35)}lpx` })
+            .margin({right:`${this.calcHeight(8)}lpx`})
+            .height(`${this.calcHeight(38)}lpx`)
+            .width(`${this.calcHeight(38)}lpx`)
           Text(this.checkCodePage ? "密码登录" : "手机号登录")
             .fontWeight(400)
             .fontColor("#3D3D3D")
-            .fontSize("23lpx")
-            .lineHeight("38lpx")
+            .fontSize(`${this.calcHeight(23)}lpx`)
+            .lineHeight(`${this.calcHeight(38)}lpx`)
         }
         .onClick(() => {
           this.onPageHide()
@@ -332,7 +351,7 @@ struct LoginPage {
       }.height(36)
       .width('100%')
       .padding({ left: 25, right: 25 })
-      .margin({ top: "46lpx" })
+      .margin({ top: `${this.calcHeight(46)}lpx` })
     }
     .width('100%')
     .margin({ bottom: 40 })
@@ -478,7 +497,9 @@ struct LoginPage {
       .slide(SlideEffect.Right)
   }
 
-
+  calcHeight(value:number): number{
+    return value * this.percent
+  }
 }
 
 
@@ -486,41 +507,42 @@ struct LoginPage {
 struct ProtocolComponent {
   cancelMethod?: () => void
   agreeMethod?: () => void
+  @Link percent:number
 
   build() {
     Stack() {
       Column() {
         Text("温馨提示")
           .fontColor("#222222")
-          .fontSize("35lpx")
-          .lineHeight("50lpx")
+          .fontSize(`${this.calcHeight(35)}lpx`)
+          .lineHeight(`${this.calcHeight(50)}lpx`)
           .width("100%")
           .fontWeight(500)
           .textAlign(TextAlign.Center)
-          .margin({ top: "38lpx" })
+          .margin({ top: `${this.calcHeight(38)}lpx` })
         Text() {
           Span("为保障您的合法权益，请阅读并同意")
-            .fontSize("27lpx")
-            .lineHeight("42lpx")
+            .fontSize(`${this.calcHeight(27)}lpx`)
+            .lineHeight(`${this.calcHeight(42)}lpx`)
             .fontWeight(400)
             .fontColor("#666666")
 
           Span("《用户协议》")
-            .fontSize("27lpx")
-            .lineHeight("42lpx")
+            .fontSize(`${this.calcHeight(27)}lpx`)
+            .lineHeight(`${this.calcHeight(42)}lpx`)
             .fontWeight(400)
             .fontColor("#ED2800")
             .onClick(() => {
             let bean = { contentID: "1", pageID: "" } as Params
             WDRouterRule.jumpWithPage(WDRouterPage.loginProtocolPage, bean)
           })
-          Span("及").fontSize("27lpx")
-            .lineHeight("42lpx")
+          Span("及").fontSize(`${this.calcHeight(27)}lpx`)
+            .lineHeight(`${this.calcHeight(42)}lpx`)
             .fontWeight(400)
             .fontColor("#666666")
           Span("《隐私政策》")
-            .fontSize("27lpx")
-            .lineHeight("42lpx")
+            .fontSize(`${this.calcHeight(27)}lpx`)
+            .lineHeight(`${this.calcHeight(42)}lpx`)
             .fontWeight(400)
             .fontColor("#ED2800")
             .onClick(() => {
@@ -528,20 +550,20 @@ struct ProtocolComponent {
             WDRouterRule.jumpWithPage(WDRouterPage.loginProtocolPage, bean)
           })
           Span("后进行登录")
-            .fontSize("27lpx")
-            .lineHeight("42lpx")
+            .fontSize(`${this.calcHeight(27)}lpx`)
+            .lineHeight(`${this.calcHeight(42)}lpx`)
             .fontWeight(400)
             .fontColor("#666666")
-        }.margin({ top: "23lpx", left: "31lpx", right: "31lpx" })
+        }.margin({ top: `${this.calcHeight(23)}lpx`, left: `${this.calcHeight(31)}lpx`, right: `${this.calcHeight(31)}lpx` })
         .wordBreak(WordBreak.BREAK_ALL)
         .textAlign(TextAlign.Start)
 
-        Divider().color("#f5f5f5").width("100%").margin({ top: "27lpx" }).height('1lpx').strokeWidth('1lpx')
+        Divider().color("#f5f5f5").width("100%").margin({ top: `${this.calcHeight(27)}lpx` }).height(`${this.calcHeight(1)}lpx`).strokeWidth(`${this.calcHeight(1)}lpx`)
         Row() {
           Text('放弃登录')
-            .fontSize("31lpx")
+            .fontSize(`${this.calcHeight(31)}lpx`)
             .fontWeight(500)
-            .lineHeight("42lpx")
+            .lineHeight(`${this.calcHeight(42)}lpx`)
             .fontColor("#999999")
             .layoutWeight(1)
             .textAlign(TextAlign.Center)
@@ -553,17 +575,17 @@ struct ProtocolComponent {
             .height('100%')
 
           Divider()
-            .width("1lpx")
-            .strokeWidth('1lpx')
+            .width(`${this.calcHeight(1)}lpx`)
+            .strokeWidth(`${this.calcHeight(1)}lpx`)
             .vertical(true)
             .height('100%')
             .color("#F5F5F5")
 
 
           Text('同意并登录')
-            .fontSize("31lpx")
+            .fontSize(`${this.calcHeight(31)}lpx`)
             .fontWeight(500)
-            .lineHeight("42lpx")
+            .lineHeight(`${this.calcHeight(42)}lpx`)
             .fontColor("#ED2800")
             .layoutWeight(1)
             .textAlign(TextAlign.Center)
@@ -582,15 +604,19 @@ struct ProtocolComponent {
         .justifyContent(FlexAlign.Center)
       }
       .backgroundColor(Color.White)
-      .borderRadius("12lpx")
-      .width("528lpx")
-      .height("309lpx")
+      .borderRadius(`${this.calcHeight(12)}lpx`)
+      .width(`${this.calcHeight(528)}lpx`)
+      .height(`${this.calcHeight(309)}lpx`)
 
     }.width('100%')
     .height('100%')
     .backgroundColor('#66000000')
 
   }
+
+  calcHeight(value:number): number{
+    return value * this.percent
+  }
 }
 
 function trackTypeClick(typeValue: number,pageId: string){

@@ -27,6 +27,7 @@ struct Index {
   @State name: string = 'audio_status_wait';
 
   async aboutToAppear() {
+    window.findWindow("subWindow").setWindowBackgroundColor("#00000000")
     this.AudioSuspension.playerController.get().onTimeUpdate = (position, duration) => {
       this.currentTime = DateFormatUtil.convertMillisecondsToMinutesSeconds(position);
       this.totalTime = DateFormatUtil.convertMillisecondsToMinutesSeconds(duration);