微信小程序开发
简介:
一套软件的应用架构包括数据层、业务逻辑层、服务层、控制层、展示层、用户等多个层次。
主配置文件app.json:
主配置文件app.json位于项目主目录中,用来对当前项目进行全局配置。
代码示例如下:
{
"pages": [
"pages/index/index",
"pages/new/new",
],
"window": {
"backgroundcolor": "#f6f6f6",
"backgroundtextstyle": "light",
"navigationbarbackgroundcolor": "#f6f6f6",
"navigationbartitletext": "我的第一个小程序",
"navigationbartextstyle": "black"
}
}上面代码中有两个页面,这是一个json对象,其中的属性pages用来定义小程序的页面,上面代码中表示有两个页面,一个名为”index”,位于“pages/index”下,另一个名为new,位于“page/new”下。
位于pages数组中的第一项表示小程序的初始页面,即启动小程序时将运行显示的页面。如果继续添加页面可以往pages数组中添加即可。
配置状态:
backgroundcolor:用来设置窗口的背景色,与html中的颜色设置相同,使用十六进制的rgb方式设置颜色。默认为白色。
backgroundtextstyle:用来设置下拉背景字体、loading图的样式,有“dark”、“light”这两个值。
enablepulldownrefresh:用来设置是否开启下拉刷新,默认false。
navigationbarbackgroundcolor:用来设置导航栏背景颜色。
navigationbartextstyle:设置导航栏标题颜色。
navigationbartitletext:设置导航栏标题的文字内容。
配置底部导航:
"tabbar": {
"list": [
{
"pagepath": "pages/index/index",
"text": "首页",
"iconpath": "images/icon_home.png",
"selectediconpath": "images/icon_homeed.png",
"lang":"pagepath显示的页面,text文本,iconpath未激活的图标,selectediconpath激活的图标"
},
{
"pagepath": "pages/new/new",
"text": "广场",
"iconpath": "images/icon_guangchang.png",
"selectediconpath": "images/icon_guangchanged.png",
"lang":"pagepath显示的页面,text文本,iconpath未激活的图标,selectediconpath激活的图标"
},
{
"pagepath": "pages/userconsole/userconsole",
"text": "设置",
"iconpath": "images/icon_set.png",
"selectediconpath": "images/icon_seted.png",
"lang":"pagepath显示的页面,text文本,iconpath未激活的图标,selectediconpath激活的图标"
}]
}tabbar为底部导航,上面的代码中有三个底部导航
color:设置tab未激活状态的文字颜色。
selectedcolor:设置tab激活状态的文字颜色。
borderstyle:设置底部导航边框。
backgroundcolor:设置底部导航背景颜色。
list:这是一个数,设置底部导航个数,最少2个,最多5个。
text:设置导航文字。
pagepath显示的页面,text文本,iconpath未激活的图标,selectediconpath激活的图标。
以上就是微信小程序开发底部导航的详细内容,更多请关注代码网其它相关文章!
发表评论