# ColorUI Pro

**Repository Path**: leeyamaster/color-ui-component

## Basic Information

- **Project Name**: ColorUI Pro
- **Description**: 基于ColorUI组件库开发，在基础之上，封装成了ColorUI小程序组件版本，使代码更简洁，更强壮，并添加了自己的扩展。实现了消息提示框，顶部提示框，圆形进度条，骨架屏，表单效验，动态表单，瀑布流，日历，全屏弹幕，全屏点赞，手风琴，探探滑动，富文本，拖拽列表，长列表等等
- **Primary Language**: 微信
- **License**: Not specified
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 190
- **Forks**: 60
- **Created**: 2021-04-01
- **Last Updated**: 2026-03-15

## Categories & Tags

**Categories**: weixin-lapp

**Tags**: 微信小程序

## README

# Color UI Pro

基于 ColorUI 的**微信小程序原生** UI 组件库，在原有基础上做了组件化封装与扩展，支持消息提示、顶部提示、骨架屏、表单校验、动态表单、瀑布流、日历、弹幕、全屏点赞、探探滑动、富文本、拖拽列表、长列表等能力。

---

## 快速上手

| 文档 | 说明 |
|------|------|
| **[快速开始](docs/快速开始.md)** | 3 步接入已有项目、试写一个组件、运行本仓库演示 |
| **[组件清单](docs/组件清单.md)** | 所有组件列表 + 演示页路径 + 全量 `app.json` 注册示例 |
| **[类型说明](docs/类型说明.md)** | JS / TS 类型提示与 `.d.ts` 使用方式 |


### 接入自己的项目（3 步摘要）

1. **复制** 项目里的 **`colorui`** 文件夹到你的小程序根目录。
2. **在 `app.wxss` 顶部** 增加：`@import "/colorui/main.wxss";` 以及 icon、animation 的引入（见 [快速开始](docs/快速开始.md)）。
3. **在 `app.json` 的 `usingComponents`** 中按需注册组件，例如：`"l-button": "/colorui/components/button/index"`。

---

## 介绍

在 ColorUI 基础上封装为小程序组件版本，使代码更简洁、易维护，并扩展了消息提示框、顶部提示框、圆形进度条、骨架屏、表单校验、动态表单、瀑布流、日历、全屏弹幕、全屏点赞、手风琴、探探滑动、富文本、拖拽列表、长列表等能力。组件均带 JSDoc 与 `.d.ts`，支持 JS/TS 类型提示。

---

## 图片资源

链接: https://pan.baidu.com/s/1M83k42FQq6-W9qr1ehkmUw 提取码: hncy

---

## 项目截图
![输入图片说明](introduce/1.png)
![输入图片说明](introduce/10.png)
![输入图片说明](introduce/4.png)
![输入图片说明](introduce/2.png)
![输入图片说明](introduce/3.png)
![输入图片说明](introduce/5.png)
![输入图片说明](introduce/6.png)
![输入图片说明](introduce/7.png)
![输入图片说明](introduce/8.png)
![输入图片说明](introduce/9.png)