準備工作
14-46-45.jpg
- 創建my頁面（基礎工作不在復述，參照上一篇）；
- 創建圖片文件夾images，及子目錄tabBar；
- 前往http://iconfont.cn，下載任意兩個icon及對應的高亮顏色版，60px，保存到tabBar目錄下；
改變下導航欄
14-55-40.jpg
在app.json中添加window相關配置項：
注意：json中是不能加注釋的，這里注釋只是為了說明，請自行刪除
"window":{
"navigationBarTitleText":"小程序學習筆記", //導航欄標題
"navigationBarTextStyle":"black", //標題顏色，默認black，可選white
"navigationBarBackgroundColor":"#eee", //導航欄背景色，默認#000
//下面影響的是下拉刷新的部分，還沒研究出怎么實現
"backroundColor":"#555", //窗口背景色，默認#fff
"backroundTextStyle":"dark", //下拉字體樣式，默認dark，可選light
"enablePullDownRefresh": true //是否支持下拉刷新，默認false
}
寫個tabBar吧
15-07-57.jpg
tabBar最少2個，最多5個tab
在app.json中添加tabBar配置項：
"tabBar":{
"color":"#999", //字體顏色，必填
"selectedColor":"#56abe4", //選中狀態字體顏色，必填
"backroundColor":"#fff", //背景色，必填
"borderStyle":"white", //上邊框顏色，非必填，默認black，可選white
//list數組，為每一個tab的配置，必填。tab排序與數組排序一致
"list":[
{
"pagePath":"pages/index/index", //頁面路徑
"iconPath":"images/tabBar/article.png", //icon路徑
"selectedIconPath":"images/tabBar/articleHL.png", //選中狀態icon路徑
"text":"筆記" //文字
},
{
"pagePath":"pages/my/my",
"iconPath":"images/tabBar/my.png",
"selectedIconPath":"images/tabBar/myHL.png",
"text":"我的"
}
]
}
page的json
15-19-35.jpg
page也是支持json文件的，不過只能配置window相關的，因此無需寫window這個鍵
例如，在my.json添加下面代碼，改變了標題欄文本為“我的”，而不是“小程序學習筆記”。
{
"navigationBarTitleText":"我的"
}
json配置項里還剩下networkTimeOut 和 debug，以后用到再說吧
