小程序组件库ColorUI的使用,一键复制粘贴
2020-06-30 本文已影响0人
祈澈菇凉
在开发uniapp的时候,最佳的ui框架就是ColorUI,ColorUI是一个Css类的UI组件库!不是一个Js框架。相比于同类小程序组件库,ColorUI更注重于视觉交互!
颜值很高,注重颜值的程序员,可以选择考虑一下哦。
github地址:
https://github.com/weilanwl/ColorUI
![](https://img.haomeiwen.com/i5640239/3fcd2b70937f902d.png)
在色彩设计上,都是非常的好看,非常的丰富的。
今天在做小程序 的时候,由于自己的页面需求的卡片,列表,以及ui色彩搭配都和这个框架里面所提供的组件都高度契合,之前做app开发的时候也一直在用这个框架,比较熟悉,于是还是选择了这筐。
小程序的框架组件是非常的多的,之前有总结过一些
小程序开源框架汇总,你知道几个?
https://www.jianshu.com/p/82562e152aec?tdsourcetag=s_pcqq_aiomsg
但是在选择框架的时候,一定要根据自己在实际项目开发中的需求,来进行选型。
1:克隆或者下载
![](https://img.haomeiwen.com/i5640239/2544a1ddae82afe5.png)
2:将colorui复制在自己的文件的根目录底下
![](https://img.haomeiwen.com/i5640239/d3659847c58727d8.png)
3:打开小程序的app.wxss,引入组件
@import "colorui/main.wxss";
@import "colorui/icon.wxss";
![](https://img.haomeiwen.com/i5640239/56e9bca25579f1d6.png)
4:这个时候,就可以使用(复制ColorUI组件里面的界面)
了,比如说,我要使用一个card的卡功能 的时候。
我就会进入到文件代码里面,找到这个组件,一件复制,放在自己的项目里面。
![](https://img.haomeiwen.com/i5640239/fcb47523f69a4385.png)
5:复制完成之后,来看一下自己的界面效果,这就是我想要的卡片了,然后修改一下图片和文字,就可以了。
![](https://img.haomeiwen.com/i5640239/2cbd7dc20b7a6fab.png)
哇塞,ε=ε=ε太给力了,特别适合我这种不想写代码的开发了,好用
欢迎关注【编程微刊】公众号,回复【领取资源】,500G编程学习资源干货免费送。