HarmonyOS 鸿蒙Next 透明page

发布于 1周前 作者 htzhanglong 来自 鸿蒙OS

HarmonyOS 鸿蒙Next 透明page 我使用createSubWindow实现透明的页面

windowStege.createSubWindow(MediaDetailPage.MEDIA_DETAIL_WINDOW_NAME + MediaDetailWin.MediaPageCnt, (err, win) => {
  win.loadContent('pages/media/MediaDetailPage', storage);
  win.showWindow();
})

然后实现拖拽 媒体关闭页面的效果 但是现在遇到了一些问题，我可以打开不止一个媒体页面，多次创建createSubWindow时会有问题，我应该怎么做

路径是这样的 先打开了一个新的window加载一个Apage

1->createSubWindow(loadPage(‘APage’))

再Apage的基础上打开了BPage

2->router.pushUrl(‘BPage’)

在BPage还要打开APage

3->createSubWindow(loadPage(‘APage’))


更多关于HarmonyOS 鸿蒙Next 透明page的实战系列教程也可以访问 https://www.itying.com/category-93-b0.html

Harmonyos Next教程
2 回复

根据你的意思，我理解的是想要在子窗口中创建子窗口，需保证每次创建的子窗口名不一样，参考demo //EntryAbility.ets

onWindowStageCreate(windowStage: window.WindowStage): void {
    hilog.info(0x0000, 'testTag', '%{public}s', 'Ability onWindowStageCreate');

    windowStage.loadContent('pages/Index', (err) => {
      if (err.code) {
        hilog.error(0x0000, 'testTag', 'Failed to load the content. Cause: %{public}s', JSON.stringify(err) ?? '');
        return;
      }
      hilog.info(0x0000, 'testTag', 'Succeeded in loading the content.');
      AppStorage.setAndRef("windowStage",windowStage)
    });
  }

//Index.ets

import { window } from '@kit.ArkUI';

@Entry
@Component
struct Index {
  @State message: string = '此应用为首页面';

  build() {
    RelativeContainer() {
      Text(this.message)
        .id('HelloWorld')
        .fontSize(50)
        .fontWeight(FontWeight.Bold)
        .alignRules({
          center: { anchor: '__container__', align: VerticalAlign.Center },
          middle: { anchor: '__container__', align: HorizontalAlign.Center }
        })

      Button("click to subWindow")
        .onClick(()=>{
          let windowStege: window.WindowStage = AppStorage.get('windowStage') as window.WindowStage;
          windowStege.createSubWindow('subWindow', (err, win) => {
            win.setUIContent("pages/PageA")
            win.showWindow();
          })
        })
    }
    .height('100%')
    .width('100%')
  }
}

//PageA.ets

import { router } from '@kit.ArkUI';

@Entry
@Component
struct PageA {
  @State message: string = 'aaaaaaa';

  build() {
    RelativeContainer() {
      Text(this.message)
        .id('PageAHelloWorld')
        .fontSize(50)
        .fontWeight(FontWeight.Bold)
        .alignRules({
          center: { anchor: '__container__', align: VerticalAlign.Center },
          middle: { anchor: '__container__', align: HorizontalAlign.Center }
        })

      Button("goto PageB")
        .onClick(()=>{
          router.pushUrl({
            url:"pages/PageB"
          })
        }).margin({
        top:300
      })
    }
    .height('100%')
    .width('100%')
  }
}

//PageB.ets

import { window } from '@kit.ArkUI';

@Entry
@Component
struct PageB {
  @State message: string = 'bbbbbb';

  build() {
    RelativeContainer() {
      Text(this.message)
        .id('PageBHelloWorld')
        .fontSize(50)
        .fontWeight(FontWeight.Bold)
        .alignRules({
          center: { anchor: '__container__', align: VerticalAlign.Center },
          middle: { anchor: '__container__', align: HorizontalAlign.Center }
        })

      Button("new subWindow").onClick(()=>{
        let windowStege: window.WindowStage = AppStorage.get('windowStage') as window.WindowStage;
        windowStege.createSubWindow('subWindow2', (err, win) => {
          win.setUIContent("pages/PageA")
          win.showWindow();
        })
      })
        .margin({
          top:300
        })
    }
    .height('100%')
    .width('100%')
  }
}

更多关于HarmonyOS 鸿蒙Next 透明page的实战系列教程也可以访问 https://www.itying.com/category-93-b0.html


针对帖子标题“HarmonyOS 鸿蒙Next 透明Page”的问题，以下是一个简洁且专业的回答：

在HarmonyOS（鸿蒙）系统中实现透明Page（页面）的效果，通常涉及到对页面背景色的设置以及可能的对页面内组件透明度的调整。在鸿蒙的开发框架中，你可以通过以下方式来实现透明Page：

  1. 设置页面背景透明：

    • 在页面的XML布局文件中，将根布局的background属性设置为透明，例如使用#00000000（完全透明）或者调整ARGB值以达到所需的透明度。

  2. 调整组件透明度：

    • 如果需要页面内的某些组件也呈现透明效果，可以通过设置这些组件的alpha属性来调整透明度。alpha值的范围是0到1，其中0表示完全透明，1表示完全不透明。

  3. 注意层级关系：

    • 在实现透明效果时，需要注意页面内组件的层级关系，确保透明组件不会遮挡住需要显示的内容。

  4. 测试与调试：

    • 在不同设备和屏幕尺寸上测试透明Page的效果，以确保其在各种环境下的表现一致。

如果以上方法未能解决你的问题，或者你在实现过程中遇到了其他技术难题，请联系官网客服获取进一步的支持。官网地址是：https://www.itying.com/category-93-b0.html

回到顶部