一个优雅解决多个弹窗顺序显示方案

不是因为看到希望才坚持,而是因为坚持了才会有希望!

场景

  在做直播软件的时候,需要在用户打开App后,先后弹出签到,活动,提示等一系列弹窗。每个弹窗都要在前一个弹窗消失后弹出。于是就面临一个弹窗顺序问题,那时候对设计模式很陌生,不知道怎么更好的解决弹窗顺序问题,都在下前一个弹窗取消或关闭时去加载后面一个弹窗。这样做虽然也能解决问题,但是实现并不优雅,如果在弹窗中间再添加一个其他类型的弹窗改动代价就变得很大,特别是当你是后来接手代码的新人,稍有不慎,就要背锅。怎么能简单而又优雅的解决这个问题呢?

思路

  开发者必读的23种设计模式,对于日常开发问题的解决提供了很好的思路,可以说几乎所有的优秀架构都离不开设计模式,这也是面试必问问题之一。23种设计模式中有一个责任链模式,为弹窗问题提供了解决方案,这也是我从okhttp源码中学习到的,读过okhttp的同学都知道,okhttp网络请求中的五大拦截器基于链式请求,使用起来简单高效。本篇文章同样也是基于责任链的思路来解决弹窗顺序问题。

代码

  1. 首页我们定义一个接口DialogIntercept,同时提供两个方法 intercept和show。
kotlin 复制代码
interface  DialogIntercept {
    fun intercept(dialogIntercept: DialogChain)
    fun show():Boolean
}

  所有的弹窗都需要实现DialogIntercept中的这两个方法。

  1. 自定义弹窗实现DailogIntercept接口。

● 弹窗

kotlin 复制代码
class FirstDialog(val context: Context) :DialogIntercept{

    override fun intercept(dialogIntercept: DialogChain) {
        
    }

    override fun show():Boolean{
        return true
    }
}

  这里默认show()方法默认返回true,可根据业务逻辑决定弹窗是否显示。

  1. 提供一个弹窗管理类DialogChain,通过建造者模式创建管理类。根据弹窗添加的顺序弹出。
kotlin 复制代码
class DialogChain(private val builder: Builder) {
     private var index = 0
     fun proceed(){
      ............
      ...省略部分代码.....
      .............
     }
    class Builder(){
        var chainList:MutableList<DialogIntercept> = mutableListOf()
        fun addIntercept(dialogIntercept: DialogIntercept):Builder{
           .....省略部分代码.....
            return this
        }
        fun build():DialogChain{
            return DialogChain(this)
        }
    }

}

效果

  为了测试效果,分别定义三个弹窗,FirstDialog,SecondDialog,ThirdDialog。按照显示顺序依次添加到DialogChain弹窗管理类中。

  1. 定义弹窗。

  由于三个弹窗代码基本相同,下面只提供FirstDialog代码。

kotlin 复制代码
class FirstDialog(val context: Context) :DialogIntercept{

   
    override fun intercept(dialogIntercept: DialogChain) {
         show(dialogIntercept)
    }

    override fun show():Boolean{
        return true
    }

    private fun show(dialogIntercept: DialogChain){
        AlertDialog.Builder(context).setTitle("FirstDialog")
            .setPositiveButton("确定"
        ) { _, _ ->
            dialogIntercept.proceed()
        }.setNegativeButton("取消"
        ) { _, _ ->
            dialogIntercept.proceed()
        }.create().show()
    }
}

2 . 分别将三个弹窗按照显示顺序添加到管理器中。

kotlin 复制代码
 DialogChain.Builder()
   .addIntercept(FirstDialog(this))
   .addIntercept(SecondDialog(this))
   .addIntercept(ThirdDialog(this))
    .build().proceed()
  1. 实现效果如下:

总结

  再优秀的架构,都离不开设计模式和设计原则。很多时候我们觉得架构师遥不可及,其实更多的时候是我们缺少一个想要进步的心。新的一年,新的起点,新的开始。

相关推荐
zzzll11112 小时前
Langfuse 全面解析:开源 LLM 应用监控与评估平台
microsoft·开源
Code_流苏4 小时前
Pot:免费开源的跨平台划词翻译和 OCR 工具,选中文字就能翻译
开源·ocr·pot·自动翻译·翻译工具·划词翻译
冬奇Lab5 小时前
开源项目第185期:Orca — YC 支持的 AI Agent 开发环境,并行运行多个 Coding Agent、手机远程监控、Design Mode 直接截图喂给 AI
人工智能·开源·资讯
dong_junshuai7 小时前
每天一个开源项目#68 Needle:14MB 工具调用小模型装进口袋设备
程序员·开源·github
东方小月8 小时前
从零开发一个 Coding Agent(十):实现 CLI 参数解析与静态命令
前端·人工智能·开源
George_Ye8 小时前
同一本书,一人一份:我如何设计 AI 个性化扫书报告
设计模式
怪奇云呼军8 小时前
从声音特征到 CRM 回流:闪电智能 Voice Agent 沟通策略自适应系统 v1 实战
android·人工智能·python·音视频·语音识别
Bifrost8 小时前
使用飞书机器人让 Codex 24 小时在线:随时随地给你的 AI 工程师派活
chatgpt·开源·openai
Joy T9 小时前
Agent 开源项目全景解析(下):LlamaIndex、Dify、FastGPT 与真实工程选型
langchain·开源·框架·agent·springai·langgraph·mcp
哦哦~92110 小时前
北理工|Composites Part‑A 综述:纤维‑增强复合材料传统成型与增材制造全解析
android·制造·复合材料·增材制造