您的位置:首页 > 产品设计 > UI/UE

使用AUI框架开发微信小程序

2017-05-04 17:36 906 查看

前言:

之前开发小程序一直都是自己写css代码,这样做极其考验耐性,开发效率又特别的低,于是突发奇想能不能用AUI开发微信小程序。忙碌了近两个小时,也算是小有成效。下面就和大家分享一下。

难点:

1、如何引入外部.wxss文件;
2、AUI原生图标不能使用问题;
想了半天也就觉得只有这两点可以说一说。

解决方法:

1、难点一解决方法:
 使用
@import
语句。在需要引入外部.wxss文件上方添加如下语句即可:@import
"../../lib/aui.wxss";



2、难点二解决方法:

原因:微信小程序识别不了@font-face里url地址,url地址需要使用base64编码实现(即小程序如何引入外部字体问题)。

小程序引入外部字体(图标)参考链接:http://blog.csdn.net/wangyu519/article/details/53486569



界面效果:



代码:

1、CSDN资源库下载
2、百度云盘下载,提取码:yq44

补充:

需要说明一下:
1、小程序不支持"*" 选择器,aui.css中含有“*"选择器的都已被我注释掉了;
2、记得将<img src="" />换成<image src=""></image>"

最后的最后,附上自己的小技巧,在hbuilder上开发静态页面(只为代码提示),然后将 div 全部替换为 view,最后再复制到微信开发工具上写js代码。
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: