刷题小程序【程序猿面试宝典】开发（二）| 页面创建、页面配置、全局配置

"pages": [
    "pages/index/index",
    "pages/study/study",
    "pages/mine/mine"
  ]

"tabBar": {
    "color": "",  //tab 上的文字默认颜色，仅支持十六进制颜色
    "selectedColor": "",   //tab 上的文字选中时的颜色，仅支持十六进制颜色
    "list": [
      {
      "pagePath": "",  //页面路径，必须在 pages 中先定义
      "text": "",  //tab 上按钮文字
      "iconPath": "",  //图片路径
      "selectedIconPath": ""  //选中时的图片路径
    }
  ]
  }

"tabBar": {
    "color": "#969799",  
    "selectedColor": "#EC4434",   
    "list": [
      {
      "pagePath": "pages/index/index",  
      "text": "首页",  
      "iconPath": "images/icon/index.png",  
      "selectedIconPath": "images/icon/index-selected.png" 
    },
    {
      "pagePath": "pages/study/study",  
      "text": "刷题",  
      "iconPath": "images/icon/study.png",  
      "selectedIconPath": "images/icon/study-selected.png" 
    },
    {
      "pagePath": "pages/mine/mine",  
      "text": "我的",  
      "iconPath": "images/icon/mine.png",  
      "selectedIconPath": "images/icon/mine-selected.png" 
    }
   ]
  }

"window": {
    "backgroundTextStyle": "light",
    "navigationBarBackgroundColor": "#EC4434",
    "navigationBarTitleText": "首页",
    "navigationBarTextStyle": "white"
  }

 /*  ------自定义样式开始 ------   */

  /* 
   颜色样式：
   1. 主题：--themeColor
   2. 背景：--backgroundColor
   3. 字体：--fontColor
   4. 页面： --pageColor
   */
   --themeColor: #EC4434;
   --backgroundColor: #FFFFFF;
   --fontColor1: #FFFFFF;
   --fontColor2: #646566;
   --pageColor: rgba(240, 243, 246, 1);

    /* 
  边框样式：
  1.边框宽度：--borderWidth
  2.边框圆角：--borderRadius
  */
  --borderWidth: 3rpx;
  --borderRadius: 20rpx;
 
   /* 
   字体大小：
   1. 一级标题：--h1
   2. 二级标题：--h2
   3. 默认：--defaultFontSize
   */
   --h1: 26rpx;
   --h2: 25rpx;
   --defaultFontSize: 24rpx;

 
   /*
     margin:
     1. --marginTop
     2. --marginLeft
   */
   --marginTop: 30rpx;
   --marginRight: 30rpx;
   --marginLeft: 30rpx;
   --marginBottom: 30rpx;
   /* 
     padding:
     1. --paddingTop
     2. --paddingLeft
     3. --paddingRight
     4. --paddingBottom
   */
   --paddingTop: 30rpx;
   --paddingRight: 30rpx;
   --paddingBottom: 30rpx;
   --paddingLeft: 30rpx;
 
   /*
     container容器宽度
     containerWidth:
   */
   --containerWidth: 710rpx;

    /*  ------自定义样式结束 ------   */

<view class="font-style"></view>

/*  ------自定义class开始 ------   */


 /*
每个页面最外部样式类
*/
.container {
  width: var(--containerWidth);
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}

.common_flex {
  display: flex;
  flex-direction: column;
  /*默认*/
  justify-content: center;
  align-items: center;
  box-sizing: border-box;
  flex-wrap: wrap;
}


/*  
公众view样式 
 */
.common-view {
  width: 100%;
  background-color: var(--backgroundColor);
  border-radius: var(--borderRadius);
  box-sizing: border-box;
}

.common-margin-top {
  margin-top: var(--marginTop);
}
.common-margin-right {
  margin-right: var(--marginRight);
}
.common-margin-left {
  margin-left: var(--marginLeft);
}
.common-margin-bottom {
  margin-bottom: var(--marginBottom);
}
.common-padding {
  padding: var(--paddingTop) var(--paddingRight) var(--paddingBottom) var(--paddingLeft);
}
.common-padding-top {
  padding-top: var(--paddingTop);
}
.common-padding-right {
  padding-right: var(--paddingRight);
}
.common-padding-left {
  padding-left: var(--paddingLeft);
}
.common-padding-bottom {
  padding-bottom: var(--paddingBottom);
}

 /*  ------自定义class结束 ------   */

background-color: var(--pageColor);