背景

小红点在各个App内随处可见,并且随着需求的不断迭代,需要展示小红点的需求越来越多。

  • 不同需求之间,红点显示可能有冲突。
  • 不同页面之间,红点显示会有关联。
  • 同一个红点,可能显示成数字样式,红点样式,文案样式。

这个时候,如果没有对红点的展示逻辑做一个统一的抽象和管理的话,就会感觉很复杂,后续也不太好维护。

本文会基于MediatorLiveData,实现对红点的统一管理。

需求分析

这里举个例子,常见的红点场景,类似qq首页左上角红点的显示。

  1. 4个页面,由首页进入到隐私保护指引页面,都有相应的红点View显示,去引导用户进入到最里面的"隐私保护指引"页面。
  2. 当用户点击红点,进入到"隐私保护指引"页面后,隐私保护指引对应的红点就会消失,同时会触发上级页面的红点刷新。

思路分析

树形模型

一个App的页面本身就是分级的,对于页面的访问路径本质上就是个树型结构。 整体的实现思路是用树形模型去管理不同页面的红点。

  • 每个小红点就是一个树的节点,父节点的小红点是否显示,取决于它的子节点的并集结果。
  • 同一个页面中的不同红点。在树中是同一个层级,属于兄弟关系,互相独立。
  • 子节点的状态变化,会递归地去触发父节点的状态变化。

具体代码实现

那对应的代码应该如何实现呢,难道真的要手动自己实现一棵树?也不是不行,就是感觉有点小麻烦的样子。 下面进入正题。

MediatorLiveData

官方提供了MediatorLiveData。

  • 通过addSource方法,可以监听另一个LiveData的数据变化
  • 本身就是一个LiveData,可以被其他Observer观察

这两个特点,刚好满足我们的需求实现。比如MediatorLiveData A观察 MediatorLiveData B,MediatorLiveData B观察 MediatorLiveData C 和MediatorLiveData D。并且被观察的LiveData发生变化,作为观察的LiveData都能收到通知。

通过管理多个LiveData之间的关系,这样就可以间接实现了一棵树的模型。

public class MediatorLiveData<T> extends MutableLiveData<T> {
  private SafeIterableMap<LiveData<?>, Source<?>> mSources = new SafeIterableMap<>();

  
  public <S> void addSource(@NonNull LiveData<S> source, @NonNull Observer<? super S> onChanged) {
    //使用Source包一下
    Source<S> e = new Source<>(source, onChanged);
    Source<?> existing = mSources.putIfAbsent(source, e);
    if (hasActiveObservers()) {
      e.plug();
    }
  }

  private static class Source<V> implements Observer<V> {
    final LiveData<V> mLiveData;
    final Observer<? super V> mObserver;
    int mVersion = START_VERSION;

    Source(LiveData<V> liveData, final Observer<? super V> observer) {
      mLiveData = liveData;
      mObserver = observer;
    }

    void plug() {
      mLiveData.observeForever(this);
    }

    void unplug() {
      mLiveData.removeObserver(this);
    }

    @Override
    public void onChanged(@Nullable V v) {
      if (mVersion != mLiveData.getVersion()) {
        mVersion = mLiveData.getVersion();
        mObserver.onChanged(v);
      }
    }
  }
}

RedPointManager

  • 这里的实现,封装成一个单例RedPointManager,暴露相应的红点数据给外部。
  • LiveData数据驱动:RedPointManager内包含了多个LiveData,不同页面的红点View可以通过观察对应的LiveData,来驱动自身的视图变化。
  • 父节点使用MediatorLiveData,观察相应的子节点LiveData。 叶子节点定义成普通的LiveData就行了,因为不需要观察其他对象了。

/**
 * 基于MediatorLiveData,实现树形红点管理
 */
class RedPointManager : IRedPointManager {

  companion object {
    val TAG = "RedPointManager"

    @JvmStatic
    val instance: IRedPointManager by lazy(mode = LazyThreadSafetyMode.SYNCHRONIZED) {
      RedPointManager()
    }
  }

  override val liveDataA = MediatorLiveData<Boolean>()
  override val liveDataB1 = MediatorLiveData<Boolean>()
  override val liveDataB2 = MutableLiveData<Boolean>()
  override val liveDataC1 = MutableLiveData<Boolean>()
  override val liveDataC2 = MutableLiveData<Boolean>()

  init {
    Log.d(TAG, "RedPointManager init")
    /**
     * 构建树型关系。按路径层级,进行观察。一般外部只需要改动最低层的红点对应的LiveData,顶部的LiveData就会自动改变
     */
    liveDataA.addSource(liveDataB1, Observer {
      liveDataA.postValue(liveDataB1.isTrue() || liveDataB2.isTrue())
    })
    liveDataA.addSource(liveDataB2, Observer {
      liveDataA.postValue(liveDataB1.isTrue() || liveDataB2.isTrue())
    })

    liveDataB1.addSource(liveDataC1, Observer {
      liveDataB1.postValue(liveDataC1.isTrue() || liveDataC2.isTrue())
    })
    liveDataB1.addSource(liveDataC2, Observer {
      liveDataB1.postValue(liveDataC1.isTrue() || liveDataC2.isTrue())
    })
  }

  override fun testChangeDataC1(show: Boolean) {
    liveDataC1.postValue(show)
    Log.d(TAG, "testChangeDataC1: $show")
  }
}

/**
 * 定义接口
 * 提供只读的属性,提供修改liveData的方法
 */
interface IRedPointManager {
  val liveDataA: LiveData<Boolean>
  val liveDataB1: LiveData<Boolean>
  val liveDataB2: LiveData<Boolean>
  val liveDataC1: LiveData<Boolean>
  val liveDataC2: LiveData<Boolean>

  fun testChangeDataC1(show: Boolean)
}

验证刷新逻辑

一般情况下,只需要改动叶子节点的红点对应的LiveData,父节点的LiveData就会自动改变。 基于上述代码,调用testChangeDataC1方法后,监听LiveData并输出日志。

  private fun testRedPointManager() {
    RedPointManager.instance.liveDataA.observe(this, Observer {
      Log.d(TAG, "liveDataA: $it")
    })
    RedPointManager.instance.liveDataB1.observe(this, Observer {
      Log.d(TAG, "liveDataB1: $it")
    })
    RedPointManager.instance.liveDataB2.observe(this, Observer {
      Log.d(TAG, "liveDataB2: $it")
    })
    RedPointManager.instance.liveDataC1.observe(this, Observer {
      Log.d(TAG, "liveDataC1: $it")
    })
    RedPointManager.instance.liveDataC2.observe(this, Observer {
      Log.d(TAG, "liveDataC2: $it")
    })
    RedPointManager.instance.testChangeDataC1(true)
  }
  
 //从输出日志可以发现,底层的liveDataC1发生改变,触发顶层的liveDataB1发生改变。liveDataB1的变化,也触发了liveDataA发生改变。
RedPointManager init
testChangeDataC1: true
liveDataC1: true
lveDataB1: true
liveDataA: true

总结

到这里就结束了,App端内实现红点的统一管理,如果有类似的场景,可以用这种思路去实现。 上面的例子比较简单,更复杂的场景,应该也是可以基于上面的方案进行改造一下的。

以上就是Android 基于MediatorLiveData实现红点的统一管理的详细内容,更多关于MediatorLiveData实现红点的统一管理的资料请关注Devmax其它相关文章!

Android 基于MediatorLiveData实现红点的统一管理的更多相关文章

  1. html5 canvas合成海报所遇问题及解决方案总结

    这篇文章主要介绍了html5 canvas合成海报所遇问题及解决方案总结,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧

  2. Html5 video标签视频的最佳实践

    这篇文章主要介绍了Html5 video标签视频的最佳实践,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧

  3. HTML5在微信内置浏览器下右上角菜单的调整字体导致页面显示错乱的问题

    HTML5在微信内置浏览器下,在右上角菜单的调整字体导致页面显示错乱的问题,本文给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友参考下吧

  4. ios – containerURLForSecurityApplicationGroupIdentifier:在iPhone和Watch模拟器上给出不同的结果

    我使用默认的XCode模板创建了一个WatchKit应用程序.我向iOSTarget,WatchkitAppTarget和WatchkitAppExtensionTarget添加了应用程序组权利.(这是应用程序组名称:group.com.lombax.fiveminutes)然后,我尝试使用iOSApp和WatchKitExtension访问共享文件夹URL:延期:iOS应用:但是,测试NSURL

  5. Ionic – Splash Screen适用于iOS,但不适用于Android

    我有一个离子应用程序,其中使用CLI命令离子资源生成的启动画面和图标iOS版本与正在渲染的启动画面完美配合,但在Android版本中,只有在加载应用程序时才会显示白屏.我检查了config.xml文件,所有路径看起来都是正确的,生成的图像出现在相应的文件夹中.(我使用了splash.psd模板来生成它们.我错过了什么?这是config.xml文件供参考,我觉得我在这里做错了–解决方法在config.xml中添加以下键:它对我有用!

  6. ios – 无法启动iPhone模拟器

    /Library/Developer/CoreSimulator/Devices/530A44CB-5978-4926-9E91-E9DBD5BFB105/data/Containers/Bundle/Application/07612A5C-659D-4C04-ACD3-D211D2830E17/ProductName.app/ProductName然后,如果您在Xcode构建设置中选择标准体系结构并再次构建和运行,则会产生以下结果:dyld:lazysymbolbindingFailed:Symbol

  7. Xamarin iOS图像在Grid内部重叠

    heyo,所以在Xamarin我有一个使用并在其中包含一对,所有这些都包含在内.这在Xamarin.Android中看起来完全没问题,但是在Xamarin.iOS中,图像与标签重叠.我不确定它的区别是什么–为什么它在Xamarin.Android中看起来不错但在iOS中它的全部都不稳定?

  8. 在iOS上向后播放HTML5视频

    我试图在iPad上反向播放HTML5视频.HTML5元素包括一个名为playbackRate的属性,它允许以更快或更慢的速率或相反的方式播放视频.根据Apple’sdocumentation,iOS不支持此属性.通过每秒多次设置currentTime属性,可以反复播放,而无需使用playbackRate.这种方法适用于桌面Safari,但似乎在iOS设备上的搜索限制为每秒1次更新–在我的情况下太慢了.有没有办法在iOS设备上向后播放HTML5视频?解决方法iOS6Safari现在支持playbackRat

  9. 使用 Swift 语言编写 Android 应用入门

    Swift标准库可以编译安卓armv7的内核,这使得可以在安卓移动设备上执行Swift语句代码。做梦,虽然Swift编译器可以胜任在安卓设备上编译Swift代码并运行。这需要的不仅仅是用Swift标准库编写一个APP,更多的是你需要一些框架来搭建你的应用用户界面,以上这些Swift标准库不能提供。简单来说,构建在安卓设备上使用的Swiftstdlib需要libiconv和libicu。通过命令行执行以下命令:gitclonegit@github.com:SwiftAndroid/libiconv-libi

  10. Android – 调用GONE然后VISIBLE使视图显示在错误的位置

    我有两个视图,A和B,视图A在视图B上方.当我以编程方式将视图A设置为GONE时,它将消失,并且它正下方的视图将转到视图A的位置.但是,当我再次将相同的视图设置为VISIBLE时,它会在视图B上显示.我不希望这样.我希望视图B回到原来的位置,这是我认为会发生的事情.我怎样才能做到这一点?编辑–代码}这里是XML:解决方法您可以尝试将两个视图放在RelativeLayout中并相对于彼此设置它们的位置.

随机推荐

  1. Flutter 网络请求框架封装详解

    这篇文章主要介绍了Flutter 网络请求框架封装详解,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧

  2. Android单选按钮RadioButton的使用详解

    今天小编就为大家分享一篇关于Android单选按钮RadioButton的使用详解,小编觉得内容挺不错的,现在分享给大家,具有很好的参考价值,需要的朋友一起跟随小编来看看吧

  3. 解决android studio 打包发现generate signed apk 消失不见问题

    这篇文章主要介绍了解决android studio 打包发现generate signed apk 消失不见问题,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧

  4. Android 实现自定义圆形listview功能的实例代码

    这篇文章主要介绍了Android 实现自定义圆形listview功能的实例代码,本文通过实例代码给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友可以参考下

  5. 详解Android studio 动态fragment的用法

    这篇文章主要介绍了Android studio 动态fragment的用法,本文给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友可以参考下

  6. Android用RecyclerView实现图标拖拽排序以及增删管理

    这篇文章主要介绍了Android用RecyclerView实现图标拖拽排序以及增删管理的方法,帮助大家更好的理解和学习使用Android,感兴趣的朋友可以了解下

  7. Android notifyDataSetChanged() 动态更新ListView案例详解

    这篇文章主要介绍了Android notifyDataSetChanged() 动态更新ListView案例详解,本篇文章通过简要的案例,讲解了该项技术的了解与使用,以下就是详细内容,需要的朋友可以参考下

  8. Android自定义View实现弹幕效果

    这篇文章主要为大家详细介绍了Android自定义View实现弹幕效果,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下

  9. Android自定义View实现跟随手指移动

    这篇文章主要为大家详细介绍了Android自定义View实现跟随手指移动,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下

  10. Android实现多点触摸操作

    这篇文章主要介绍了Android实现多点触摸操作,实现图片的放大、缩小和旋转等处理,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下

返回
顶部