不写代码就狗带
不写代码就狗带
  • 发布:2020-07-29 14:51
  • 更新:2020-11-17 13:32
  • 阅读:3146

uniapp如何实现类似这种新手引导的功能,有没有类似的插件插件推荐一下,app端

分类:uni-app
App

如图这样的引导功能该如何实现呢?

2020-07-29 14:51 负责人:无 分享
已邀请:
1***@qq.com

1***@qq.com

同求

z***@163.com

z***@163.com

我们前不久使用UNI-APP进行H5开发时也遇到这样的需求, 然后再逛UNI-APP社区的时候发现了您的问题; 我这边大致将我这边的一个实现方式提取到了这个仓库里面 uni-step-guide 这是使用UNI-APP在H5中的实现;

整体实现方式其实很简单, 具体可以查看这个文件 step.js

其中我们依赖了一个CSS的mix-blend-mode的属性, 这也是实现的透过蒙层的关键之处, 你可以查看这里mix-blend-mode

如果你是在APP中使用, 这个属性可能在一些低版本安卓设备上不支持, 那其实也不影响你整个引导的流程 (可以使用透明的蒙层+ 阴影 + 定位来实现, 就不会存在需要透过背景的情况了)

z***@163.com

z***@163.com

再补充两张DEMO截图把

DEMO1

DEMO2

  • 不写代码就狗带 (作者)

    ok,我试试

    2020-11-03 08:22

  • chs

    请问有支持小程序和app的版本么

    2020-11-17 13:32

chs

chs

请问有支持小程序和app的插件么

该问题目前已经被锁定, 无法添加新回复