启动页逻辑相关

app.json

@@ -1,5 +1,6 @@
 {
   "pages": [
+    "pages/start/start",
     "pages/index/index",
     "pages/mine/mine",
     "pages/association/association",

pages/start/start.js

@@ -0,0 +1,103 @@
+// pages/start/start.js
+Page({
+
+  /**
+   * 页面的初始数据
+   */
+  data: {
+    countDownNum: 5
+  },
+
+  /**
+   * 生命周期函数--监听页面加载
+   */
+  onLoad: function (options) {
+    this.settime()
+    this.countDown()
+  },
+
+  countDown: function () {
+    let that = this;
+    let countDownNum = that.data.countDownNum;//获取倒计时初始值
+    //如果将定时器设置在外面，那么用户就看不到countDownNum的数值动态变化，所以要把定时器存进data里面
+    that.setData({
+      timer: setInterval(function () {//这里把setInterval赋值给变量名为timer的变量
+        //每隔一秒countDownNum就减一，实现同步
+        countDownNum--;
+        //然后把countDownNum存进data，好让用户知道时间在倒计着
+        that.setData({
+          countDownNum: countDownNum
+        })
+        //在倒计时还未到0时，这中间可以做其他的事情，按项目需求来
+        if (countDownNum == 0) {
+          //这里特别要注意，计时器是始终一直在走的，如果你的时间为0，那么就要关掉定时器！不然相当耗性能
+          //因为timer是存在data里面的，所以在关掉时，也要在data里取出后再关闭
+          clearInterval(that.data.timer);
+          //关闭定时器之后，可作其他处理codes go here
+        }
+      }, 1000)
+    })
+  },
+
+  settime: function () {
+    let that = this
+    setTimeout(function () {
+      wx.switchTab({
+        url: `../index/index`
+      })
+    }, 5000)
+  },
+  bindGetUserInfo: function (e) {
+    wx.switchTab({
+      url: `../index/index`
+    })
+  },
+  /**
+   * 生命周期函数--监听页面初次渲染完成
+   */
+  onReady: function () {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面显示
+   */
+  onShow: function () {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面隐藏
+   */
+  onHide: function () {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面卸载
+   */
+  onUnload: function () {
+
+  },
+
+  /**
+   * 页面相关事件处理函数--监听用户下拉动作
+   */
+  onPullDownRefresh: function () {
+
+  },
+
+  /**
+   * 页面上拉触底事件的处理函数
+   */
+  onReachBottom: function () {
+
+  },
+
+  /**
+   * 用户点击右上角分享
+   */
+  onShareAppMessage: function () {
+
+  }
+})

pages/start/start.json

@@ -0,0 +1,6 @@
+{
+  "navigationBarTitleText": "精致锦水",
+  "navigationStyle": "custom",
+  "navigationBarTextStyle": "black",
+  "usingComponents": {}
+}

pages/start/start.wxml

@@ -0,0 +1,17 @@
+<view class="page">
+    <image class="image-one" src="../../images/start_bg.png" mode="scaleToFill"></image>
+    <view class="logo-style">
+        <image class="image-two" src="../../images/start_logo.png" mode="scaleToFill"></image>
+    </view>
+
+    <view class="time">
+        <view class="time-info" bindtap="bindGetUserInfo">
+            <view class="left">
+                {{countDownNum}}s
+            </view>
+            <view class="right">
+                跳过
+            </view>
+        </view>
+    </view>
+</view>

pages/start/start.wxss

@@ -0,0 +1,67 @@
+.page {
+    width: 100%;
+    height: 100%;
+    position: relative;
+
+
+    top: 0;
+    left: 0;
+    z-index: 1000;
+}
+
+.image-one {
+    position: absolute;
+    width: 100%;
+    height: 100%
+}
+
+.logo-style {
+    width: 100%;
+    height: 220rpx;
+    margin-top: 455rpx;
+    position: absolute;
+    display: flex;
+    justify-content: center;
+}
+
+.logo-style .image-two {
+    height: 220rpx;
+    width: 500rpx;
+}
+
+.time {
+    margin-top: 170rpx;
+    position: absolute;
+    width: calc(100% - 28rpx);
+    height: 60rpx;
+    display: flex;
+    flex-direction: row-reverse;
+    align-items: center;
+}
+
+.time .time-info {
+    width: 150rpx;
+    height: 60rpx;
+    border-radius: 30rpx;
+    background: #fff;
+    opacity: 0.6;
+    display: flex;
+    align-items: center;
+}
+
+.time .time-info .left {
+    width: 50%;
+    height: 40rpx;
+    line-height: 40rpx;
+    font-size: 30rpx;
+    text-align: center;
+    border-right: 1rpx solid black;
+}
+
+.time .time-info .right {
+    width: 50%;
+    height: 40rpx;
+    line-height: 40rpx;
+    font-size: 25rpx;
+    text-align: center;
+}