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

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

1. alert()

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

2. sendMessage()

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

3. scene()

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

4. evaluation()

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

5. raffle()

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

6. receipt()

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

7. tips()

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

8. actionMenu()

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

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

源码:https://github.com/XM-Right/DialogBox-Example

演示视频:

http://7xoo0e.com1.z0.glb.clouddn.com/apicloud/022d688d0e00d1b165fee5adc7d5d0ee.mp4

11种dialogBox样式打包开源,逐一详解的更多相关文章

  1. vs2010打包winform程序详解

    vs2010打包winform程序详解   最近一直在做winform程序,做完后程序打包很头疼,第三方打包工具,好用的花钱,不花钱的不好用,最后只能用vs自带的打包工具了! 打包过程vs2010(包 ...

  2. jQuery插件开发的两种方法及$.fn.extend的详解(转)

    jQuery插件开发的两种方法及$.fn.extend的详解 jQuery插件开发分为两种:1 类级别.2 对象级别,下面为大家详细介绍下   jQuery插件开发分为两种: 1 类级别 类级别你可以 ...

  3. java中四种访问修饰符区别及详解全过程

    客户端程序员:即在其应用中使用数据类型的类消费者,他的目标是收集各种用来实现快速应用开发的类. 类创建者:即创建新数据类型的程序员,目标是构建类. 访问控制存在的原因:a.让客户端程序员无法触及他们不 ...

  4. C++11中新特性之:initializer_list详解

    C++11提供的新类型,定义在<initializer_list>头文件中. template< class T > class initializer_list; 先说它的用 ...

  5. 【c3p0】 C3P0的三种配置方式以及基本配置项详解

    数据库连接池C3P0框架是个非常优异的开源jar,高性能的管理着数据源,这里只讨论程序本身负责数据源,不讨论容器管理. ---------------------------------------- ...

  6. PJSIP开源库详解

    PJSIP是一个包含了SIP.SDP.RTP.RTCP.STUN.ICE等协议实现的开源库.它把基于信令协议SIP的多媒体框架和NAT穿透功能整合成高层次.抽象的多媒体通信API,这套API能够很容易 ...

  7. jQuery 源码解析(二十七) 样式操作模块 坐标详解

    样式操作模块可用于管理DOM元素的样式.坐标和尺寸,本节讲解一下坐标这一块. 对于坐标来说,jQuery提供了一个offset方法用于获取第一个匹配元素的坐标或者设置所有匹配元素的坐标,还有offse ...

  8. jQuery插件开发的两种方法及$.fn.extend的详解

    jQuery插件开发分为两种: 1 类级别 类级别你可以理解为拓展jquery类,最明显的例子是$.ajax(...),相当于静态方法. 开发扩展其方法时使用$.extend方法,即jQuery.ex ...

  9. Android 定时器实现的几种方式和removeCallbacks失效问题详解

    实现定时器有很多种方式,在这里我简单的介绍几种方式 (1)使用Handler + Runnable的方式 Handler handler = new Handler(); Runnable runna ...

随机推荐

  1. ajax无刷新获取php后台数据

    $.ajax({ url:"result.php", //data:{"page":i}, dataType:"json", beforeS ...

  2. [转].net自定义configSections的5个示例

    本文转自:http://www.yongfa365.com/item/configuration-configSections-SingleTagSectionHandler-DictionarySe ...

  3. 按月将Windows日志导出至CSV文件

    # 这个月的第一天 #..........................................到这里之前是取当年第一天 #(Get-Date 0).AddYears((Get-Date). ...

  4. 解析数据存储MySQL

    为了适应不同项目对不同感兴趣属性的解析存储,数据存储结构采用纵向的属性列表方式,即一个url页面多个属性存储多条记录方式,并且按照text,html, data,num几大典型类型分别对应存储. 创建 ...

  5. MyEclipse的注册过程

    说在前面的话: 说到收费软件MyEclipse,大家可能对它又爱又恨,其实软件收钱也是为了有更好的发展,我们的建议是先试用,如果觉得不错,可以使用正版软件! 准备工作: 1.MyEclipse安装文件 ...

  6. HDU 1394 Minimum Inversion Number(线段树/树状数组求逆序数)

    Minimum Inversion Number Time Limit: 2000/1000 MS (Java/Others)    Memory Limit: 65536/32768 K (Java ...

  7. JavaScript系列:replace()函数(第二个参数为函数)

    语法 stringobject.replace(regexp/substr,replacement) 只讲解这个:参数replacement为函数时,这个参数函数的参数代表的意义,以及运行次数,及过程 ...

  8. The content of element type "configuration" must match "(properties?,settings?,typeAliases?,typeHandlers?,objectFactory?...

    <?xml version="1.0" encoding="UTF-8"?> <!DOCTYPE configuration PUBLIC & ...

  9. python 操作excel 使用笔记

    写入excel, 保存的过程中需要注意,保存格式xls后缀,如果用xlsx会报错 def set_style(name,height,bold=False): """&q ...

  10. TextView实现圆角效果

    自定义一个Xml样式: <?xml version="1.0" encoding="utf-8"?> <shape xmlns:android ...