apicloud apicloud

注册
查看: 44156|回复: 367

[案例源码] [ AUI发布 ] 纯CSS UI框架,帮你快速完成APP布局

 

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

APICloud粉丝APICloud毕业勋章一周年

[案例源码] [ AUI发布 ] 纯CSS UI框架,帮你快速完成APP布局

 
44156 367 | 发表于 2015-7-17 13:56:17 |阅读模式 | |
本帖最后由 流浪男 于 2015-11-6 10:21 编辑




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



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




@流浪男  QQ:343757327      交流群:344869952


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

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

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


v 1.1.2
下载及演示  
https://community.apicloud.com/bbs/forum.php?mod=viewthread&tid=13800

———————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
  • 优化列表
  • 优化底部切换


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

1、自定义弹出层实用方法,注意将aui_alert_frm.html放入html文件夹,aui_alert.js放入script文件夹,结合api.js使用
$aui.alert({
            title:'提示',//标题
            content:'你认为AUI是一个好框架吗',//中间内容,可以自定义html
            buttons:['不是','是'],//按钮
            radius:6,//圆角,默认为0
            titleColor:'#ff3300',//标题颜色
            contColor:'#333',//内容颜色
            btnColor:''//按钮颜色
        },function(ret){
            //ret回调为按钮顺序
            if(ret){
                if(ret==0){
                    alert("AUI没有得到你的认可我们会继续努力")
                }else if(ret==1){
                    alert("感谢你对AUI的支持")
                }
            }
        })

2、新增aui-radio-name   aui-checkbox-name
<div class="aui-form">
    <div class="aui-input-row">
        <label class="aui-input-addon">checkbox</label>
        <div class="aui-pull-right">
            <input class="aui-checkbox" type="checkbox">
            <div class="aui-checkbox-name">选项一</div>
            <input class="aui-checkbox" type="checkbox">
            <div class="aui-checkbox-name">选项二</div>
        </div>   
    </div>
</div>


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

———————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、聊天界面优化调整


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








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

6

查看全部评分

主题:
14
帖子:
318
云币:
2318

APICloud粉丝圣诞节

发表于 2015-7-17 14:23:41 |
nice啊,快点开源

主题:
8
帖子:
363
云币:
2726

APICloud粉丝

发表于 2015-7-17 13:58:36 |
不错哦!!!!!!!!
支持一下~~~

主题:
46
帖子:
4314
云币:
47923

足球狗APICloud粉丝连续签到100天一周年中秋节社会摇圣诞节老司机首长好!托马斯全旋女朋友不想上班!装逼侠单身狗锤子侠SB侠我李白贼6APICloud大会专属勋章不觉明厉强者王者狗年旺旺旺儿童节快乐

发表于 2015-7-17 13:58:56 |
顶~~~~~~~~~~

主题:
7
帖子:
1577
云币:
1578
发表于 2015-7-17 13:59:03 |
  做个网站展示比较好
30分钟内迅速响应,一对一技术支持,每个问题均能获得专业解答----优先技术支持

主题:
21
帖子:
514
云币:
578

APICloud粉丝APICloud毕业勋章一周年圣诞节托马斯全旋女朋友

发表于 2015-7-17 13:59:12 |
第一个沙发前来支援!使用过觉得好棒!

驾校小白

UID:74244

主题:
0
帖子:
2
云币:
10
发表于 2015-7-17 14:00:37 |
不错,

主题:
8
帖子:
323
云币:
4029

中秋节APICloud粉丝女朋友单身狗

发表于 2015-7-17 14:01:59 |
点一个赞

主题:
8
帖子:
76
云币:
312
发表于 2015-7-17 14:07:23 |
那么,请问到哪里购买呢?

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

APICloud粉丝APICloud毕业勋章一周年

 楼主| 发表于 2015-7-17 14:08:29 |
cocomilk 发表于 2015-7-17 14:07
那么,请问到哪里购买呢?

马上就会放出,免费开源
您需要登录后才可以回帖 登录 | 立即注册

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