上一篇分享了小程序案例，用第三方平台制作小程序页面操作简单，拖拽添加组件右键编辑即可。 换成“开发者工具”编写代码，对比一下区别有多大。

step1：新建项目并梳理项目结构 1.下载软件，扫码登录。 2.新建项目 - 输入项目名称 - 选择目录 - 选择AppID - 开发模式默认小程序 - 后端服务勾选不使用云服务 

3.右键删除不需要的页面

step2：配置导航栏效果 点击app.json，修改window内的参数： "window":{ "backgroundTextStyle":"light", "navigationBarBackgroundColor": "#2b3b5b", "navigationBarTitleText": "健康生活", "navigationBarTextStyle":"white" }, 完成了导航栏背景颜色，小程序头部标题的修改。

step3：配置tabBar效果 "tabBar": { "list": [{ "pagePath": "pages/home/home", "text": "首页", "iconPath": "pages/image/tab/c1.jpg", "selectedIconPath": "pages/image/tab/c3.jpg" },{ "pagePath": "pages/message/message", "text": "消息", "iconPath": "pages/image/tab/c2.jpg", "selectedIconPath": "pages/image/tab/c4.jpg" },{ "pagePath": "pages/contact/contact", "text": "我的", "iconPath": "pages/image/tab/c3.jpg", "selectedIconPath": "pages/image/tab/c6.jpg" }] },

这里仅仅设置了小程序头部和底部导航栏，就已经写了多行代码，还有轮播图，九宫格和图片布局，留待下期分享。