HarmonyOS 5.0.0 关于PromptActionClass封装的工具类自定义弹窗

关于PromptActionClass封装的工具类自定义弹窗

由官方的PromptActionClass进行再次封装，使用更加方便 目前可以使用string，object类型参数传递和回调，普通弹窗基本可以实现，picker弹窗在布局中自行添加，实现的效果由buildText1 的简单布局

import { PromptActionClass } from "./PromptActionClass";
import { WifiDialog } from "./WifiDialog";
import { ComponentContent } from "@kit.ArkUI";
import { Utils } from "../Utils";
import { RotateAnim } from "../../component/RotateAnim";

/*
  buildText//布局中包含param
  * param // param要和自定义的buildText相关联，类型不对会报错
 */
export class PromptActionClassUtils {
  //这是外界调用的 这个函数的实现一定是在外部
  static renderitem: () => void
  static buildText: WrappedBuilder<[]>

  //模板1
  static openSurePromptActionDialog(ctx: UIContext, buildText: WrappedBuilder<[OneclickParams]>, param: OneclickParams,
    autoCancel?: boolean | true) {
    PromptActionClass.setContext(ctx)
    let contentNode: ComponentContent<Object> = new ComponentContent(ctx, buildText, param);
    PromptActionClass.setContentNode(contentNode);
    PromptActionClass.setOptions({
      alignment: DialogAlignment.Center,
      offset: { dx: 0, dy: 0 },
      autoCancel
    }); // 在屏幕中的位置
    PromptActionClass.openDialog()
  }

  //模板1
  //autoCancel 外部点击
  static openObjectDialog(ctx: UIContext, buildText: WrappedBuilder<[OneclickObjectParams]>,
    param: OneclickObjectParams, autoCancel?: boolean | true) {
    PromptActionClass.setContext(ctx)
    let contentNode: ComponentContent<Object> = new ComponentContent(ctx, buildText, param);
    PromptActionClass.setContentNode(contentNode);
    PromptActionClass.setOptions({
      alignment: DialogAlignment.Center,
      offset: { dx: 0, dy: 0 },
      autoCancel
    }); // 在屏幕中的位置
    PromptActionClass.openDialog()
  }

  //模板1
  static openSurePromptActionBottomDialog(ctx: UIContext, buildText: WrappedBuilder<[OneclickParams]>,
    param: OneclickParams) {
    PromptActionClass.setContext(ctx)
    let contentNode: ComponentContent<Object> = new ComponentContent(ctx, buildText, param);
    PromptActionClass.setContentNode(contentNode);
    PromptActionClass.setOptions({ alignment: DialogAlignment.Bottom, offset: { dx: 0, dy: 0 } }); // 在屏幕中的位置
    PromptActionClass.openDialog()
  }


  //模板3
  static openYourDialog(ctx: UIContext, buildText: WrappedBuilder<[CommonParams]>, param: CommonParams) {
    PromptActionClass.setContext(ctx)
    let contentNode: ComponentContent<Object> =
      new ComponentContent(ctx, buildText, param);
    PromptActionClass.setContentNode(contentNode);
    PromptActionClass.setOptions({ alignment: DialogAlignment.Center, offset: { dx: 0, dy: 0 } }); // 在屏幕中的位置
    PromptActionClass.openDialog()
  }


}



export class CommonParams {
  text: string = ""

  constructor(text: string) {
    this.text = text;
  }
}

//点击回调的参数
export class OneclickParams {
  content: string = ""
  sureOnclick: (value: string) => void = () => {
  }

  constructor(content: string, sureOnclick: (value: string) => void = () => {
  }) {
    this.content = content;
    this.sureOnclick = sureOnclick
  }
}

//点击回调的参数
export class OneclickObjectParams {
  obj: object = new Object
  sureOnclick: (value: string) => void = () => {
  }

  constructor(obj: object, sureOnclick: (value: string) => void = () => {
  }) {
    this.obj = obj;
    this.sureOnclick = sureOnclick
  }
}

//点击回调的参数
export class TwoclickParams extends CommonParams {
  title: string = ""
  sureOnclick: () => void = () => {
  }
  cancelOnclick: () => void = () => {
  }

  constructor(title: string, data: string[], sureOnclick: () => void = () => {
  }, cancelOnclick: () => void = () => {
  }) {
    super('')
    this.title = title;
    this.sureOnclick = sureOnclick
    this.cancelOnclick = cancelOnclick
  }
}

官方的PromptActionClass

// PromptActionClass.ts
import { BusinessError } from '@kit.BasicServicesKit';
import { ComponentContent, promptAction, window } from '@kit.ArkUI';
import { UIContext } from '@ohos.arkui.UIContext';

export interface onClickListener{
  onclick()
}

export class PromptActionClass {
  static ctx: UIContext;
  static contentNode: ComponentContent<Object>;
  static options: Object;
  // static onclick:() =>void= () => {}
  static onclick:() => {}
  static listen :onClickListener

  // static setOnClick(onClick:onClickListener){
  //     this.listen = onClick
  // }

  static setOnClick

  static setContext(context: UIContext) {
    this.ctx = context;
  }

  static setContentNode(node: ComponentContent<Object>) {
    this.contentNode = node;
  }

  static setOptions(options: Object) {
    this.options = options;
  }


  static openDialog() {
    if (this.contentNode !== null) {
      this.ctx.getPromptAction().openCustomDialog(this.contentNode, this.options)
        .then(() => {
          console.info('OpenCustomDialog complete.')
        })
        .catch((error: BusinessError) => {
          let message = (error as BusinessError).message;
          let code = (error as BusinessError).code;
          console.error(`OpenCustomDialog args error code is ${code}, message is ${message}`);
        })
    }
  }
  // 设置关闭蒙版点击
  static openDialogs(closeMeng:boolean){
    let option = this.options as promptAction.BaseDialogOptions

    option.isModal = closeMeng
    if (this.contentNode !== null) {
      this.ctx.getPromptAction().openCustomDialog(this.contentNode, option)
        .then(() => {
          console.info('OpenCustomDialog complete.')
        })
        .catch((error: BusinessError) => {
          let message = (error as BusinessError).message;
          let code = (error as BusinessError).code;
          console.error(`OpenCustomDialog args error code is ${code}, message is ${message}`);
        })
    }
  }

  static closeDialog() {
    if (this.contentNode !== null) {
      this.ctx.getPromptAction().closeCustomDialog(this.contentNode)
        .then(() => {
          console.info('CloseCustomDialog complete.')
        })
        .catch((error: BusinessError) => {
          let message = (error as BusinessError).message;
          let code = (error as BusinessError).code;
          console.error(`CloseCustomDialog args error code is ${code}, message is ${message}`);
        })
    }
  }

  static updateDialog(options: Object) {
    if (this.contentNode !== null) {
      this.ctx.getPromptAction().updateCustomDialog(this.contentNode, options)
        .then(() => {
          console.info('UpdateCustomDialog complete.')
        })
        .catch((error: BusinessError) => {
          let message = (error as BusinessError).message;
          let code = (error as BusinessError).code;
          console.error(`UpdateCustomDialog args error code is ${code}, message is ${message}`);
        })
    }
  }
}