慕课网-微信小程序入门与实战-常用组件API开发技巧项目实战-第4章第二个页面新闻阅读页面-全局配置与页面配置

全局配置与页面配置

1.进入目录 pages/posts，修改文件 posts.wxml（调整轮播时间）

<view>
  <swiper indicator-dots="true" autoplay="true" interval="5000">
    <swiper-item><image src="/images/wx.png"></image></swiper-item>
    <swiper-item><image src="/images/vr.png"></image></swiper-item>
    <swiper-item><image src="/images/iqiyi.png"></image></swiper-item>
  </swiper>
</view>

2.进入目录 pages/posts，修改文件 posts.wxss（调整高度）

/* pages/posts/posts.wxss */
swiper {
  width:100%;
  height:600rpx;
}

swiper image {
  width:100%;
  height:600rpx;
}

3.修改文件 app.json（调整全局颜色）

{
  "pages": [
    "pages/posts/posts",
    "pages/welcome/welcome"
  ],
  "window": {
    "navigationBarBackgroundColor": "#405f80"
  },
  "sitemapLocation": "sitemap91.json"
}

4.进入目录 pages/welcome，修改文件 welcome.json（调整局部颜色）

{
  "navigationBarBackgroundColor":"#b3d4db"
}

5.进入目录 pages/posts，修改文件 posts.json

{
  "navigationBarTitleText":"文与字"
}