No description or website provided.
HTML
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Permalink
Failed to load latest commit information.
image
README.md
config.xml
index.html
video.mp4

README.md

期待已久,官方总算把各种提示样式给封装了,再也不用苦逼的自己各种被虐着封装自定义样式了。这个分享我把 dialogBox 模块的 11 个样式分别实现个简单的效果,其中将 alert 方法做了两个样式,如果你觉得我写的样式够丑,请不要喷我,因为我是程序猿[呵呵了],如果你接受了就直接用到你的项目,否则自己再根据官方的文档和结合自己的产品需求,来定义更多高大上的样式。

接下来我拿几个我常用的方法给大家简单介绍下,其它的大家可以看看模块的视频效果以后,自己上手做做。

  1. alert()

这个方法算是系统的 alert 与 confirm 的结合,这之上还可以添加 icon。

  1. sendMessage()

顾名思义,此方法在 alert 的基础之上追加了一个对话框,会调用中可以取到输入的值。

  1. scene()

此方法是一个特定场景下的 UI 弹出层,它包含可设置场景图片、标题以及选项。

  1. evaluation()

与 alert 类似,只不过将按钮的排版做了修改。

  1. raffle()

该方法算是 scene 与 alert 的结合,效果可见此模块视频演示。

  1. receipt()

在很多场景中我们就会有,比如一些简单到复杂的表单数据展示,通常这样的布局比较麻烦而繁琐。这个方法就是由此而生呀,简单配置下,就能够达到目的。

  1. tips()

其实我觉得这个方法除了和名字说的提示功能以外,还有 N 多的使用场景,所以大家别被方法的名称给固定了使用的范围。

  1. actionMenu()

这个方法的 UI 与 shareAction 模块类似,差别就是这个方法并没有实际的功能,不过通常情况下系统的很多功能并不是我们的产品想要的,我们需要自定义 UI 和功能,所以这里这个方法就起了大作用。

以上所有方法,我也都只是简单的用了下,大家在使用此模块的时候仔细看看文档,毕竟是 UI 模块,又要做到自定义,所以字段什么的太多了,一不注意你就疏忽了什么。在使用模块时,任何一个按钮点击时都有返回对应的索引,然后我们就可以根据索引去做自己的逻辑。

源码:https://github.com/XM-Right/DialogBox-Example 演示视频:http://7xoo0e.com1.z0.glb.clouddn.com/apicloud/022d688d0e00d1b165fee5adc7d5d0ee.mp4