微信小程序 笔记1 配置
程序员文章站
2024-02-11 16:40:58
...
目录
app.json下的window
//app.json:注意json不能有注释,只是笔记
{
"pages": [
"pages/index/index",
"pages/logs/logs"
],
//window控制的是导航栏
"window": {
"backgroundTextStyle": "light",
"navigationBarBackgroundColor": "#FFCF00", //导航栏颜色(最上面的)
"navigationBarTitleText": "外卖",//导航栏标题
"navigationBarTextStyle": "black",//导航栏文字样式。要么black要么white
"navigationStyle":"custom"//隐藏导航栏,不想隐藏不加(大多数时候都不隐藏)
"backgrondColor":"pink",//下拉刷新的颜色,需要和下拉刷新配合使用
"enablePullDownRefresh":true//下拉刷新
"backgroundTextStyle":"light"//下拉刷新字体颜色
},
"sitemapLocation": "sitemap.json"
}
app.json下的tabBar
{
"pages": [
"pages/index/index",
"pages/wx/wx",
"pages/QQ/QQ",
"pages/logs/logs"
],
"window": {
"backgroundTextStyle": "light",
"navigationBarBackgroundColor": "#FFCF00",
"navigationBarTitleText": "外卖",
"navigationBarTextStyle": "black",
"enablePullDownRefresh": true,
"backgrondColor": "pink",
"backgrondTextStyle": "light"
},
"tabBar": {//可以做2-5个栏目
"color": "#000000",
"selectedColor": "#FFF",
"backgroundColor": "#FFCF00",//背景色
"borderStyle": "black",//栏目边界
"list": [
{
"pagePath": "pages/index/index",//注意:第一个必须是pages里面第一个页面
"text": "QQ",
"iconPath": "images/wx.jpg",
"selectedIconPath": "images/wx2.jpg"
},
{
"pagePath": "pages/QQ/QQ",
"text": "QQ",
"iconPath": "images/wx.jpg",
"selectedIconPath": "images/wx2.jpg"
},
{
"pagePath": "pages/QQ/QQ",
"text": "QQ",
"iconPath": "images/wx.jpg",
"selectedIconPath": "images/wx2.jpg"
},
{
"pagePath": "pages/QQ/QQ",
"text": "QQ",
"iconPath": "images/wx.jpg",
"selectedIconPath": "images/wx2.jpg"
}]
},
"sitemapLocation": "sitemap.json"
}
总结:课程资料,侵删
屏幕密度与图片尺寸
屏幕 | 型号 | 机型 | 图片大小 |
一倍屏幕 | @1x | 3gs | 44px |
二倍屏幕 | @2x | 5s,6s,7,8 | 44px*2 |
三倍屏幕 | @3x | 6+,7+,8+ | 44px*3 |
四倍屏幕 | @4x |
点击按钮的建议采用200*200px图片素材,防止图片失真,因为图片只能缩小不能放大。
图片尺寸要能被2整除,不能有小数
做的时候要以iPhone6尺寸为基准,建议两侧边距:20px,24px,30px,32px