更新记录
1.0.12(2025-09-20) 下载此版本
- [更新] 适配 HBuilder X 4.81 版本
- [优化] 优化Cell、Collapse 样式
1.0.11(2025-09-16) 下载此版本
- [新增] 新增 ScrollX 横向滚动列表组件, 文档
1.0.10(2025-09-11) 下载此版本
[新增] 新增 CodeInput 验证码输入框组件, 文档
查看更多平台兼容性
uni-app x(4.71)
Chrome | Safari | Android | iOS | 鸿蒙 | 微信小程序 |
---|---|---|---|---|---|
√ | √ | √ | √ | √ | √ |
其他
多语言 | 暗黑模式 | 宽屏模式 |
---|---|---|
× | √ | √ |
RiceUI
基于 uniapp x 开发的多平台UI框架,采用vue3组合式API进行开发,同时兼容Android、iOS、鸿蒙Next、微信小程序、h5。 一次编写,多端发布,大幅度提高开发效率。支持暗黑模式。RiceUI文档地址
开源协议
本组件库内的所有组件代码完全开源,遵循 MIT开源协议 ,用户可根据MIT开源协议进行使用、修改、分发及商业应用,无需付费。
注意:这并不意味着您可以将RiceUI应用到非法的领域,比如涉及赌博,暴力,欺诈等方面。如因此产生纠纷或法律问题,RiceUI相关方不承担任何责任。
Demo 示例项目使用限制见下
快速开始
1.在 APP.vue
中 引入基础样式文件
<script></script>
<style>
@import "@/uni_modules/rice-ui/libs/style/index.css";
</style>
2.无需通过import 引入组件,直接在项目中使用即可
<rice-button type="primary" text="确定"></rice-button>
3.暗黑模式切换
import { setTheme } from "@/uni_modules/rice-ui"
//使用者需要手动调用 setTheme 方法设置暗黑/明亮模式
const setRiceUiTheme = () => {
setTheme('dark') //参数传 'dark' 或 'light'
}
自定义颜色主题
1.新建一个 css 文件,自行修改以下颜色变量,其中 rice-theme-light 表示明亮模式,rice-theme-dark 表示暗黑模式。更多颜色变量请查看/libs/style/variables.css
文件
/* 自定义主题色示例 */
/* 明亮模式下的主题 */
.rice-theme-light {
--rice-primary-color: #845ec2;
--rice-success-color: #4d8076;
--rice-warning-color: #e6a23c;
--rice-error-color: #f56c6c;
/* ....其他你自己要修改的颜色值 */
}
/* 暗黑模式下的主题 */
.rice-theme-dark {
--rice-primary-color: #6235c2;
--rice-success-color: #0d8063;
--rice-warning-color: #e6a23c;
--rice-error-color: #f56c6c;
/* ....其他你自己要修改的颜色值 */
}
2.在APP.vue中引入该css文件,假设上述 css 文件是放在 /common/theme.css 下的
<style>
@import "@/uni_modules/rice-ui/libs/style/index.css";
/* 自定义主题色示例,注意要放在基础样式文件下面 */
@import "@/common/theme.css";
</style>
文档地址
项目预览
Android扫码后请自行在打开的网页中点击下载最新的apk文件

Demo 下载
点击右上角的 “使用HbuilderX导入示例项目” 即可下载demo
Demo 示例项目使用限制
- 版权归属:本组件库附带的示例演示项目(Demo)版权归 RiceUI作者 所有,受《中华人民共和国著作权法》及国际版权公约保护。
- 使用许可:用户可查看、学习及本地运行Demo代码,但禁止将Demo或基于Demo的衍生作品以任何形式提交至各大应用市场(包括但不限于 App Store、Google Play、华为应用市场、小程序平台等)。
- 其他用途:除上架应用市场外,用户可在非商业展示、技术分享等场景中使用Demo内容,但需保留原作者版权声明。
- 如果您选择继续使用本组件库,即表示您同意接受这些条款。
问题反馈
点击加入 uni-im 群交流或反馈问题
我们欢迎所有形式的贡献,无论是新功能、Bug的修复、文档的改进还其他任何可改进的地方。
写在最后
- 开源之路确实不易,凌晨还在写代码是常事。若您有任何建议,也请友善表达,我们非常乐意倾听。
- 遇到 BUG 是正常现象,任何程序都难免存在不足之处,希望大家能够多一份理解、多一份耐心。您提出的每一个问题,我们都将努力改进。
- 如果您觉得这个项目对您有帮助,请不要吝啬您的点赞和好评,您的认可就是我们持续努力的最大动力!