在HarmonyOS NEXT开发中全局弹窗demo？

Question

在HarmonyOS NEXT开发中全局弹窗demo？手机号互踢需求。在A手机登录手机号之后，在B手机登录相同的手机号时，需要在A手机上弹出对话框，告知用户手机号已在别的设备登录，此设备已退出登录。需要A手机在应用的任何页面都可以弹窗此对话框。

Answer 1

可以参考以下demo:

index.ets 
import { GlobalContext } from './GlobalContext'; 
import { testPromptDialog } from './HttpUtil'; 
import { promptAction } from '@kit.ArkUI'; 
 
@Entry 
@Component 
struct Index { 
  aboutToAppear(): void { 
    GlobalContext.getContext().setObject('UIContext', this) 
  } 
  build() { 
    Row() { 
      Column() { 
        Button("promptAction弹窗") 
          .onClick(() => { 
            testPromptDialog() 
          }) 
      } 
      .width('100%') 
    } 
    .height('100%') 
  } 
} 
GlobalContext.ets 
 
export class GlobalContext { 
  private constructor() { 
  } 
 
  private static instance: GlobalContext; 
  private _objects = new Map<string, Object>(); 
  public static getContext(): GlobalContext { 
    if (!GlobalContext.instance) { 
      GlobalContext.instance = new GlobalContext(); 
    } 
    return GlobalContext.instance; 
  } 
  getObject(value: string): Object | undefined { 
    return this._objects.get(value); 
  } 
  setObject(key: string, objectClass: Object): void { 
    this._objects.set(key, objectClass); 
  } 
} 
HttpUtil.ets 
 
 
 
let customDialogId: number = 0 
@Builder 
export function customDialogBuilder(content: String) { 
  Column() { 
    Text(Tip: ${content} ).fontSize(20).height("30%") 
    Text('失败原因：失败原因!').fontSize(16).height("30%") 
    Row() { 
      Button("确认").onClick(() => { 
        promptAction.closeCustomDialog(customDialogId) 
      }) 
      Blank().width(50) 
      Button("取消").onClick(() => { 
        promptAction.closeCustomDialog(customDialogId) 
      }) 
    } 
    .margin({ top: 30 }) 
  }.height(200).padding(5) 
} 
export function testPromptDialog() { 
  const that = GlobalContext.getContext().getObject('UIContext') as UIContext; 
  if (that) { 
    promptAction.openCustomDialog({ 
      builder: customDialogBuilder.bind(that, "网络请求失败！") 
    }).then((dialogId: number) => { 
      customDialogId = dialogId; 
    }) 
  } 
}