镜子功能发现功能

This commit is contained in:
2023-11-24 16:53:50 +08:00
parent 9051ddace1
commit 8f754aea83
35 changed files with 1796 additions and 130 deletions

161
pages/found2/index.js Normal file
View File

@@ -0,0 +1,161 @@
Page({
data: {
page : 1,
has_more: true,
lists : [],
listsIndex : 0,
share_id : '',
loading : true,
swipers : [],
playId : '',
},
onLoad(e){
this.setData({
share_id : e.share_id || ''
})
getApp().globalData.inviteText = e.invite || ''
this.getList()
},
onShow(){
},
onHide(){
if(this.data.share_id){
this.setData({
share_id:''
})
}
},
swiperChange(e){
let { current } = e.detail
console.log(current)
let swipers = this.data.swipers
let item = swipers[current]
let type = item.type
if(item.type == 'video'){
if(current == 0 || this.data.playId == '' || this.data.playId != item.id){
let id = 'myVideo'+item.id
console.log(id)
let videoContext = wx.createVideoContext(`${id}`)
videoContext.play()
this.setData({
playId:item.id
})
}
// if()
}
},
getList(){
let params = {
page:this.data.page,
share_id:this.data.share_id
}
wx.$api.found.foundIndex(params).then(res => {
let lists = this.data.lists
if(this.data.page == 1){lists = []}
lists = this.data.lists.concat(res.data.data)
if(this.data.swipers.length == 0){
this.setData({
swipers:res.data.data.splice(0,3)
})
}
this.setData({
lists : lists,
has_more: res.data.page.has_more,
})
this.setData({
loading:false
})
setTimeout(()=>{
wx.hideLoading()
wx.stopPullDownRefresh()
},3000)
}).catch(err=>{
wx.showToast({
title: err.message,
icon :'none',
mask :true,
duration:2000
})
setTimeout(()=>{
this.setData({
loading:false
})
},3000)
})
},
onPullDownRefresh(){
this.setData({
page:1,
has_more:true,
lists:[],
loading:true
})
this.getList()
},
onReachBottom(){
if(this.data.has_more){
this.setData({
page:this.data.page +1
})
this.getList()
wx.showLoading({
title: '疯狂加载中..',
})
}else{
wx.showToast({
title: '没有更多',
icon:'none',
mask:true,
duration:2000
})
}
},
// 预览图片
preImg(e){
let current = e.currentTarget.dataset.idx
console.log(current)
let urls = e.currentTarget.dataset.urls
wx.previewImage({
urls,
current:urls[current]
})
},
// 收藏
doSubscribeFavorite(e){
let index= e.currentTarget.dataset.index
let type = e.currentTarget.dataset.type
let item = this.data.lists[index]
let lists = this.data.lists
wx.$api.found.foundSubscribeFavorite(item.id,type).then(res => {
lists[index].is[`${type}`] = res.data.res
lists[index].count[`${type}`] = res.data.count
this.setData({
lists:lists
})
}).catch(err=>{
wx.showToast({
title: err.message,
icon :'none',
mask :true,
duration:2000
})
})
},
onShareAppMessage(e){
let {describe,id,share_cover}= e.target.dataset.obj
return {
title : describe,
imageUrl: share_cover,
path : "/pages/found/index?share_id=" + id + '&invite=' + wx.getStorageSync("invite")
}
},
})

9
pages/found2/index.json Normal file
View File

@@ -0,0 +1,9 @@
{
"usingComponents": {},
"navigationBarTitleText": "发现",
"navigationBarTextStyle": "white",
"navigationBarBackgroundColor": "#5283ea",
"backgroundTextStyle": "dark",
"backgroundColor": "#eeeeee",
"navigationStyle": "custom"
}

54
pages/found2/index.wxml Normal file
View File

@@ -0,0 +1,54 @@
<view class="pack-center pages-hint grey" wx:if="{{loading}}">
<image src="/static/icons/loadingGif.gif"></image>
<view>疯狂加载中</view>
</view>
<block wx:else>
<!-- <view class="found" wx:for="{{lists}}" wx:key="id"> -->
<!-- 用户 -->
<!-- <view class="avatar">
<view class="avatar-left">
<image class="cover" src="{{item.user.avatar ? item.user.avatar: '/static/imgs/userHead.png'}}" mode="aspectFill"/>
<view>{{item.user.name || '未知用户'}}</view>
</view>
<view>{{item.created_at}}</view>
</view> -->
<!-- 文字描述-->
<!-- <view class="des">{{item.describe}}</view> -->
<!-- 主图或视频 -->
<view class="cont">
<swiper class="cont-swiper" bindchange='swiperChange' vertical='{{true}}'>
<swiper-item class="cont-swiper-item" wx:for="{{swipers}}" wx:key="item">
<!-- 图片汇总 -->
<block wx:if="{{item.type == 'pictures'}}">
<swiper class="cont-image-swiper" indicator-dots="{{true}}" interval='{{1500}}' indicator-active-color="rgba(255,255,255,0.8)" indicator-color='rgba(255,255,255,0.3)'>
<swiper-item class="cont-image-swiper-item" wx:for="{{item.pictures}}" wx:key='idx' wx:for-index="idx" wx:for-item="it">
<image catch:tap="preImg" data-idx="{{idx}}" data-urls='{{item.pictures}}' wx:key="it" src="{{it}}" mode="widthFix"/>
</swiper-item>
</swiper>
</block>
<!-- 视频汇总 -->
<block wx:else>
<video class="cont-video" loop="true" enable-progress-gesture="true" object-fit="contain" id="myVideo{{item.id}}" src="{{item.video}}" />
</block>
</swiper-item>
</swiper>
</view>
<!-- 点赞 收藏 分享 -->
<!-- <view class="footer">
<view class="footer-item" catch:tap="doSubscribeFavorite" data-type='favorite' data-index='{{index}}'>
<image src="{{!item.is.favorite?'/static/imgs/icon_un_zan@2x.png':'/static/imgs/icon_zaned@2x.png'}}" mode="widthFix" />{{!item.is.favorite?'点赞':item.count.favorite}}
</view>
<view class="footer-item" catch:tap="doSubscribeFavorite" data-type='subscribe' data-index='{{index}}'>
<image src="{{!item.is.subscribe?'/static/imgs/icon_un_shou@2x.png':'/static/imgs/icon_shoued@2x.png'}}" mode="widthFix" />{{!item.is.subscribe?'收藏':item.count.subscribe}}
</view>
<button class="footer-item" open-type="share" hover-class="none" data-obj='{{item}}'>
<image style="width:28rpx;" src="/static/imgs/icon_share@2x.png" mode="widthFix" />分享
</button>
</view> -->
<!-- </view> -->
</block>

122
pages/found2/index.wxss Normal file
View File

@@ -0,0 +1,122 @@
page {
background-color: #f9f9f9;
padding-bottom: 80rpx;
}
.found{
background-color: #fff;
width: 100vw;
border-radius: 10rpx;
box-sizing: border-box;
margin-bottom: 20rpx;
}
.avatar{
display: flex;
flex-direction: row;
align-items: center;
justify-content: space-between;
box-sizing: border-box;
font-size: 28rpx;
font-family: PingFang SC;
font-weight: 400;
color: #999999;
padding: 30rpx;
}
.avatar-left {
display: flex;
flex-direction: row;
align-items: center;
justify-content:flex-start;
box-sizing: border-box;
font-size: 36rpx;
font-weight: bold;
color: #111111;
}
.avatar-left .cover{
width: 80rpx;
height: 80rpx;
border-radius: 50%;
margin-right: 30rpx;
border: solid 10rpx rgba(224, 222, 222, 0.1);
}
.des{
font-size: 30rpx;
font-family: PingFang SC;
font-weight: 400;
color: #111111;
padding: 0 30rpx 30rpx 30rpx;
}
.cont{
width: 100vw;
height: 100vh;
}
.cont-swiper{
width: 100%;
height: 100%;
}
.cont-swiper-item{
width: 100%;
height: 100%;
}
.cont-image-swiper{
width: 100%;
height: 100%;
background-color: #000;
}
.cont-image-swiper-item{
width: 100%;
height: 100%;
display: flex;
flex-direction: row;
align-items: center;
justify-content: center;
box-sizing: border-box;
}
.cont-image-swiper-item image{
width: 100%;
height: 100%;
}
.cont-video{
width: 100%;
height: 100%;
}
.footer{
border-top: solid 1rpx #eee;
font-size: 28rpx!important;
font-family: PingFang SC;
font-weight: 400!important;
color: #666666;
display: flex;
flex-direction: row;
align-items: center;
justify-content: space-around;
box-sizing: border-box;
padding: 20rpx 30rpx;
}
.footer-item{
display: flex;
flex-direction: row;
align-items: center;
justify-content: center;
box-sizing: border-box;
padding: 20rpx 20rpx;
flex: 1;
background-color: #fff!important;
}
.footer-item image{
width: 32rpx;
height: 32rpx;
margin-right: 10rpx;
}
.footer button{
font-size: 28rpx;
color: #666666;
font-weight: normal;
}
.footer button:after {
border: none;
}

199
pages/found2/index2.js Normal file
View File

@@ -0,0 +1,199 @@
// pages/found2/index2.js
var startY, endY
Page({
/**
* 页面的初始数据
*/
data: {
page : 1,
has_more: true,
lists : [],
share_id: '',
currentIndex : 0,
safeArea : getApp().globalData.safeArea,
playing : false
},
onLoad(e){
this.setData({
share_id : e.share_id || ''
})
getApp().globalData.inviteText = e.invite || ''
this.getList()
this.videoContext = wx.createVideoContext('found-cont-video')
},
onHide(){
if(this.data.share_id){
this.setData({
share_id:''
})
}
},
getList(){
let params = {
page:this.data.page,
share_id:this.data.share_id
}
wx.$api.found.foundIndex(params).then(res => {
let lists = this.data.lists
if(this.data.page == 1){lists = []}
lists = this.data.lists.concat(res.data.data)
this.setData({
lists : lists,
has_more: res.data.page.has_more,
})
if(this.data.currentIndex == 0){
this.onVideoPlay()
}
}).catch(err=>{
wx.showToast({
title: err.message,
icon :'none',
mask :true,
duration:2000
})
setTimeout(()=>{
this.setData({
loading:false
})
},3000)
})
},
onTouchStart(e) {
let { clientY } = e.changedTouches[0]
startY = clientY
},
onTouchEnd(e) {
let { clientY } = e.changedTouches[0]
endY = clientY
let clientXY = startY - clientY
console.log(clientXY)
if(clientXY>60){
this.onIsDirection('next')
}else if(clientXY < -60){
this.onIsDirection('prev')
}
},
onIsDirection(type){
let {currentIndex,lists} = this.data
if(type == 'next'){
console.log('获取下一个')
if(currentIndex!=lists.length-1){
currentIndex ++
this.setData({
currentIndex:currentIndex
})
this.onVideoPlay()
}else{
if(this.data.has_more){
this.setData({
page:this.data.page+1
})
this.getList()
}else{
wx.showToast({
title: '没有更多了~',
icon:'none',
mask:true
})
}
}
return
}
if(type == 'prev'){
if(currentIndex>0){
currentIndex --
this.setData({
currentIndex:currentIndex
})
this.onVideoPlay()
}else{
wx.showToast({
title: '没有更多了~',
icon:'none',
mask:true
})
}
return
}
},
onVideoPlay(){
if(this.data.lists[this.data.currentIndex].type == 'video'){
setTimeout(() => {
this.videoContext.seek(0)
this.videoContext.play()
this.setData({
playing:true
})
}, 200);
}else{
this.videoContext.pause()
this.videoContext.seek(0)
this.setData({
playing:false
})
}
},
onVideoPause(){
if(this.data.playing){
this.videoContext.pause()
this.setData({
playing:false
})
}else{
this.videoContext.play()
this.setData({
playing:true
})
}
},
// 预览图片
preImg(e){
let current = e.currentTarget.dataset.idx
console.log(current)
let urls = e.currentTarget.dataset.urls
wx.previewImage({
urls,
current:urls[current]
})
},
// 收藏
doSubscribeFavorite(e){
let index= e.currentTarget.dataset.index
let type = e.currentTarget.dataset.type
let item = this.data.lists[index]
let lists = this.data.lists
wx.$api.found.foundSubscribeFavorite(item.id,type).then(res => {
lists[index].is[`${type}`] = res.data.res
lists[index].count[`${type}`] = res.data.count
this.setData({
lists:lists
})
}).catch(err=>{
wx.showToast({
title: err.message,
icon :'none',
mask :true,
duration:2000
})
})
},
onShareAppMessage(e){
let {describe,id,share_cover}= e.target.dataset.obj
return {
title : describe,
imageUrl: share_cover,
path : "/pages/found/index?share_id=" + id + '&invite=' + wx.getStorageSync("invite")
}
},
})

4
pages/found2/index2.json Normal file
View File

@@ -0,0 +1,4 @@
{
"usingComponents": {},
"navigationStyle": "custom"
}

46
pages/found2/index2.wxml Normal file
View File

@@ -0,0 +1,46 @@
<view class="found" bind:touchend="onTouchEnd" bind:touchstart="onTouchStart" capture-bind:touchforcechange="onTouchForChange">
<view class="found-cont">
<video
catch:tap="onVideoPause"
wx:if="{{lists[currentIndex].type=='video'}}"
id="found-cont-video"
src="{{lists[currentIndex].video}}"
loop="{{true}}"
controls="{{false}}"
show-center-play-btn="{{true}}"
enable-play-gesture="{{true}}"
/>
<block wx:if="{{lists[currentIndex].type=='pictures'}}">
<swiper class="swiper" bindchange="nextVideo" indicator-dots="{{true}}" indicator-color="rgba(255, 255, 255, .3)" indicator-active-color="#fff">
<swiper-item class="swiper-item" wx:for="{{lists[currentIndex].pictures}}" wx:key='idx' wx:for-index="idx" wx:for-item="it">
<image src="{{it}}" mode="widthFix" />
</swiper-item>
</swiper>
</block>
<view class="zanting" catch:tap="onVideoPause" wx:if="{{!playing}}">
<image src="/static/imgs/icon-zanting.png" mode="widthFix"/>
</view>
</view>
<view class="right-cont">
<view class="right">
<image class="avatar" src="{{lists[currentIndex].user.avatar}}" mode="aspectFill" />
<view class="right-item" catch:tap="doSubscribeFavorite" data-type='favorite' data-index='{{currentIndex}}'>
<image src="{{!lists[currentIndex].is.favorite?'/static/imgs/icon_un_zan@2x.png':'/static/imgs/icon_zaned@2x.png'}}" mode="widthFix" />
<!-- {{!lists[currentIndex].is.favorite?'点赞':lists[currentIndex].count.favorite}} -->
{{lists[currentIndex].count.favorite}}
</view>
<view class="right-item" catch:tap="doSubscribeFavorite" data-type='subscribe' data-index='{{currentIndex}}'>
<image src="{{!lists[currentIndex].is.subscribe?'/static/imgs/icon_un_shou@2x.png':'/static/imgs/icon_shoued@2x.png'}}" mode="widthFix" />
<!-- {{!lists[currentIndex].is.subscribe?'收藏':lists[currentIndex].count.subscribe}} -->
{{lists[currentIndex].count.subscribe}}
</view>
<button class="right-item" open-type="share" hover-class="none" data-obj='{{lists[currentIndex]}}'>
<image style="width:40rpx;" src="/static/imgs/icon_share@2x.png" mode="widthFix" />分享
</button>
</view>
</view>
<view class="nickname" style="padding-bottom:70rpx;">
<view class="name"><span>@</span>{{lists[currentIndex].user.name}}</view>
<view class="des">{{lists[currentIndex].describe}}</view>
</view>
</view>

154
pages/found2/index2.wxss Normal file
View File

@@ -0,0 +1,154 @@
/* pages/found2/index2.wxss */
.found{
width: 100vw;
height: 100vh;
background-color: #000;
position: relative;
z-index: 1;
box-sizing: border-box;
display: flex;
flex-direction: row;
align-items: center;
justify-content: center;
box-sizing: border-box;
}
.found-cont{
width: 100%;
height: 100%;
background-color: #000;
}
.zanting{
width: 100vw;
height: 100vh;
position: absolute;
top: 0;
left: 0;
z-index: 10;
display: flex;
flex-direction: row;
align-items: center;
justify-content: center;
box-sizing: border-box;
}
.zanting image{
width: 100rpx;
height: 100rpx;
opacity: 0.6;
}
#found-cont-video{
position: relative;
width: 100%;
height: 100%;
}
.swiper{
width: 100;
height: 100%;
}
.swiper-item{
width: 100%;
height: 100%;
display: flex;
flex-direction: row;
align-items: center;
justify-content: center;
box-sizing: border-box;
color: white;
}
.swiper-item image{
width: 100%;
height: 100vw;
}
.right-cont{
display: flex;
flex-direction: column;
align-items: flex-end;
justify-content: flex-end;
box-sizing: border-box;
padding: 20rpx 30rpx 20rpx 50rpx;
position: fixed;
z-index: 3;
right: 0;
height: 100vh;
background-image: linear-gradient(to left,rgba(0, 0, 0, 0.432),rgba(248, 247, 247, 0.025));
}
.right{
font-size: 34rpx!important;
font-family: PingFang SC;
font-weight: bold!important;
color: #fff;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
box-sizing: border-box;
padding-bottom: 14vh;
}
.right .avatar{
width: 100rpx;
height: 100rpx;
border: solid 10rpx rgba(255, 255, 255, 0.2);
border-radius: 120rpx;
margin-bottom: 30rpx;
}
.right-item{
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
box-sizing: border-box;
padding: 20rpx 20rpx;
flex: 1;
}
.right-item image{
width: 46rpx;
height: 46rpx;
margin-bottom: 14rpx;
}
.right button{
font-size: 30rpx;
color: #fff;
font-weight: normal;
padding: 0 !important;
background:transparent!important;
width: 100rpx;
margin-top: 30rpx;
}
.right button:after {
border: none;
}
.nickname{
position: fixed;
z-index: 2;
width: 100%;
box-sizing: border-box;
padding: 30rpx 50rpx;
background-image: linear-gradient(to top,rgba(0, 0, 0, 0.432),rgba(248, 247, 247, 0.025));
bottom: 0;
}
.nickname .name{
font-size: 36rpx;
font-weight: bold;
color: white;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
flex-wrap: wrap;
}
.nickname .name span{
font-size: 40rpx;
}
.nickname .des{
margin-top: 20rpx;
font-size: 32rpx;
color: rgba(255, 255, 255, 0.8);
word-break:break-all;
}

91
pages/found2/swiper.js Normal file
View File

@@ -0,0 +1,91 @@
// pages/swiper.js
var startY, endY
Page({
/**
* 页面的初始数据
*/
data: {
isLoop : false,
swiperNumber : 0,
swiperArr : [],
dataArr : [
{ id: 0, type: "text", data: "0" },
{ id: 1, type: "text", data: "1" },
{ id: 2, type: "text", data: "2" },
{ id: 3, type: "text", data: "3" },
{ id: 4, type: "text", data: "4" },
{ id: 5, type: "text", data: "5" }
]
},
/**
* 生命周期函数--监听页面加载
*/
onLoad(options) {
let initData = this.data.dataArr.slice(0, 3)
this.setData({
swiperArr: initData
})
},
// 触摸开始
onStart(e){
let { clientY } = e.changedTouches[0]
startY = clientY
},
// 触摸结束
onEnd(e){
let { clientY } = e.changedTouches[0]
endY = clientY
if(startY-endY >50 || endY-startY>50){
this.onIsDirection()
}
},
// 计算前后滚动
onIsDirection(){
let { swiperArr, dataArr, swiperNumber } = this.data
if(startY > endY){
this.setData({
swiperNumber: swiperNumber += 1,
isLoop : true
})
let newNumber = swiperNumber%3 >= 2 ? 0 : swiperNumber%3 + 1
let nextNumber = swiperNumber + 1
if(nextNumber >= dataArr.length){
this.setData({
isLoop: false
})
wx.showToast({
title: '没有更多内容了~',
icon : 'none'
})
return
}
swiperArr[newNumber] = dataArr[nextNumber]
}else{
this.setData({
swiperNumber: swiperNumber > 0 ? swiperNumber -= 1: 0,
isLoop : true
})
let newNumber = swiperNumber%3 <= 0 ? 2 : swiperNumber%3 - 1
let preNumber = swiperNumber >= 0 ? swiperNumber - 1 : 0
if(preNumber < 0){
this.setData({
isLoop: false
})
wx.showToast({
title: '没有更多内容了~',
icon : 'none'
})
return
}
swiperArr[newNumber] = dataArr[preNumber]
}
this.setData({
swiperArr
})
}
})

4
pages/found2/swiper.json Normal file
View File

@@ -0,0 +1,4 @@
{
"usingComponents": {},
"disableScroll": true
}

14
pages/found2/swiper.wxml Normal file
View File

@@ -0,0 +1,14 @@
<swiper
class="swiper"
circular="{{isLoop}}"
current="{{swiperCurrent}}"
vertical
bindchange="onChange"
bindtouchstart="onStart"
bindtouchend="onEnd"
>
<swiper-item wx:if="{{swiperArr.length > 0}}" wx:for="{{swiperArr}}" wx:key="index">
<view class="swiper-text">轮播内容:{{item.data}}</view>
</swiper-item>
</swiper>

5
pages/found2/swiper.wxss Normal file
View File

@@ -0,0 +1,5 @@
.swiper{ width: 100vw; height: 100vh; background: #000011; }
.swiper-text{ color: white; width: 100vw; height: 100vh; display: flex; align-items: center; justify-content: center; }

91
pages/found2/swiper2.js Normal file
View File

@@ -0,0 +1,91 @@
// pages/index5/index5.js
Page({
/**
* 页面的初始数据
*/
data: {
viList: [{
vio: 'https://assets.mixkit.co/videos/preview/mixkit-movement-in-a-large-avenue-at-night-in-timelapse-44688-large.mp4',
avatar: 'https://profile-avatar.csdnimg.cn/6ef2193c2e9649c88356336c626e5777_m0_64944135.jpg',
name: 'xiaoshen',
id:1,
},
{
vio: 'https://sgy-test-cdn.oss-cn-hangzhou.aliyuncs.com/attachments/2023/11/17/de99704d307d216800e08584111ca61f.mp4',
avatar: ' https://profile.csdnimg.cn/7/A/9/1_2201_75886543',
name: 'kami',
id:2,
},
{
vio: 'https://sgy-test-cdn.oss-cn-hangzhou.aliyuncs.com/attachments/2023/11/17/574217650a315865ce8833c31f8d9091.mp4',
avatar: ' https://profile.csdnimg.cn/7/A/9/1_2201_75886543',
name: 'kami',
id:3
},
{
vio: 'https://sgy-test-cdn.oss-cn-hangzhou.aliyuncs.com/attachments/2023/11/16/eb8debf3c9ef26eb6829a533709c08a1.mp4',
avatar: ' https://profile.csdnimg.cn/7/A/9/1_2201_75886543',
name: 'kami',
id:4
},
{
vio: 'https://sgy-test-cdn.oss-cn-hangzhou.aliyuncs.com/attachments/2023/11/17/ecb93a818d0e507b6d1a962ab83490c9.mp4',
avatar: ' https://profile.csdnimg.cn/7/A/9/1_2201_75886543',
name: 'kami',
id:5
}
],
stopIndex:0,
},
onLoad(options) {
// 调用播放视频方法
this.startUp()
},
// 进页面时播放视频
startUp() {
// 获取video节点
let createVideoContext = wx.createVideoContext('video0')
// 播放视频
createVideoContext.play()
},
// 切换视频的时候播放视频
// 注:此方法视频如果过大可能会叠音,所以视频需要压缩,或者可以尝试循环节点关闭视频
nextVideo(e) {
// 播放当前页面视频
let index = 'video' + e.detail.current
this.setData({
stopIndex:e.detail.current
})
this.playVio(index)
// 暂停前一个页面视频
if (e.detail.current - 1 >= 0) {
let index1 = 'video' + (e.detail.current - 1)
this.pauseVio(index1)
}
// 暂停后一个页面视频
if (e.detail.current + 1 < this.data.viList.length) {
let index2 = 'video' + (e.detail.current + 1)
this.pauseVio(index2)
}
},
// 播放视频
playVio(index) {
// 获取video节点
let createVideoContext = wx.createVideoContext(index)
// 播放视频
createVideoContext.play()
},
// 暂停视频
pauseVio(index) {
// 获取video节点
let createVideoContext = wx.createVideoContext(index)
// 暂停视频
createVideoContext.seek(0)
createVideoContext.pause()
}
})

View File

@@ -0,0 +1,4 @@
{
"usingComponents": {},
"disableScroll": true
}

15
pages/found2/swiper2.wxml Normal file
View File

@@ -0,0 +1,15 @@
<swiper vertical="true" bindchange="nextVideo">
<swiper-item wx:for="{{viList}}">
<video loop="true" enable-progress-gesture="true" object-fit="contain" src="{{item.vio}}" id="video{{index}}" />
<view class="video-right">
<view class="video-right-img" style="margin-bottom: 10rpx; background-image: url({{item.avatar}})" data-user_id="{{item.id}}" bindtap="toOtherUser"></view>
点赞 评论 转发
</view>
<view class="video-btm">
<view class="video-btm-con">
<text>@{{item.name}}</text><text>\t创建时间</text>
<view>标题</view>
</view>
</view>
</swiper-item>
</swiper>

46
pages/found2/swiper2.wxss Normal file
View File

@@ -0,0 +1,46 @@
page{
background-color: #000;
}
swiper{
height: 100vh;
width: 100vw;
}
swiper video{
height: 100vh;
width: 100%;
}
.video-right{
height: 38vh;
width: 80rpx;
position: fixed;
right: 15rpx;
top: 50vh;
color: #fff;
}
.video-right-img{
height: 80rpx;
width: 80rpx;
border-radius: 100rpx;
background-color: aquamarine;
background-repeat: no-repeat;
background-position: center;
background-size: cover;
}
.video-btm{
height: 180rpx;
width: 100vw;
position: fixed;
bottom: 0;
color:#fff;
}
.video-btm-con{
width: 90vw;
margin: 0 auto;
}