11种dialogBox样式打包开源,逐一详解
期待已久,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样式打包开源,逐一详解的更多相关文章
- vs2010打包winform程序详解
vs2010打包winform程序详解 最近一直在做winform程序,做完后程序打包很头疼,第三方打包工具,好用的花钱,不花钱的不好用,最后只能用vs自带的打包工具了! 打包过程vs2010(包 ...
- jQuery插件开发的两种方法及$.fn.extend的详解(转)
jQuery插件开发的两种方法及$.fn.extend的详解 jQuery插件开发分为两种:1 类级别.2 对象级别,下面为大家详细介绍下 jQuery插件开发分为两种: 1 类级别 类级别你可以 ...
- java中四种访问修饰符区别及详解全过程
客户端程序员:即在其应用中使用数据类型的类消费者,他的目标是收集各种用来实现快速应用开发的类. 类创建者:即创建新数据类型的程序员,目标是构建类. 访问控制存在的原因:a.让客户端程序员无法触及他们不 ...
- C++11中新特性之:initializer_list详解
C++11提供的新类型,定义在<initializer_list>头文件中. template< class T > class initializer_list; 先说它的用 ...
- 【c3p0】 C3P0的三种配置方式以及基本配置项详解
数据库连接池C3P0框架是个非常优异的开源jar,高性能的管理着数据源,这里只讨论程序本身负责数据源,不讨论容器管理. ---------------------------------------- ...
- PJSIP开源库详解
PJSIP是一个包含了SIP.SDP.RTP.RTCP.STUN.ICE等协议实现的开源库.它把基于信令协议SIP的多媒体框架和NAT穿透功能整合成高层次.抽象的多媒体通信API,这套API能够很容易 ...
- jQuery 源码解析(二十七) 样式操作模块 坐标详解
样式操作模块可用于管理DOM元素的样式.坐标和尺寸,本节讲解一下坐标这一块. 对于坐标来说,jQuery提供了一个offset方法用于获取第一个匹配元素的坐标或者设置所有匹配元素的坐标,还有offse ...
- jQuery插件开发的两种方法及$.fn.extend的详解
jQuery插件开发分为两种: 1 类级别 类级别你可以理解为拓展jquery类,最明显的例子是$.ajax(...),相当于静态方法. 开发扩展其方法时使用$.extend方法,即jQuery.ex ...
- Android 定时器实现的几种方式和removeCallbacks失效问题详解
实现定时器有很多种方式,在这里我简单的介绍几种方式 (1)使用Handler + Runnable的方式 Handler handler = new Handler(); Runnable runna ...
随机推荐
- 使用javascript打开链接的多种方法
在页面中的链接除了常规的方式以外,如果使用javascript,还有很多种方式,下面是一些使用javascript,打开链接的几种方式: 1.使用window的open方法打开链接,这里可是在制定页面 ...
- Lucene搜索方法总结
转自:summerbell http://www.iteye.com/topic/569358 1.多字段搜索 使用 multifieldqueryparser 可以指定多个搜索字段. query q ...
- 如何用JavaScript在页面上显示一个时间钟表
<html><head><script type="text/javascript">function myTime(){var today=n ...
- Grunt教程——初涉Grunt
前端自动化,这样的一个名词听起来非常的有吸引力,向往力.当今时代,前端工程师需要维护的代码变得及为庞大和复杂,代码维护.打包.发布等流程也 变得极为繁琐,同时浪费的时间和精力也越来越多,当然人为的错误 ...
- 【转】个人对JQuery Proxy()函数的理解
原文地址:http://www.cnblogs.com/acles/archive/2012/11/20/2779282.html JQuery.proxy(function,context): 使用 ...
- 【ZZ】 移位贴图 Displacement Mapping
http://blog.csdn.net/huazai434/article/details/5650629 说明:该技术需要VS3.0的支持!!! 一,移位贴图类似于地形渲染.不过由于移位纹理可以做 ...
- jQuery 判断表单中多个 input text 中至少有一个不为空
html: 名称1:<input class="seasoning_name" type="text" name="seasoning_name ...
- ecshop运行超过30秒超时的限制解决办法
ecshop运行超过30秒超时的限制解决办法 ECSHOP模板/ecshop开发中心(www.68ecshop.com) / 2014-06-04 ecshop运行超过服务器默认的设置30秒的限制时会 ...
- window下mysql的1053错误
tmp文件数目过多 导致启动为1053错误 这个时候有两种方法 清空tmp目录 更改mysql的tmp目录 在my.ini中更改 [mysqld] tmpdir="d:/mysql_tmp& ...
- C++ char*,const char*,string的相互转换
1. string转const char* string s ="abc";constchar* c_s = s.c_str(); 2. const char*转string ...