HarmonyOS如何全局打开一个自定义对话框?

自定义对话框A,要在各个地方,无法确定是从哪里发起的打开,如何实现?

HarmonyOS
2024-09-29 10:35:50
浏览
收藏 0
回答 1
待解决
回答 1
按赞同
/
按时间
superinsect

使用最新的openCustomDialog,文档:https://developer.huawei.com/consumer/cn/doc/harmonyos-references-V5/js-apis-arkui-uicontext-V5#opencustomdialog12

参考demo:

// 1、EntryAbility.ets  
onWindowStageCreate(windowStage: window.WindowStage): void {  
    // Main window is created, set main page for this ability  
    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.');  
      let windowClass: window.Window = windowStage.getMainWindowSync();  
      // 获取UIContext实例。  
      let uiContext: UIContext | null = null;  
      uiContext = windowClass.getUIContext();  
      GlobalContext.getContext().setObject('UIContext', uiContext)  
    });  
  }
// 2、DialogModel.ets  
import { GlobalContext } from './GlobalContext';  
import { ComponentContent } from '@kit.ArkUI';  
let uiContext = GlobalContext.getContext().getObject('UIContext') as UIContext;  
let promptAction = uiContext.getPromptAction();  
export class Params {  
  account: string = ""  
  password: string = ""  
  constructor(account: string, password: string) {  
    this.account = account;  
    this.password = password;  
  }  
}  
let contentNode = new ComponentContent(uiContext, wrapBuilder(customDialogBuilder),  
  new Params('', ''));  
@Builder  
export function customDialogBuilder(params: Params) {  
  Column() {  
    Column() {  
      Row() {  
        Image($r('app.media.ic_close'))  
          .width(26).height(26)  
          .onClick(() => {  
            closeDialog()  
          })  
        Text('登录普通账号')  
          .fontSize(16)  
          .fontWeight(FontWeight.Medium)  
          .fontColor('#182431')  
         

          .fontWeight(FontWeight.Medium)  
          .backgroundColor('#007dff')  
          .margin({ top: 20, bottom: 14 })  
          .onClick(() => {  
            // 更新数据  
            contentNode.update(params);  
            closeDialog()  
          })  
      }  
      .width('100%')  
      .height(260)  
      .padding({ left: 14, right: 14 })  
      .alignItems(HorizontalAlign.Start)  
    }  
    .backgroundColor(Color.White)  
    .width('100%')  
    .borderRadius({ topLeft: 16, topRight: 16 })  
    .offset({ x: 0, y: 15 })  
    .padding({bottom: 20})  
  }  
  .width('100%')  
  .height('100%')  
  .justifyContent(FlexAlign.End)  
}  
@Extend(TextInput)  
function inputStyle() {  
  .placeholderColor('#99182431')  
  .backgroundColor(Color.Transparent)  
  .height(45)  
  .width('100%')  
  .padding(0)  
  .margin(0)  
}  
function closeDialog() {  
  promptAction.closeCustomDialog(contentNode);  
}  
export function openPromptCustomDialog() {  
  promptAction.openCustomDialog(contentNode, {  
    // 防止系统back 导致弹框关闭  
    onWillDismiss:(dismissDialogAction: DismissDialogAction)=> {  
    },  
    transition: TransitionEffect.OPACITY.animation({ duration: 100 }).combine(TransitionEffect.translate({ y: 150 }))  
  });  
}
// 3、Index.ets  
import { openPromptCustomDialog } from '../DialogModel';  
@Entry  
@Component  
struct Index {  
  build() {  
    Row() {  
      Column() {  
        Button("promptAction弹窗")  
          .onClick(() => {  
            openPromptCustomDialog()  
          })  
      }  
      .width('100%')  
      .expandSafeArea([SafeAreaType.KEYBOARD, SafeAreaType.SYSTEM])  
    }  
    .height('100%')  
  }  
}
// 4、GlobalContext .ets  
export class GlobalContext {  
  private static instance: GlobalContext;  
  private _objects: Map<string, Object>;  
  private constructor() {  
    this._objects = new Map<string, Object>();  
  }  
  public static getContext(): GlobalContext {  
    if (!GlobalContext.instance) {  
      GlobalContext.instance = new GlobalContext();  
    }  
    return GlobalContext.instance;  
  }  
  getObject(key: string): Object | undefined {  
    return this._objects.get(key);  
  }  
  setObject(key: string, objectClass: Object): void {  
    this._objects.set(key, objectClass);  
  }  
  deleteObject(key: string): void {  
    this._objects.delete(key);  
  }  
}
分享
微博
QQ
微信
回复
2024-09-29 16:13:01
相关问题
如何封装一个自定义Dialog对话框
2131浏览 • 1回复 待解决
如何实现一个自定义询问
352浏览 • 1回复 待解决
如何全局实现一个自定义dialog弹窗
2726浏览 • 1回复 待解决
HarmonyOS 实现一个自定义分类列表
182浏览 • 1回复 待解决
如何快速开发出一个自定义弹窗?
301浏览 • 1回复 待解决
如何实现一个自定义样式的toast提示
1849浏览 • 1回复 待解决
HarmonyOS 全局自定义弹窗demo
225浏览 • 1回复 待解决
如何开一个半透明的页面?
248浏览 • 1回复 待解决
怎样实现一个自定义播放器?
285浏览 • 1回复 待解决