Skip to content

M
mini-program-wepy
Commit 828f6d06 authored by 郝聪敏's avatar 郝聪敏
Browse files
Options

优化动画

parent 43e1d87e
Hide whitespace changes
Inline Side-by-side
Showing with 29 additions and 59 deletions
src/components/custom/openAnimation.wpy
View file @ 828f6d06
......@@ -318,6 +318,9 @@
border: 1rpx solid #FF5D15;
z-index: 11;
border-radius: 10rpx;
&:after {
border: none;
};
&:nth-child(1) {
background: #fff;
color: #FF5D15;
......
src/components/custom/sign.wpy
View file @ 828f6d06
......@@ -152,9 +152,11 @@
}
if (v) {
setTimeout(() => {
this.signComplete = true;
this.flyAnimation = true;
}, 1100);
setTimeout(() => {
this.signComplete = true;
}, 50);
}, 1000);
}
}
},
......@@ -238,7 +240,7 @@
position: absolute;
width: 78rpx;
height: 78rpx;
z-index: 1;
z-index: 3;
}
.jump {
animation: jump 1.2s infinite ease;
......
src/components/custom/starAnimation.wpy
View file @ 828f6d06
......@@ -36,23 +36,23 @@
height: 0;
// border: 2rpx solid #000;
z-index: 10;
transform: rotateZ(-2deg)
// transform: rotateZ(-2deg)
}
.star {
position: absolute;
left: -3rpx;
left: -8rpx;
// bottom: -220rpx;
top: -4rpx;
top: -12rpx;
// left: -43%;
height: 10rpx;
width: 150rpx;
// width: 100rpx;
background: linear-gradient(-45deg,rgba(255,255,255,0),yellow);
transform: translateX(605rpx);
// background: -webkit-linear-gradient(-45deg,rgba(255,255,255,0),yellow);
/*此处为下一步的添加动画*/
// -webkit-animation: tail 1s ease-in forwards, shooting 1s ease-in forwards;
// -o-animation: tail 1s ease-in forwards, shooting 1s ease-in forwards;
animation: tail .6s ease-in forwards, shooting .6s ease-in forwards;
animation: tail .7s .1s ease-in forwards, shooting .7s .1s ease-in forwards;
}
.star::before{
content: "";
......@@ -61,6 +61,7 @@
left: -52rpx;
width: 78rpx;
height: 78rpx;
// transform: scale(0.5);
// top: calc(100% - 1px);
// left: 100%;
background: url('http://activitystatic.xyqb.com/sign@2x.png') 0 0/contain no-repeat;
......@@ -68,10 +69,10 @@
/*此处为下一步的添加动画*/
// -webkit-animation: shining 3s ease-in-out infinite;
// -o-animation: shining 3s ease-in-out infinite;
animation: shining .6s ease-in-out forwards;
animation: shining .7s .1s ease-in-out forwards;
}
.star:before {
transform: rotateZ(-2deg);
// transform: rotateZ(-2deg);
// transform: -webkit-translateX(-50%) -webkit-rotateZ(-45deg);
}
.star:after {
......@@ -85,9 +86,9 @@
// 100% {width: 0;}
// }
@keyframes shining {
0% {transform: scale(1);}
0% {transform: scale(1);top: -29rpx;}
// 50% {transform: scale(0.8);}
99% {transform: scale(0.3);}
99% {transform: scale(0.5);top: -33rpx;}
100% {transform: scale(0);}
}
// @-webkit-keyframes tail {
......@@ -97,9 +98,10 @@
// }
@keyframes tail {
0% {width: 0;}
10% {width: 0;}
50% {width: 150rpx;}
65% {width: 50rpx;}
// 10% {width: 0;}
20% {width: 100rpx;}
40% {width: 150rpx;}
60% {width: 100rpx;}
80% {width: 150rpx;}
100% {width: 0;}
}
......
src/components/custom/videolist.wpy
View file @ 828f6d06
......@@ -43,7 +43,7 @@
.orange {
width: 0;
height:100%;
transition:all 1s;
transition:all .6s;
background-color: #FF5D15;
}
}
......
src/pages/index.wpy
View file @ 828f6d06
......@@ -187,8 +187,8 @@
<swiper class="list-wrapper" vertical="true" circular="true" display-multiple-items="2" autoplay="true" interval="1500">
<swiper-item wx:for="{{adlist}}" wx:key="index" catch:touchmove>
<view class="imgwrap">
<image class="img" src="{{item.imgsrc}}"></image>
<view class="text">{{item.text}}</view>
<image class="img" src="{{item.avatarUrl}}"></image>
<view class="text">{{item.content}}</view>
</view>
</swiper-item>
</swiper>
......@@ -244,7 +244,7 @@
import { mapState, mapActions } from '@wepy/x';
import wepy from '@wepy/core';
import Notify from '../components/vant/notify/notify';
import { register, getUserInfo, addGold, getPrizeList, signIn } from '../common/api.js';
import { register, getUserInfo, addGold, getPrizeList, signIn, getActivityFeed } from '../common/api.js';
wepy.page({
store,
hooks: {
......@@ -415,6 +415,7 @@
inviter: this.inviter
};
await register(userInfo);
wx.setStorageSync('isRegister', true);
}
}
},
......@@ -591,59 +592,21 @@
// this.videoList = urls.map((url, index) => ({ id: index + 1, url, type: 'image' }));
},
async onLoad (options) {
let that = this;
if (options.openid) {
this.inviter = options.openid;
}
this.adlist = [
{imgsrc: '/static/images/test1.jpg', text: '小明刚刚参与了抽奖'},
{imgsrc: '/static/images/test1.jpg', text: '小2刚刚参与了抽奖'},
{imgsrc: '/static/images/test1.jpg', text: '小3刚刚参与了抽奖'},
{imgsrc: '/static/images/test1.jpg', text: '小4刚刚参与了抽奖'},
{imgsrc: '/static/images/test1.jpg', text: '小5刚刚参与了抽奖'},
{imgsrc: '/static/images/test1.jpg', text: '小6刚刚参与了抽奖'},
{imgsrc: '/static/images/test1.jpg', text: '小7刚刚参与了抽奖'},
{imgsrc: '/static/images/test1.jpg', text: '小8刚刚参与了抽奖'}
];
// console.log(this.$app.$options.globalData.info,111)
// 如果已经存在store里就不用再获取用户信息了
this.adlist = await getActivityFeed();
if (!this.userInfo) {
const setting = await wepy.wx.getSetting();
if (setting.authSetting['scope.userInfo']) {
const { userInfo } = wepy.wx.getUserInfo();
this.setUserInfo(userInfo);
this.getMainInfo();
await this.getMainInfo();
} else {
this.authmodal = true;
}
}
// if (this.userInfo) return;
// wx.getSetting({
// success: res => {
// if (res.authSetting['scope.userInfo']) {
// // 已经授权，可以直接调用 getUserInfo 获取头像昵称，不会弹框
// wx.getUserInfo({
// success: res => {
// // 可以将 res 发送给后台解码出 unionId
// if (res.userInfo) {
// that.setUserInfo(res.userInfo);
// // that.userInfo = res.userInfo;
// }
// // 由于 getUserInfo 是网络请求，可能会在 Page.onLoad 之后才返回
// // 所以此处加入 callback 以防止这种情况
// if (that.userInfoReadyCallback) {
// that.userInfoReadyCallback(res => {
// that.setUserInfo(res.userInfo || {});
// // that.userInfo = res.userInfo||{};
// });
// }
// }
// });
// } else {
// that.authmodal = true;
// }
// }
// });
},
onShow() {
// 从其他小程序回来可以在当前生命周期检测到,但是这个方法，自己的小程序页面返回也会进入
......
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