feat(basic): 实现自定义 AlertDialog 并优化上下文管理- 新增自定义 AlertDialog 功能,提供更灵活的弹窗样式和交互
- 实现全局 UI 上下文管理,支持跨组件弹窗显示 - 优化 SafeView 组件,自动管理 UI 上下文生命周期 - 调整默认弹窗配置,提高用户体验
这个提交包含在:
父节点
ecdec4a9ca
当前提交
ab97abedf9
@ -7,6 +7,7 @@ import { WindowHelper } from './utils/WindowHelper';
|
|||||||
|
|
||||||
declare namespace globalThis {
|
declare namespace globalThis {
|
||||||
let _brushEngineContext: common.UIAbilityContext;
|
let _brushEngineContext: common.UIAbilityContext;
|
||||||
|
let _uiUIContext: UIContext[];
|
||||||
};
|
};
|
||||||
|
|
||||||
export class GlobalContext {
|
export class GlobalContext {
|
||||||
@ -18,5 +19,17 @@ export class GlobalContext {
|
|||||||
globalThis._brushEngineContext = context;
|
globalThis._brushEngineContext = context;
|
||||||
WindowHelper.windowClass = context.windowStage.getMainWindowSync()
|
WindowHelper.windowClass = context.windowStage.getMainWindowSync()
|
||||||
}
|
}
|
||||||
|
static pushUIContext(context: UIContext): void {
|
||||||
|
if (!globalThis._uiUIContext) {
|
||||||
|
globalThis._uiUIContext = []
|
||||||
|
}
|
||||||
|
globalThis._uiUIContext.push(context);
|
||||||
|
}
|
||||||
|
static popUIContext(): void {
|
||||||
|
globalThis._uiUIContext.splice(globalThis._uiUIContext.length-1,1)
|
||||||
|
}
|
||||||
|
static getUiContext(): UIContext {
|
||||||
|
return globalThis._uiUIContext[globalThis._uiUIContext.length-1];
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
@ -4,7 +4,18 @@ import { buffer, HashMap, util } from '@kit.ArkTS';
|
|||||||
import { DeviceInfo } from '../bean/DeviceInfo';
|
import { DeviceInfo } from '../bean/DeviceInfo';
|
||||||
import { common } from '@kit.AbilityKit';
|
import { common } from '@kit.AbilityKit';
|
||||||
import { md5_hex } from '../util/md5';
|
import { md5_hex } from '../util/md5';
|
||||||
import { LogHelper } from '../../../../Index';
|
import { GlobalContext, LogHelper } from '../../../../Index';
|
||||||
|
import { ComponentContent } from '@kit.ArkUI';
|
||||||
|
|
||||||
|
class AlertBean {
|
||||||
|
options: AlertOptions
|
||||||
|
dialogTag: string
|
||||||
|
|
||||||
|
constructor(options: AlertOptions, dialogTag: string) {
|
||||||
|
this.options = options
|
||||||
|
this.dialogTag = dialogTag
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
export interface Btn {
|
export interface Btn {
|
||||||
text?: string | Resource;
|
text?: string | Resource;
|
||||||
@ -128,6 +139,30 @@ function customDialogBuilder<T>(option: ListOptions<T>, dialogTag: string) {
|
|||||||
}.justifyContent(FlexAlign.Start)
|
}.justifyContent(FlexAlign.Start)
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@Builder
|
||||||
|
function alertDialogBuilder(options: AlertBean) {
|
||||||
|
|
||||||
|
Column() {
|
||||||
|
Text('---------')
|
||||||
|
.fontSize(16)
|
||||||
|
.fontColor('#00BE87')
|
||||||
|
.textAlign(TextAlign.Center)
|
||||||
|
.width('100%')
|
||||||
|
.height(60)
|
||||||
|
.backgroundColor('#F0FFFA')
|
||||||
|
.borderRadius({
|
||||||
|
topLeft: 10,
|
||||||
|
topRight: 10
|
||||||
|
})
|
||||||
|
.onClick(() => {
|
||||||
|
if (ToolsHelper.mapAlertDialog.get(options.dialogTag)) {
|
||||||
|
ToolsHelper.closeAlertDialog(ToolsHelper.mapAlertDialog.get(options.dialogTag))
|
||||||
|
ToolsHelper.mapAlertDialog.remove(options.dialogTag)
|
||||||
|
}
|
||||||
|
})
|
||||||
|
}.justifyContent(FlexAlign.Start)
|
||||||
|
}
|
||||||
|
|
||||||
interface ThrottleInterface {
|
interface ThrottleInterface {
|
||||||
startTime: number; //调用的时间
|
startTime: number; //调用的时间
|
||||||
timeoutNumber: number; //setTimeout的句柄
|
timeoutNumber: number; //setTimeout的句柄
|
||||||
@ -187,11 +222,26 @@ export class ToolsHelper {
|
|||||||
return true
|
return true
|
||||||
}
|
}
|
||||||
|
|
||||||
/**kio9
|
static closeAlertDialog(content: ComponentContent<Object>) {
|
||||||
|
try {
|
||||||
|
GlobalContext.getUiContext().getPromptAction().closeCustomDialog(content)
|
||||||
|
} catch (err) {
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
* 弹出Alert弹窗
|
* 弹出Alert弹窗
|
||||||
* @param options
|
* @param options
|
||||||
*/
|
*/
|
||||||
static showAlertDialog(options: AlertOptions) {
|
static showAlertDialog(options: AlertOptions) {
|
||||||
|
const dialogTag = ToolsHelper.getUuid()
|
||||||
|
const ui = GlobalContext.getUiContext()
|
||||||
|
const c = new ComponentContent(ui, wrapBuilder(alertDialogBuilder), new AlertBean(options, dialogTag))
|
||||||
|
ui.getPromptAction().openCustomDialog(c,{
|
||||||
|
autoCancel: false
|
||||||
|
}).then(() => {
|
||||||
|
ToolsHelper.mapAlertDialog.set(dialogTag, c)
|
||||||
|
}).catch(() => {
|
||||||
try {
|
try {
|
||||||
promptAction.showDialog({
|
promptAction.showDialog({
|
||||||
alignment: DialogAlignment.Center,
|
alignment: DialogAlignment.Center,
|
||||||
@ -206,12 +256,13 @@ export class ToolsHelper {
|
|||||||
options.action?.onClick && options.action?.onClick()
|
options.action?.onClick && options.action?.onClick()
|
||||||
})
|
})
|
||||||
.catch((err: Error) => {
|
.catch((err: Error) => {
|
||||||
// ToolsHelper.showMessage(err.message)
|
ToolsHelper.showMessage(err.message)
|
||||||
})
|
})
|
||||||
} catch (error) {
|
} catch (error) {
|
||||||
let message = (error as BusinessError).message
|
let message = (error as BusinessError).message
|
||||||
// ToolsHelper.showMessage(message)
|
ToolsHelper.showMessage(message)
|
||||||
}
|
}
|
||||||
|
})
|
||||||
}
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
@ -252,6 +303,7 @@ export class ToolsHelper {
|
|||||||
}
|
}
|
||||||
|
|
||||||
public static mapDialog = new HashMap<string, number>()
|
public static mapDialog = new HashMap<string, number>()
|
||||||
|
public static mapAlertDialog = new HashMap<string, ComponentContent<Object>>()
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* 弹出List弹窗
|
* 弹出List弹窗
|
||||||
|
|||||||
@ -1,5 +1,6 @@
|
|||||||
import { WindowHelper } from '../utils/WindowHelper';
|
import { WindowHelper } from '../utils/WindowHelper';
|
||||||
import { inputMethod } from '@kit.IMEKit';
|
import { inputMethod } from '@kit.IMEKit';
|
||||||
|
import { GlobalContext } from '../ContextConfig';
|
||||||
|
|
||||||
export interface TitleBarBtn {
|
export interface TitleBarBtn {
|
||||||
text?: string | Resource;
|
text?: string | Resource;
|
||||||
@ -47,6 +48,13 @@ export struct SafeView {
|
|||||||
// 设置导航栏底下标题
|
// 设置导航栏底下标题
|
||||||
@Prop bottomTitleText: ResourceStr
|
@Prop bottomTitleText: ResourceStr
|
||||||
|
|
||||||
|
aboutToAppear(): void {
|
||||||
|
GlobalContext.pushUIContext(this.getUIContext())
|
||||||
|
}
|
||||||
|
aboutToDisappear(): void {
|
||||||
|
GlobalContext.popUIContext()
|
||||||
|
}
|
||||||
|
|
||||||
@Builder
|
@Builder
|
||||||
doNothingBuilder() {
|
doNothingBuilder() {
|
||||||
}
|
}
|
||||||
|
|||||||
正在加载...
在新工单中引用
屏蔽一个用户