apicloud apicloud

注册
查看: 46324|回复: 370

[案例源码] [APICloud AUI 前端框架]--AUI新版v2.1,发布!

 

Rank: 9Rank: 9Rank: 9

主题:
53
帖子:
334
云币:
552

APICloud粉丝APICloud毕业勋章一周年

[案例源码] [APICloud AUI 前端框架]--AUI新版v2.1,发布!

 
46324 370 | 发表于 2015-9-10 23:46:13 |阅读模式 | |
—————————————————————————————————————————————————

AUI
全新AUI,颠覆以往

—————————————————————————————————————————————————

=========================华丽的分割线======================

新版AUI发布,17来看

2017年1月17日 19:00-20:00,不见不散

全方位讲解AUI
----------------------------
-- AUI深度讲解使用 --
-- 2、AUI扩展使用 --
-- APICloud APP前端优化 --
-- 案例演示 --
----------------------------

直播QQ群:544736905

=========================华丽的分割线======================

文档演示及源码下载地址:http://www.auicss.com


     交流群: 591525298(③群) 519956746(②群已满)344869952(①群已满)

=========================华丽的分割线======================




=========================华丽的分割线======================

———————2017-01-09 v 2.1 更新说明——————
更新说明:

【新增】
1、actionsheet 底部弹出框js插件
2、sharebox 底部弹出分享盒子js插件
3、collapse 折叠面板js插件
4、lazyload 图片懒加载js插件
5、popup 新的弹出菜单组件

6、aui-flex.css 弹性布局
7、timeline 时间轴布局
8、模板演示3个案例
9、基于底部工具栏的扩展样式
10、顶部导航栏加入搜索条效果

【优化】
1、searchbar 搜索条优化,搜索流程更完整
2、1px最终的优化处理,兼容低端机型
3、其他小细节优化

v 2.1 下载:

———————2016-07-20 v 2.0 更新说明——————

AUI 2.0是一套全新的AUI框架,在1.X基础上进行了重新架构。结合实际项目出发,站在开发者和项目的角度,重新定义AUI框架。在2.0中使用了大量弹性响应式布局,采用容器+布局结构+控件的嵌套形式,方便开发者快速布局样式。我们充分吸取了AUI使用者的反馈意见和借鉴了市场上其他优秀UI框架,完成了2.0版本的开发。2.0遵循Google Material 设计规范,使用MIT开源协议。
在2.0中,全局使用rem控制尺寸,完美适应不同分辨率移动设备;新加入的主题样式表方便开发者自定义基础颜色样式,完成APP主题的定制。完美兼容IOS 5.1+ 到Android 4.2+。

2.0功能亮点
1、遵循Google Material设计规范,使用MIT开源协议
2、更加严谨和简洁的代码规范;
3、rem的使用,完美适应不同分辨率的移动设备;
4、自定义主题皮肤样式,快速定制适合你的主题方案、搭建夜间主题模式及控制主题切换时间等;
5、简单的列表布局确保罗万象,组合式运用、模块化组装、响应式布局,快速完成APP布局样式;
6、全新架构方式,采用容器+布局+组件的方式进行拼装,方便开发者快速上手;
7、1px在更加严谨的处理方式;
8、全新的iconfont图标库

9、完美兼容IOS 5.1+ 、 Android4.2+

2.0下载

———————2016-04-21 v.1.2.1 更新说明——————

华丽组件,闪亮登场


版本号 v 1.2.1
在当前版本中我们做了进一步的优化和修复,让操作更流畅
一、轮播组件优化更新
新增当前页返回及获取总页数接口,方便用户扩展
二、基于轮播组件新增引导页
基于轮播组件我们做了简单的引导页效果,用户可以进一步扩展
三、优化列表右滑菜单
当前版本进一步提高了滑动体验
四、全屏滑动组件优化重构
全屏滑动组件重新架构,提高流畅度,js文件为aui-slider-full.js,原js已弃用,具体使用方法参考官方文档
五、日历组件重新架构
对日历组件重新做了架构,全屏滑动的日历效果暂未更新,后面会进一步的扩展,带来不便请谅解,具体使用方法参考官方文档





版本号 V 1.2.0

一、将aui.css字体图标样式分离
aui.css图标样式分离为aui-iconfont.css,该样式表在aui.css中已被默认加载,不需要二次引入。方便用户后期对字体图标的扩展管理

二、新增两套下拉刷新组件
推出了两套不同样式的下拉刷新组件,用户可自由扩展和二次开放,更方便前端人员的设计。

三、轮播组件
从引导页到幻灯片,AUI轮播组件轻松搞定,自定义分页样式,控制播放时间,循环,自动播放等

四、列表项滑动菜单
期待已久的列表项滑动显示菜单也终于发布了,用户可根据需求自定义按钮及样式,支持aui所有的布局列表嵌套

五、手风琴折叠面板
折叠面板控件也来了,这个就不多介绍了,可以嵌套任何组件

六、新增一套仿QQ游戏中心首页模板


七、AUI Flex优化,兼容安卓4.2


八、索引列表优化


九、喜欢AUI,就赶快分享吧


源码下载: http://www.auicss.com/?m=Home&c=Document#shiyong



———————2016-03-16 v.1.1.9 更新说明——————


新品发布:AUI Flex框架发布


AUI Flex(aui-flex.css)采用12个栅格进行布局,与aui-col-xs-*相比更灵活性,可以快速布局出自己所需要的框架结构。结合aui.css,能彻底解决布局+样式的问题。

在AUI Flex中,使用了aui-flex-col(横向)和aui-flex-row(纵向)两种容器,只需要把栅格放入容器中即可。AUI Flex所有类支持嵌套布局,可任意进行排列。

使用AUI Flex可以方便解决垂直居中,多栏等高,等宽布局,任意对齐等。


下面为一个使用AUI Flex仿淘宝的布局案例:




-----其他更新说明------

一.aui.css新增边框样式
二、新增索引列表
script/aui-indexed-list.js  css/aui-indexed-list.css
三、aui-calendar.css优化
修复一处touch造成的bug


源码下载:

=========================华丽的分割线======================

———————2016-03-08 v.1.1.8+ 更新说明——————
当前版本 v 1.1.8+
1.新增日历组件
2.新增全屏上下滚动组件(需关闭窗口弹动
3.新增全屏上下滚动日历组件(日历组件和滚动组件结合,需关闭窗口弹动)
4.新增aui-tap.js监听tap事件,可代替监听click事件并取消300ms点击延迟
5.优化搜索框案例,绑定键盘搜索键
aui.css无更新
源码下载 :

———————2016-02-22 v.1.1.8 更新说明——————
当前版本:V 1.1.8
1.新增两套案例模板
2.修复带有右侧尖头的列表项对div标签的不兼容
3.TAB增加多款主题色调
4.优化完善搜索条
5.修复css文件一处写法错误

———————2016-01-11 v.1.1.7 更新说明——————
当前版本 v 1.1.7
新增
1、新增toast样式,toast loading样式(.aui-toast .aui-loading)
2、新增dialog样式(aui-dialog)
3、新增表单/列表提示类(如表单项未填写警告提示  .aui-warning  .aui-success)

源码下载:

———————2016-01-06 v.1.1.6 更新说明——————
当前版本: v1.1.6
新增:
1、信息提示条(.aui-tips)
2、搜索条(.aui-searchbar)
3、列表页下划线缩进(.aui-inf)
优化:
1、瀑布流错位问题
2、列表

源码下载:


———————2015-11-22 v.1.1.5 更新说明——————

  • 当前版本 v 1.1.5
  • 新增滑块 (带有提示框的滑块需结合aui-range.js使用)
  • 增加aui-range.js
  • aui-form增加支持滑块
  • 完整包下载:

———————2015-11-21 v.1.1.4 更新说明——————

  • 当前版本 v 1.1.4
  • 新增时间轴 aui-timeline
  • 新增进度条 aui-progress
  • 优化弹出层
  • 完整包下载:

———————2015-11-09 v.1.1.3 更新说明——————

  • 当前版本  v 1.1.3
  • 修复aui-alert (兼容安卓5.0+)
  • 优化结构代码
  • 新增div选择样式aui-radio  aui-checkbox   <div class="aui-radio aui-checked"></div> 选中状态为aui-checked  禁止选择样式为aui-disabled,主题选择aui-radio-*,可结合js完成选择

下载:

———————2015-10-22 v.1.1.2 更新说明——————

  • v 1.1.2版本是经过了众多AUI小伙伴的测试,感谢你们的支持
  • 优化弹出层
  • 全方位处理1px
  • 优化列表
  • 各种细节性优化处理



———————2015-10-21 v.1.1.1 更新说明——————

  • 新增自定义弹出层,需结合aui_alert_frm.html文件及aui_alert.js
  • 优化radio  checkbox  增加aui-radio-name   aui-checkbox-name(主要用于一行显示多个)
  • 新增线框按钮  .aui-btn-outlined
  • 优化列表
  • 优化底部切换


———————2015-10-17 v.1.1.0 更新说明——————

本次更新主要处理1px,让线条更接近原生

  • 优化1px的处理,.aui-card 边框进行1px处理,并增加.aui-noborder 类
  • 优化瀑布流1px边框处理
  • 优化九宫格1px处理
  • 优化十六宫格1px处理
  • 优化部分机型导航栏沉浸式处理


=========================华丽的分割线======================

————2015-10-08  v1.0.0————————
1.新增瀑布流效果(需结合api.js和aui-waterfall.js使用)

aui-waterfall.js为瀑布流样式插件,1kb

配置方法采用了api.js的配置形式,el为waterfall容器,col:列数,padding:容器内边距,space:列与列的间距
$aui.waterfall(el,{
    col:2,//列数
    padding:10,//容器内边距
    space:10//列间距
});


2.优化导航栏
3.优化底部工具栏

——————2015-09-25——————————
1、修复没有按钮情况下header的沉浸处理
2、新增表单演示效果(含有密码的显示隐藏,获取验证码效果)
3、优化list类的处理

——————2015-09-12————————
1、增加一个win窗口适用的css样式文件

——————2015-09-11————————
1、新增带有计数的列表(购物车类)--一个疯狂自由组合的测试
2、优化1px部分机型不显示问题


——————2015-09-10————————
1、1px优化处理方案(处理已知机型列表分割线 1px变粗问题)
2、修复圆角
—————更新日志——————
1、按钮优化调整
2、表单重写(这次的表单更适合大家做项目了)
3、switch开关优化
4、checkbox、radio的加入
5、列表容器优化调整
6、导航栏优化调整
7、底部菜单重写
8、做了一个简单的个性loading效果
9、新增tab菜单(两种样式)
10、图标全部重写了,200多个字体图标
11、聊天界面优化调整


=========================华丽的分割线=========================


源码下载:
v 1.1.1







本帖子中包含更多资源    您需要 登录 才可以下载或查看,没有帐号?立即注册

6

查看全部评分

Rank: 3Rank: 3

主题:
52
帖子:
131
云币:
272
发表于 2015-11-25 10:31:34 |
本帖最后由 流浪男 于 2016-3-16 18:40 编辑

突然发现这个弹出层下方一段距离会有一段偏灰色的方块,这个什么东西?

点评

:好像一直有这个! 
发表于 2016-1-15 15:05

Rank: 2

主题:
14
帖子:
96
云币:
501
发表于 2015-9-11 06:22:05 |
得知此消息,很是激动,别提有多激动了,又有新的内容了,早上起来就先试试原先的app,发现有的图标名称变了,显示不出来了 还不知道CSS的名称变了没有?希望能够兼容此前发布的版本 不然白写了 像之前的图标card就很好 现在又vipcard应该原先的也共存啊 不然代码不兼容 不知道改哪里 你这变了 我也要跟着变了,55555555,edit以前一支笔一条线也很好 应该与现在的一个note+一支笔一起存在。优化更新之后建议原先的不能动 动了就我们使用的就白写了。我想第一版的基础上 只能新增  不能更新原先的 毕竟这么多人用呢。另外聊天界面 输入框还没添加 文档怎么调用希望能够写清楚,有些刚入门的开发者可能还理解不了,有时直接QQ联系版主,其实版主很忙,希望也能够回复一下,做好沟通,因为遇到了一些疑问,可能很简单的。好了,要出去扩展训练了,先搁笔。谢谢版主的辛勤劳动,致敬,确实方便了很多,代码简洁了许多,用的过程中,希望CSS能够详细注释一遍,很多不显示的内容往往不知道。

Rank: 3Rank: 3

主题:
36
帖子:
166
云币:
455
发表于 2015-9-11 17:44:00 |
新版本的AUI的图标是字体换了吗?个人感觉还是喜欢上一套的图标风格,线条比较细腻一些,怎么办呢,其它的想更新但是图标想用原来那一套

Rank: 2

主题:
23
帖子:
64
云币:
354
发表于 2015-10-8 10:16:53 |
很不错!~
一直在等官方出这个,

Rank: 1

主题:
5
帖子:
30
云币:
144
发表于 2015-10-10 10:40:53 |
,不错,正在试用。

Rank: 3Rank: 3

主题:
1
帖子:
178
云币:
823
发表于 2015-10-9 09:34:01 |
不错啊!强烈支持。APIC越来越好!

Rank: 6Rank: 6

主题:
8
帖子:
817
云币:
12667

版主勋章APICloud粉丝

发表于 2015-10-9 08:35:18 |
真是不错,赞一个

Rank: 1

主题:
0
帖子:
34
云币:
100
发表于 2015-10-9 01:00:06 来自手机 |
辛苦了,孙老师!

Rank: 9Rank: 9Rank: 9

主题:
53
帖子:
334
云币:
552

APICloud粉丝APICloud毕业勋章一周年

 楼主| 发表于 2015-10-11 20:10:23 |
萧何童鞋 发表于 2015-10-10 22:40
流浪哥,你终于还是增加了JS文件,不然我又得改回bootstrap,这几天就围绕瀑布流改啊改~~ ...

呵呵,高兴了?

Rank: 1

主题:
5
帖子:
11
云币:
30
发表于 2015-10-11 15:24:43 |
非常好,加油
发表于 2015-9-10 23:49:35 |
专业团队接单APP开发,请私聊QQ:3229484129

Rank: 3Rank: 3

主题:
9
帖子:
197
云币:
1754

APICloud粉丝一周年

发表于 2015-9-10 23:53:50 来自手机 |
感谢

Rank: 3Rank: 3

主题:
34
帖子:
151
云币:
207
发表于 2015-9-10 23:55:08 |
明天我来查查。。我要。。。

Rank: 2

主题:
2
帖子:
12
云币:
428
发表于 2015-9-10 23:58:35 |
呵呵,可以看看效果先

Rank: 1

主题:
1
帖子:
1
云币:
53
发表于 2015-9-11 00:01:07 |
强顶!辛苦了,非常好

Rank: 6Rank: 6

主题:
8
帖子:
817
云币:
12667

版主勋章APICloud粉丝

发表于 2015-9-11 08:09:14 |
感谢分享

Rank: 3Rank: 3

主题:
13
帖子:
185
云币:
1253
发表于 2015-9-11 08:24:02 |
希望越来越好

Rank: 3Rank: 3

主题:
20
帖子:
129
云币:
259
发表于 2015-9-11 08:26:46 来自手机 |
喜欢!!!
您需要登录后才可以回帖 登录 | 立即注册

快速回复 返回顶部 返回列表