Skip to content
Projects
Groups
Snippets
Help
Loading...
Help
Support
Submit feedback
Contribute to GitLab
Sign in / Register
Toggle navigation
U
uview-ui
Project
Project
Details
Activity
Releases
Cycle Analytics
Repository
Repository
Files
Commits
Branches
Tags
Contributors
Graph
Compare
Charts
Issues
0
Issues
0
List
Boards
Labels
Milestones
Merge Requests
0
Merge Requests
0
CI / CD
CI / CD
Pipelines
Jobs
Schedules
Charts
Wiki
Wiki
Snippets
Snippets
Members
Members
Collapse sidebar
Close sidebar
Activity
Graph
Charts
Create a new issue
Jobs
Commits
Issue Boards
Open sidebar
李晖
uview-ui
Commits
6ef0ec4b
Commit
6ef0ec4b
authored
May 11, 2020
by
wlxuqu
Browse files
Options
Browse Files
Download
Email Patches
Plain Diff
项目从gitee转移到github
parent
1adea458
Changes
9
Hide whitespace changes
Inline
Side-by-side
Showing
9 changed files
with
139 additions
and
15 deletions
+139
-15
README.md
README.md
+102
-0
index.vue
pages/componentsC/test/index.vue
+1
-3
u-collapse.vue
uview-ui/components/u-collapse/u-collapse.vue
+2
-2
u-column-notice.vue
uview-ui/components/u-column-notice/u-column-notice.vue
+6
-1
u-navbar.vue
uview-ui/components/u-navbar/u-navbar.vue
+1
-1
u-notice-bar.vue
uview-ui/components/u-notice-bar/u-notice-bar.vue
+8
-0
u-picker.vue
uview-ui/components/u-picker/u-picker.vue
+12
-6
u-row-notice.vue
uview-ui/components/u-row-notice/u-row-notice.vue
+6
-1
u-top-tips.vue
uview-ui/components/u-top-tips/u-top-tips.vue
+1
-1
No files found.
README.md
0 → 100644
View file @
6ef0ec4b
<p
align=
"center"
>
<img
alt=
"logo"
src=
"https://uviewui.com/common/logo.png"
width=
"120"
height=
"120"
style=
"margin-bottom: 10px;"
>
</p>
<h3
align=
"center"
style=
"margin: 30px 0 30px;font-weight: bold;font-size:40px;"
>
uView
</h3>
<h3
align=
"center"
>
多平台快速开发的UI框架
</h3>
## 说明
uView UI,是
[
uni-app
](
https://uniapp.dcloud.io/
)
生态优秀的UI框架,全面的组件和便捷的工具会让您信手拈来,如鱼得水
## 特性
-
兼容安卓,iOS,微信小程序,H5,QQ小程序,百度小程序,支付宝小程序,头条小程序
-
60+精选组件,功能丰富,多端兼容,让您快速集成,开箱即用
-
众多贴心的JS利器,让您飞镖在手,召之即来,百步穿杨
-
众多的常用页面和布局,让您专注逻辑,事半功倍
-
详尽的文档支持,现代化的演示效果
-
按需引入,精简打包体积
## 安装
```
bash
# npm方式安装
npm i uview-ui
```
## 快速上手
1.
`main.js`
引入uView库
```
js
// main.js
import
uView
from
'
uview-ui
'
;
Vue
.
use
(
uView
);
```
2.
`App.vue`
引入基础样式(注意style标签需声明scss属性支持)
```
css
/* App.vue */
<
style
lang
=
"scss"
>
@import
"uview-ui/index.scss"
;
</
style
>
```
3.
`uni.scss`
引入全局scss变量文件
```
css
/* uni.scss */
@import
"uview-ui/themb.scss"
;
```
4.
`pages.json`
配置easycom规则(按需引入)
```
js
// pages.json
{
"
easycom
"
:
{
"
^u-(.*)
"
:
"
uview-ui/components/u-$1/u-$1.vue
"
},
// 此为本身已有的内容
"
pages
"
:
[
// ......
]
}
```
请通过
[
快速上手
](
https://uviewui.com/components/quickstart.html
)
了解更详细的内容
## 使用方法
配置easycom规则后,自动按需引入,无需
`import`
组件,直接引用即可。
```
html
<template>
<u-buton>
按钮
</u-buton>
</template>
```
请通过
[
快速上手
](
https://uviewui.com/components/quickstart.html
)
了解更详细的内容
## 链接
-
[
官方文档
](
https://uviewui.com/
)
-
[
更新日志
](
https://uviewui.com/components/changelog.html
)
-
[
升级指南
](
https://uviewui.com/components/changelog.html
)
-
[
关于我们
](
https://uviewui.com/cooperation/about.html
)
## 预览
您可以通过
**微信**
扫码,查看最佳的演示效果。
<br>
<br>
<img
src=
"https://uviewui.com/common/weixin_mini_qrcode.png"
width=
"220"
height=
"220"
>
<!-- ## 捐赠uView的研发
uView文档和源码全部开源免费,如果您认为uView帮到了您的开发工作,您可以捐赠uView的研发工作,捐赠无门槛,哪怕是一杯可乐也好(相信这比打赏主播更有意义)。
<img
src=
"https://uviewui.com/common/wechat.png"
width=
"220"
>
<img
style=
"margin-left: 100px;"
src=
"https://uviewui.com/common/alipay.png"
width=
"220"
>
-->
## 版权信息
uView遵循
[
MIT
](
https://en.wikipedia.org/wiki/MIT_License
)
开源协议,意味着您无需支付任何费用,也无需授权,即可将uView应用到您的产品中。
pages/componentsC/test/index.vue
View file @
6ef0ec4b
<
template
>
<
template
>
<view>
<view>
<view
v-for=
"(Item,index) of dataList"
>
<u-number-box
:value=
"Item['num']"
@
change=
"valChanges"
></u-number-box>
</view>
</view>
</view>
</
template
>
</
template
>
...
...
uview-ui/components/u-collapse/u-collapse.vue
View file @
6ef0ec4b
...
@@ -12,8 +12,8 @@
...
@@ -12,8 +12,8 @@
* @property {Boolean} accordion 是否手风琴模式(默认true)
* @property {Boolean} accordion 是否手风琴模式(默认true)
* @property {Boolean} arrow 是否显示标题右侧的箭头(默认true)
* @property {Boolean} arrow 是否显示标题右侧的箭头(默认true)
* @property {String} arrow-color 标题右侧箭头的颜色(默认#909399)
* @property {String} arrow-color 标题右侧箭头的颜色(默认#909399)
* @property {
String} head-bg-color 标题的背景颜色(默认#ffffff)
* @property {
Object} head-style 标题自定义样式,对象形式
* @property {
String} body-bg-color 主体内容的背景颜色(默认#ffffff)
* @property {
Object} body-style 主体自定义样式,对象形式
* @property {String} hover-class 样式类名,按下时有效(默认u-hover-class)
* @property {String} hover-class 样式类名,按下时有效(默认u-hover-class)
* @event {Function} change 当前激活面板展开时触发(如果是手风琴模式,参数activeNames类型为String,否则为Array)
* @event {Function} change 当前激活面板展开时触发(如果是手风琴模式,参数activeNames类型为String,否则为Array)
* @example <u-collapse></u-collapse>
* @example <u-collapse></u-collapse>
...
...
uview-ui/components/u-column-notice/u-column-notice.vue
View file @
6ef0ec4b
...
@@ -7,7 +7,7 @@
...
@@ -7,7 +7,7 @@
}"
}"
>
>
<view
class=
"u-icon-wrap"
>
<view
class=
"u-icon-wrap"
>
<u-icon
class=
"u-left-icon"
v-if=
"volumeIcon"
name=
"volume-fill"
:size=
"
34
"
:color=
"computeColor"
></u-icon>
<u-icon
class=
"u-left-icon"
v-if=
"volumeIcon"
name=
"volume-fill"
:size=
"
volumeSize
"
:color=
"computeColor"
></u-icon>
</view>
</view>
<swiper
:disable-touch=
"disableTouch"
@
change=
"change"
:autoplay=
"autoplay && playState == 'play'"
:vertical=
"vertical"
circular
:interval=
"duration"
class=
"u-swiper"
>
<swiper
:disable-touch=
"disableTouch"
@
change=
"change"
:autoplay=
"autoplay && playState == 'play'"
:vertical=
"vertical"
circular
:interval=
"duration"
class=
"u-swiper"
>
<swiper-item
v-for=
"(item, index) in list"
:key=
"index"
class=
"u-swiper-item"
>
<swiper-item
v-for=
"(item, index) in list"
:key=
"index"
class=
"u-swiper-item"
>
...
@@ -95,6 +95,11 @@ export default {
...
@@ -95,6 +95,11 @@ export default {
type
:
[
Number
,
String
],
type
:
[
Number
,
String
],
default
:
2000
default
:
2000
},
},
// 音量喇叭的大小
volumeSize
:
{
type
:
[
Number
,
String
],
default
:
34
},
// 水平滚动时的滚动速度,即每秒滚动多少rpx,这有利于控制文字无论多少时,都能有一个恒定的速度
// 水平滚动时的滚动速度,即每秒滚动多少rpx,这有利于控制文字无论多少时,都能有一个恒定的速度
speed
:
{
speed
:
{
type
:
Number
,
type
:
Number
,
...
...
uview-ui/components/u-navbar/u-navbar.vue
View file @
6ef0ec4b
...
@@ -20,7 +20,7 @@
...
@@ -20,7 +20,7 @@
</view>
</view>
</view>
</view>
<!-- 解决fixed定位后导航栏塌陷的问题 -->
<!-- 解决fixed定位后导航栏塌陷的问题 -->
<view
class=
"u-navbar-placeholder"
v-if=
"isFixed"
:style=
"
{width: '100%',height:
navbarHeight
+ statusBarHeight + 'px'}">
<view
class=
"u-navbar-placeholder"
v-if=
"isFixed"
:style=
"
{width: '100%',height:
Number(navbarHeight)
+ statusBarHeight + 'px'}">
</view>
</view>
</view>
</view>
...
...
uview-ui/components/u-notice-bar/u-notice-bar.vue
View file @
6ef0ec4b
...
@@ -10,6 +10,7 @@
...
@@ -10,6 +10,7 @@
:list=
"list"
:list=
"list"
:volumeIcon=
"volumeIcon"
:volumeIcon=
"volumeIcon"
:moreIcon=
"moreIcon"
:moreIcon=
"moreIcon"
:volumeSize=
"volumeSize"
:closeIcon=
"closeIcon"
:closeIcon=
"closeIcon"
:mode=
"mode"
:mode=
"mode"
:fontSize=
"fontSize"
:fontSize=
"fontSize"
...
@@ -31,6 +32,7 @@
...
@@ -31,6 +32,7 @@
:moreIcon=
"moreIcon"
:moreIcon=
"moreIcon"
:closeIcon=
"closeIcon"
:closeIcon=
"closeIcon"
:mode=
"mode"
:mode=
"mode"
:volumeSize=
"volumeSize"
:disable-touch=
"disableTouch"
:disable-touch=
"disableTouch"
:fontSize=
"fontSize"
:fontSize=
"fontSize"
:duration=
"duration"
:duration=
"duration"
...
@@ -60,6 +62,7 @@
...
@@ -60,6 +62,7 @@
* @property {String} mode 滚动模式(默认horizontal)
* @property {String} mode 滚动模式(默认horizontal)
* @property {Boolean} show 是否显示(默认true)
* @property {Boolean} show 是否显示(默认true)
* @property {String Number} font-size 字体大小,单位rpx(默认28)
* @property {String Number} font-size 字体大小,单位rpx(默认28)
* @property {String Number} volume-size 左边喇叭的大小(默认34)
* @property {String Number} duration 滚动周期时长,只对步进模式有效,横向衔接模式无效,单位ms(默认2000)
* @property {String Number} duration 滚动周期时长,只对步进模式有效,横向衔接模式无效,单位ms(默认2000)
* @property {String Number} speed 水平滚动时的滚动速度,即每秒移动多少距离,只对水平衔接方式有效,单位rpx(默认160)
* @property {String Number} speed 水平滚动时的滚动速度,即每秒移动多少距离,只对水平衔接方式有效,单位rpx(默认160)
* @property {String Number} font-size 字体大小,单位rpx(默认28)
* @property {String Number} font-size 字体大小,单位rpx(默认28)
...
@@ -95,6 +98,11 @@ export default {
...
@@ -95,6 +98,11 @@ export default {
type
:
Boolean
,
type
:
Boolean
,
default
:
true
default
:
true
},
},
// 音量喇叭的大小
volumeSize
:
{
type
:
[
Number
,
String
],
default
:
34
},
// 是否显示右侧的右箭头图标
// 是否显示右侧的右箭头图标
moreIcon
:
{
moreIcon
:
{
type
:
Boolean
,
type
:
Boolean
,
...
...
uview-ui/components/u-picker/u-picker.vue
View file @
6ef0ec4b
...
@@ -35,32 +35,32 @@
...
@@ -35,32 +35,32 @@
<picker-view
v-else
:value=
"valueArr"
@
change=
"change"
class=
"u-picker-view"
>
<picker-view
v-else
:value=
"valueArr"
@
change=
"change"
class=
"u-picker-view"
>
<picker-view-column
v-if=
"!reset && params.year"
>
<picker-view-column
v-if=
"!reset && params.year"
>
<view
class=
"u-column-item"
v-for=
"(item,index) in years"
:key=
"index"
>
<view
class=
"u-column-item"
v-for=
"(item,index) in years"
:key=
"index"
>
{{
item
}}
<text
class=
"u-text"
>
年
</text>
{{
item
}}
<text
class=
"u-text"
v-if=
"showTimeTag"
>
年
</text>
</view>
</view>
</picker-view-column>
</picker-view-column>
<picker-view-column
v-if=
"!reset && params.month"
>
<picker-view-column
v-if=
"!reset && params.month"
>
<view
class=
"u-column-item"
v-for=
"(item,index) in months"
:key=
"index"
>
<view
class=
"u-column-item"
v-for=
"(item,index) in months"
:key=
"index"
>
{{
formatNumber
(
item
)
}}
<text
class=
"u-text"
>
月
</text>
{{
formatNumber
(
item
)
}}
<text
class=
"u-text"
v-if=
"showTimeTag"
>
月
</text>
</view>
</view>
</picker-view-column>
</picker-view-column>
<picker-view-column
v-if=
"!reset && params.day"
>
<picker-view-column
v-if=
"!reset && params.day"
>
<view
class=
"u-column-item"
v-for=
"(item,index) in days"
:key=
"index"
>
<view
class=
"u-column-item"
v-for=
"(item,index) in days"
:key=
"index"
>
{{
formatNumber
(
item
)
}}
<text
class=
"u-text"
>
日
</text>
{{
formatNumber
(
item
)
}}
<text
class=
"u-text"
v-if=
"showTimeTag"
>
日
</text>
</view>
</view>
</picker-view-column>
</picker-view-column>
<picker-view-column
v-if=
"!reset && params.hour"
>
<picker-view-column
v-if=
"!reset && params.hour"
>
<view
class=
"u-column-item"
v-for=
"(item,index) in hours"
:key=
"index"
>
<view
class=
"u-column-item"
v-for=
"(item,index) in hours"
:key=
"index"
>
{{
formatNumber
(
item
)
}}
<text
class=
"u-text"
>
时
</text>
{{
formatNumber
(
item
)
}}
<text
class=
"u-text"
v-if=
"showTimeTag"
>
时
</text>
</view>
</view>
</picker-view-column>
</picker-view-column>
<picker-view-column
v-if=
"!reset && params.minute"
>
<picker-view-column
v-if=
"!reset && params.minute"
>
<view
class=
"u-column-item"
v-for=
"(item,index) in minutes"
:key=
"index"
>
<view
class=
"u-column-item"
v-for=
"(item,index) in minutes"
:key=
"index"
>
{{
formatNumber
(
item
)
}}
<text
class=
"u-text"
>
分
</text>
{{
formatNumber
(
item
)
}}
<text
class=
"u-text"
v-if=
"showTimeTag"
>
分
</text>
</view>
</view>
</picker-view-column>
</picker-view-column>
<picker-view-column
v-if=
"!reset && params.second"
>
<picker-view-column
v-if=
"!reset && params.second"
>
<view
class=
"u-column-item"
v-for=
"(item,index) in seconds"
:key=
"index"
>
<view
class=
"u-column-item"
v-for=
"(item,index) in seconds"
:key=
"index"
>
{{
formatNumber
(
item
)
}}
<text
class=
"u-text"
>
秒
</text>
{{
formatNumber
(
item
)
}}
<text
class=
"u-text"
v-if=
"showTimeTag"
>
秒
</text>
</view>
</view>
</picker-view-column>
</picker-view-column>
</picker-view>
</picker-view>
...
@@ -83,6 +83,7 @@
...
@@ -83,6 +83,7 @@
* @property {String Number} start-year 可选的开始年份,mode=time时有效(默认1950)
* @property {String Number} start-year 可选的开始年份,mode=time时有效(默认1950)
* @property {String Number} end-year 可选的结束年份,mode=time时有效(默认2050)
* @property {String Number} end-year 可选的结束年份,mode=time时有效(默认2050)
* @property {Boolean} safe-area-inset-bottom 是否开启底部安全区适配(默认false)
* @property {Boolean} safe-area-inset-bottom 是否开启底部安全区适配(默认false)
* @property {Boolean} show-time-tag 时间模式时,是否显示后面的年月日中文提示
* @property {String} cancel-color 取消按钮的颜色(默认#606266)
* @property {String} cancel-color 取消按钮的颜色(默认#606266)
* @property {String} confirm-color 确认按钮的颜色(默认#2979ff)
* @property {String} confirm-color 确认按钮的颜色(默认#2979ff)
* @property {String} default-time 默认选中的时间,mode=time时有效
* @property {String} default-time 默认选中的时间,mode=time时有效
...
@@ -151,6 +152,11 @@
...
@@ -151,6 +152,11 @@
return
[];
return
[];
}
}
},
},
// 时间模式时,是否显示后面的年月日中文提示
showTimeTag
:
{
type
:
Boolean
,
default
:
true
},
// 默认显示地区的编码,defaultRegion和areaCode同时存在,areaCode优先,可传类似["13", "1303", "130304"]
// 默认显示地区的编码,defaultRegion和areaCode同时存在,areaCode优先,可传类似["13", "1303", "130304"]
areaCode
:
{
areaCode
:
{
type
:
Array
,
type
:
Array
,
...
...
uview-ui/components/u-row-notice/u-row-notice.vue
View file @
6ef0ec4b
...
@@ -9,7 +9,7 @@
...
@@ -9,7 +9,7 @@
>
>
<view
class=
"u-direction-row"
>
<view
class=
"u-direction-row"
>
<view
class=
"u-icon-wrap"
>
<view
class=
"u-icon-wrap"
>
<u-icon
class=
"u-left-icon"
v-if=
"volumeIcon"
name=
"volume-fill"
:size=
"
34
"
:color=
"computeColor"
></u-icon>
<u-icon
class=
"u-left-icon"
v-if=
"volumeIcon"
name=
"volume-fill"
:size=
"
volumeSize
"
:color=
"computeColor"
></u-icon>
</view>
</view>
<view
class=
"u-notice-box"
id=
"u-notice-box"
>
<view
class=
"u-notice-box"
id=
"u-notice-box"
>
<view
<view
...
@@ -89,6 +89,11 @@ export default {
...
@@ -89,6 +89,11 @@ export default {
type
:
[
Number
,
String
],
type
:
[
Number
,
String
],
default
:
26
default
:
26
},
},
// 音量喇叭的大小
volumeSize
:
{
type
:
[
Number
,
String
],
default
:
34
},
// 水平滚动时的滚动速度,即每秒滚动多少rpx,这有利于控制文字无论多少时,都能有一个恒定的速度
// 水平滚动时的滚动速度,即每秒滚动多少rpx,这有利于控制文字无论多少时,都能有一个恒定的速度
speed
:
{
speed
:
{
type
:
[
Number
,
String
],
type
:
[
Number
,
String
],
...
...
uview-ui/components/u-top-tips/u-top-tips.vue
View file @
6ef0ec4b
...
@@ -12,7 +12,7 @@
...
@@ -12,7 +12,7 @@
* @tutorial https://www.uviewui.com/components/topTips.html
* @tutorial https://www.uviewui.com/components/topTips.html
* @property {String Number} navbar-height 导航栏高度(包含状态栏高度在内),单位PX
* @property {String Number} navbar-height 导航栏高度(包含状态栏高度在内),单位PX
* @property {String Number} z-index z-index值(默认975)
* @property {String Number} z-index z-index值(默认975)
* @example <u-top-tips ref="uTips"
type="success" duration="1500"
></u-top-tips>
* @example <u-top-tips ref="uTips"></u-top-tips>
*/
*/
export
default
{
export
default
{
name
:
"
u-top-tips
"
,
name
:
"
u-top-tips
"
,
...
...
Write
Preview
Markdown
is supported
0%
Try again
or
attach a new file
Attach a file
Cancel
You are about to add
0
people
to the discussion. Proceed with caution.
Finish editing this message first!
Cancel
Please
register
or
sign in
to comment