启动页(splash)
1.在manifest.json文件的源码视图中,打开app-plus(这里主要说uniapp项目)
2.在app-plus节点下,添加privacy
"privacy" : {
"prompt" : "template", //可取值template、custom、none
"template" : {
//prompt取值为template时有效,用于配置模板提示框上显示的内容
"title" : "服务协议和隐私政策",
"message" : " 尊敬的用户,欢迎您注册成为本应用用户,在注册前请您仔细阅读<a href='html地址'>《用户协议》</a>及<a href='html地址'>《隐私政策》</a>,了解我们对您使用我们APP制定的规则,您个人信息的处理以及申请权限的目的和使用范围。<br/> 经您确认后,本用户协议和隐私权政策即在您和本应用之间产生法律效力。请您务必在注册之前认真阅读全部服务协议内容,如有任何疑问,可向本应用客服咨询。",
"buttonAccept" : "同意",
"buttonRefuse" : "暂不使用"
}
}
引导页(guide)
官方demo https://ext.dcloud.net.cn/plugin?id=192
主要就是在页面开始不让进入tab页,而是进入一个使用swiper做好的一个页面,通过控制动画播放完毕,进入首页的方法,需要做的就是在app.vue里面对状态进行判断,如果不是第一次,就不让再进去,具体的实现页面如下
<template>
<view class="content">
<swiper :indicator-dots="true" :autoplay="true" :interval="3000" :duration="1000" class="swiper" :style="{'height':windowHeight}"
@animationfinish="animationfinish">
<swiper-item>
<view class="swiper-item" :style="{'height':windowHeight,'background-color':'red'}">A</view>
</swiper-item>
<swiper-item>
<view class="swiper-item" :style="{'height':windowHeight,'background-color':'green'}">B</view>
</swiper-item>
<swiper-item>
<view class="swiper-item" :style="{'height':windowHeight,'background-color':'pink'}">C</view>
</swiper-item>
<swiper-item>
<view class="swiper-item" :style="{'height':windowHeight,'background-color':'yellow'}">进入首页</view>
</swiper-item>
</swiper>
<text :style="{color:'red','font-weight':200}">这是一个sssH1</text>
</view>
</template>
<script>
export default {
data() {
return {
windowHeight: '603px' //定义手机屏幕高度值变量
}
},
onLoad() {
var _me = this;
uni.getSystemInfo({//获取手机屏幕高度信息,让swiper的高度和手机屏幕一样高
success: function(res) {
console.log(res.model);
console.log(res.pixelRatio);
console.log(res.windowWidth);
console.log(res.windowHeight);//这里是手机屏幕高度
console.log(res.language);
console.log(res.version);
console.log(res.platform);
_me.windowHeight = res.windowHeight + 'px';
console.log('手机屏幕高度为' + _me.windowHeight);
}
});
},
methods: {
animationfinish(e) {
console.log(JSON.stringify(e.detail.current));
//判断到最后一张后,自动转向进入首页
if (e.detail.current == 3) {
console.log('动画已经播放结束');
setTimeout(function() {
uni.redirectTo({
url: '/pages/main/main'
});
}, 1000)
}
}
}
}
</script>
<style>
.swiper {
width: 100%;
/* height: 100vw; */
/* background: red; */
}
</style>
网友评论