Skip to content

U
uview-ui
Commit 3bd79f55 authored by wlxuqu's avatar wlxuqu
Browse files
Options

1. 修复picker组件的按钮颜色参数无效的问题 

2. field组件增加field-style和clearsize参数
3. 优化swipeAction滑动单元格组件的内部逻辑，新增content-click事件
4. 修复部分安卓手机下载demo中样式错乱的问题
parent 9a297f22
Hide whitespace changes
Inline Side-by-side
Showing with 95 additions and 53 deletions
manifest.json
View file @ 3bd79f55
......@@ -46,7 +46,8 @@
"<uses-feature android:name=\"android.hardware.camera\"/>",
"<uses-permission android:name=\"android.permission.ACCESS_FINE_LOCATION\"/>",
"<uses-permission android:name=\"android.permission.WRITE_SETTINGS\"/>"
]
],
"abiFilters" : [ "armeabi-v7a", "arm64-v8a" ]
},
"ios" : {},
"sdkConfigs" : {
......
pages/componentsB/swipeAction/index.vue
View file @ 3bd79f55
......@@ -16,6 +16,7 @@
:btn-width="btnWidth"
@close="close"
:options="options"
@content-click="contentClick"
>
<view class="item u-border-bottom">
<image mode="aspectFill" :src="item.images" />
......@@ -115,6 +116,9 @@ export default {
},
close(index) {
this.list[index].show = false;
},
contentClick(index) {
// console.log(index);
}
}
};
......
template.h5.html
View file @ 3bd79f55
......@@ -3,7 +3,7 @@
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<link rel="shortcut icon" type="image/x-icon" href="http://cdn.uviewui.com/uview/common/favicon.ico">
<link rel="shortcut icon" type="image/x-icon" href="https://cdn.uviewui.com/uview/common/favicon.ico">
<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
<title>
<%= htmlWebpackPlugin.options.title %>
......
uview-ui/components/u-checkbox-group/u-checkbox-group.vue
View file @ 3bd79f55
......@@ -10,6 +10,7 @@
* @description 复选框组件一般用于需要多个选择的场景，该组件功能完整，使用方便
* @tutorial https://www.uviewui.com/components/checkbox.html
* @property {String Number} max 最多能选中多少个checkbox（默认999）
* @property {String Number} size 组件整体的大小，单位rpx（默认40）
* @property {Boolean} disabled 是否禁用所有checkbox（默认false）
* @property {String} active-color 选中时的颜色，应用到所有子Checkbox组件（默认#2979ff）
* @event {Function} change 任一个checkbox状态发生变化时触发，回调为一个对象
......
uview-ui/components/u-checkbox/u-checkbox.vue
View file @ 3bd79f55
......@@ -18,7 +18,6 @@
* @tutorial https://www.uviewui.com/components/checkbox.html
* @property {String Number} icon-size 图标大小，单位rpx（默认24）
* @property {String Number} label-size label字体大小，单位rpx（默认28）
* @property {String Number} size 组件整体的大小，单位rpx（默认40）
* @property {String Number} name checkbox组件的标示符
* @property {String} shape 形状，见官网说明（默认circle）
* @property {Boolean} disabled 是否禁用（默认false）
......
uview-ui/components/u-field/u-field.vue
View file @ 3bd79f55
......@@ -12,30 +12,32 @@
<text class="u-label-text" :class="[this.$slots.icon || icon ? 'u-label-left-gap' : '']">{{ label }}</text>
</view>
<view class="fild-body">
<textarea v-if="type == 'textarea'" class="u-input-class u-textarea-class" :style="[inputStyle]" :value="value"
:placeholder="placeholder" :placeholderStyle="placeholderStyle" :disabled="disabled" :maxlength="inputMaxlength"
:focus="focus" :autoHeight="autoHeight" :fixed="fixed" @input="onInput" @blur="onBlur" @focus="onFocus" @confirm="onConfirm"
@tap="fieldClick" />
<input
v-else
:style="[inputStyle]"
class="u-input-class"
:type="type"
:value="value"
:password="password || type === 'password'"
:placeholder="placeholder"
:placeholderStyle="placeholderStyle"
:disabled="disabled"
:maxlength="inputMaxlength"
:focus="focus"
:confirmType="confirmType"
@focus="onFocus"
@blur="onBlur"
@input="onInput"
@confirm="onConfirm"
@tap="fieldClick"
/>
<u-icon v-if="clearable && value && focused" name="close-circle-fill" color="#c0c4cc" class="u-clear-icon" @touchstart="onClear"/>
<view class="u-field__input-wrap u-flex" :style="[inputWrapStyle]">
<textarea v-if="type == 'textarea'" class="u-flex-1 u-textarea-class" :style="[fieldStyle]" :value="value"
:placeholder="placeholder" :placeholderStyle="placeholderStyle" :disabled="disabled" :maxlength="inputMaxlength"
:focus="focus" :autoHeight="autoHeight" :fixed="fixed" @input="onInput" @blur="onBlur" @focus="onFocus" @confirm="onConfirm"
@tap="fieldClick" />
<input
v-else
:style="[fieldStyle]"
:type="type"
class="u-flex-1"
:value="value"
:password="password || type === 'password'"
:placeholder="placeholder"
:placeholderStyle="placeholderStyle"
:disabled="disabled"
:maxlength="inputMaxlength"
:focus="focus"
:confirmType="confirmType"
@focus="onFocus"
@blur="onBlur"
@input="onInput"
@confirm="onConfirm"
@tap="fieldClick"
/>
</view>
<u-icon :size="clearSize" v-if="clearable && value && focused" name="close-circle-fill" color="#c0c4cc" class="u-clear-icon" @touchstart="onClear"/>
<view class="u-button-wrap"><slot name="button" /></view>
<u-icon v-if="rightIcon" @click="rightIconClick" :name="rightIcon" color="#c0c4cc" :style="[rightIconStyle]" size="26" class="u-arror-right" />
</view>
......@@ -60,6 +62,8 @@
* @property {Boolean} clearable 是否显示右侧清空内容的图标控件(输入框有内容，且获得焦点时才显示)，点击可清空输入框内容（默认true）
* @property {Number String} label-width label的宽度，单位rpx（默认130）
* @property {String} label-align label的文字对齐方式（默认left）
* @property {Object} field-style 自定义输入框的样式，对象形式
* @property {Number | String} clear-size 清除图标的大小，单位rpx（默认30）
* @property {String} input-align 输入框内容对齐方式（默认left）
* @property {String} icon-color 左边通过icon配置的图标的颜色（默认#606266）
* @property {Boolean} auto-height 是否自动增高输入区域，type为textarea时有效（默认true）
......@@ -146,6 +150,18 @@ export default {
labelPosition: {
type: String,
default: 'left'
},
// 输入框的自定义样式
fieldStyle: {
type: Object,
default() {
return {}
}
},
// 清除按钮的大小
clearSize: {
type: [Number, String],
default: 30
}
},
inject: ['uCellGroup'],
......@@ -161,7 +177,7 @@ export default {
}
},
computed: {
inputStyle() {
inputWrapStyle() {
let style = {};
style.textAlign = this.inputAlign;
// 判断lable的位置，如果是left的话，让input左边两边有间隙
......@@ -302,7 +318,7 @@ export default {
line-height: 1;
}
.u-input-class {
.u-field__input-wrap {
position: relative;
overflow: hidden;
font-size: 28rpx;
......@@ -338,4 +354,8 @@ export default {
.placeholder-style {
color: rgb(150, 151, 153);
}
.u-input-class {
font-size: 28rpx;
}
</style>
uview-ui/components/u-picker/u-picker.vue
View file @ 3bd79f55
......@@ -3,9 +3,9 @@
:safeAreaInsetBottom="safeAreaInsetBottom" @close="close" :z-index="uZIndex">
<view class="u-datetime-picker" @tap.stop>
<view class="u-picker-header" @touchmove.stop.prevent="stop" catchtouchmove="stop">
<view class="u-btn-picker u-tips-color" :style="{ color: cancelColor }" hover-class="u-opacity" :hover-stay-time="150"
<view class="u-btn-picker u-btn-picker--tips" :style="{ color: cancelColor }" hover-class="u-opacity" :hover-stay-time="150"
@tap="getResult('cancel')">取消</view>
<view class="u-btn-picker u-type-primary" :style="{ color: confirmColor }" hover-class="u-opacity" :hover-stay-time="150"
<view class="u-btn-picker u-btn-picker--primary" :style="{ color: confirmColor }" hover-class="u-opacity" :hover-stay-time="150"
@touchmove.stop="" @tap.stop="getResult('confirm')">确定</view>
</view>
<view class="u-picker-body">
......@@ -532,4 +532,12 @@
.u-opacity {
opacity: 0.5;
}
.u-btn-picker--primary {
color: $u-type-primary;
}
.u-btn-picker--tips {
color: $u-tips-color;
}
</style>
uview-ui/components/u-rate/u-rate.vue
View file @ 3bd79f55
......@@ -21,7 +21,7 @@
* @property {String Number} size 星星的大小，单位rpx（默认32）
* @property {String} inactive-color 未选中星星的颜色（默认#b2b2b2）
* @property {String} active-color 选中的星星颜色（默认#FA3534）
* @property {String} gutter 星星之间的距离（默认#323233）
* @property {String} gutter 星星之间的距离（默认10）
* @property {String Number} min-count 最少选中星星的个数（默认0）
* @property {Boolean} allow-half 是否允许半星选择（默认false）
* @event {Function} change 选中的星星发生变化时触发
......
uview-ui/components/u-swipe-action/u-swipe-action.vue
View file @ 3bd79f55
......@@ -12,10 +12,10 @@
width: movableViewWidth
}"
>
<view class="u-swipe-content"><slot></slot></view>
<view class="u-swipe-content" @tap.stop="contentClick"><slot></slot></view>
<view
class="u-swipe-del"
@tap.stop="del(index)"
@tap.stop="btnClick(index)"
:style="[btnStyle(item.style)]"
v-for="(item, index) in options" :key="index"
>
......@@ -30,31 +30,21 @@
* swipeAction 左滑单元格
* @description 该组件一般用于左滑唤出操作菜单的场景，用的最多的是左滑删除操作。
* @tutorial https://www.uviewui.com/components/swipeAction.html
* @property {String} btn-text 按钮文字（默认“删除”）
* @property {String} btn-bg-color 按钮背景颜色（默认#ff0033）
* @property {String} bg-color 整个组件背景颜色（默认#ffffff）
* @property {Array} options 数组形式，可以配置背景颜色和文字
* @property {String Number} index 标识符，点击时候用于区分点击了哪一个，用v-for循环时的index即可
* @property {String Number} btn-width 按钮宽度，单位rpx（默认180）
* @property {Boolean} disabled 是否禁止某个swipeAction滑动（默认false）
* @property {Boolean} show 打开或者关闭某个组件（默认false）
* @event {Function} click 点击组件时触发
* @event {Function} close 组件触发关闭状态时
* @event {Function} content-click 点击内容时触发
* @event {Function} open 组件触发打开状态时
* @example <u-swipe-action btn-text="收藏">...</u-swipe-action>
*/
export default {
name: 'u-swipe-action',
props: {
// 左边滑动出来按钮的文字
btnText: {
type: String,
default: '删除'
},
// 滑动出来的按钮的背景颜色
btnBgColor: {
type: String,
default: '#ff0033'
},
// index值，用于得知点击删除的是哪个按钮
index: {
type: [Number, String],
......@@ -85,7 +75,7 @@ export default {
type: Boolean,
default: false
},
//
// 按钮操作参数
options: {
type: Array,
default() {
......@@ -136,10 +126,9 @@ export default {
this.getActionRect();
},
methods: {
// 点击删除按钮
del(index) {
// 点击按钮
btnClick(index) {
this.status = false;
this.moveX = 0;
// this.index为点击的几个组件，index为点击某个组件的第几个按钮(options数组的索引)
this.$emit('click', this.index, index);
},
......@@ -209,6 +198,15 @@ export default {
this.$uGetRect('.u-swipe-action').then(res => {
this.movableAreaWidth = res.width;
});
},
// 点击内容触发事件
contentClick() {
// 点击内容时，如果当前为打开状态，收起组件
if(this.status == true) {
this.status = 'close';
this.moveX = 0;
}
this.$emit('content-click', this.index);
}
}
};
......
uview-ui/components/u-waterfall/u-waterfall.vue
View file @ 3bd79f55
......@@ -74,6 +74,9 @@
let rightRect = await this.$uGetRect('#u-right-cloumn');
// 如果左边小于或等于右边，就添加到左边，否则添加到右边
let item = this.tempList[0];
// 解决多次快速上拉后，可能数据会乱的问题，因为经过上面的两个await节点查询阻塞一定时间，加上后面的定时器干扰
// 数组可能变成[]，导致此item值可能为undefined
if(!item) return ;
if (leftRect.height < rightRect.height) {
this.leftList.push(item);
} else if (leftRect.height > rightRect.height) {
......
uview-ui/libs/config/config.js
View file @ 3bd79f55
// 此版本发布于2020-05-05
let version = '1.1.7';
// 此版本发布于2020-05-07
let version = '1.2.0';
export default {
v: version,
......
uview-ui/libs/css/common.scss
View file @ 3bd79f55
.u-relative {
position: relative;
}
.u-absolute {
position: absolute;
}
.u-font-xs {
font-size: 22rpx;
}
......
uview-ui/package.json
View file @ 3bd79f55
{
"name": "uview-ui",
"version": "1.1.9",
"version": "1.2.0",
"description": "uView UI，是uni-app生态优秀的UI框架，全面的组件和便捷的工具会让您信手拈来，如鱼得水",
"main": "index.js",
"keywords": ["uview", "uView", "uni-app", "uni-app ui", "uniapp", "uviewui", "uview ui", "uviewUI", "uViewui", "uViewUI", "uView UI", "uni ui", "uni UI", "uniapp ui", "ui", "UI框架", "uniapp ui框架", "uniapp UI"],
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment