Compare commits
No commits in common. "fab73f00ab70c1963fabeef3f57e4b5d852f2a7d" and "edb26b3d8b54670e430b1583a41aa6f031072389" have entirely different histories.
fab73f00ab
...
edb26b3d8b
@ -1,4 +1,3 @@
|
|||||||
@import "../../app.scss";
|
|
||||||
|
|
||||||
view.mask {
|
view.mask {
|
||||||
position: fixed;
|
position: fixed;
|
||||||
@ -7,39 +6,3 @@ view.mask {
|
|||||||
background-color: rgba($color: #000000, $alpha: .2);
|
background-color: rgba($color: #000000, $alpha: .2);
|
||||||
z-index: 1;
|
z-index: 1;
|
||||||
}
|
}
|
||||||
|
|
||||||
view.mask.block {
|
|
||||||
display: block;
|
|
||||||
}
|
|
||||||
|
|
||||||
view.mask.none {
|
|
||||||
display: none;
|
|
||||||
}
|
|
||||||
|
|
||||||
view.mask.show {
|
|
||||||
animation: show .1s cubic-bezier(0, 0, 1, 1) both;
|
|
||||||
opacity: 1;
|
|
||||||
}
|
|
||||||
|
|
||||||
view.mask.hide {
|
|
||||||
animation: hide .1s cubic-bezier(0, 0, 1, 1) both;
|
|
||||||
opacity: 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
@keyframes show{
|
|
||||||
from {
|
|
||||||
opacity: 0;
|
|
||||||
}
|
|
||||||
to {
|
|
||||||
opacity: 1;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
@keyframes hide{
|
|
||||||
from {
|
|
||||||
opacity: 1;
|
|
||||||
}
|
|
||||||
to {
|
|
||||||
opacity: 0;
|
|
||||||
}
|
|
||||||
}
|
|
@ -2,11 +2,6 @@ import { Modular, Manager } from "../../core/Module";
|
|||||||
|
|
||||||
class Mask<M extends Manager> extends Modular<M> {
|
class Mask<M extends Manager> extends Modular<M> {
|
||||||
|
|
||||||
/**
|
|
||||||
* 动画运行时间
|
|
||||||
*/
|
|
||||||
public static readonly animateTime: number = 100;
|
|
||||||
|
|
||||||
public data? = {
|
public data? = {
|
||||||
|
|
||||||
/**
|
/**
|
||||||
@ -14,11 +9,6 @@ class Mask<M extends Manager> extends Modular<M> {
|
|||||||
*/
|
*/
|
||||||
zIndex: 1,
|
zIndex: 1,
|
||||||
|
|
||||||
/**
|
|
||||||
* 蒙版是否显示
|
|
||||||
*/
|
|
||||||
isDisplay: false,
|
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* 蒙版是否显示
|
* 蒙版是否显示
|
||||||
*/
|
*/
|
||||||
@ -31,25 +21,14 @@ class Mask<M extends Manager> extends Modular<M> {
|
|||||||
* 显示蒙版
|
* 显示蒙版
|
||||||
*/
|
*/
|
||||||
public showMask() {
|
public showMask() {
|
||||||
this.setData({
|
this.setData({ isShow: true });
|
||||||
isShow: true,
|
|
||||||
isDisplay: true
|
|
||||||
});
|
|
||||||
}
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* 隐藏蒙版
|
* 隐藏蒙版
|
||||||
*/
|
*/
|
||||||
public hideMask() {
|
public hideMask() {
|
||||||
this.setData({
|
this.setData({ isShow: false });
|
||||||
isShow: false
|
|
||||||
});
|
|
||||||
|
|
||||||
this.disappearTimer = setTimeout(() => {
|
|
||||||
this.setData({
|
|
||||||
isDisplay: false
|
|
||||||
});
|
|
||||||
}, Mask.animateTime);
|
|
||||||
}
|
}
|
||||||
|
|
||||||
public override onLoad() {
|
public override onLoad() {
|
||||||
|
@ -1,6 +1,5 @@
|
|||||||
<!-- 蒙版 -->
|
<!-- 蒙版 -->
|
||||||
<view class="mask {{ mask$isShow ? 'show' : 'hide' }} {{ mask$isDisplay ? 'block' : 'none' }}"
|
<view class="mask" bindtap="mask$handleClickMask" style="display:{{mask$isShow ? 'block' : 'none'}}"></view>
|
||||||
bindtap="mask$handleClickMask"></view>
|
|
||||||
|
|
||||||
<!-- 顶部的阴影 -->
|
<!-- 顶部的阴影 -->
|
||||||
<view class="top-shadow"></view>
|
<view class="top-shadow"></view>
|
||||||
|
Loading…
Reference in New Issue
Block a user