小程序目录结构为:
├─ app.json // 窗口相关配置
├─ index.html // 小程序页面
└─ assets // 资源目录
├─ css // 样式表
├─ img // 图片
└─ js // js目录
注:小程序里面所有内部跳转的页面均需要是本地html格式的页面。
360小程序代码构成
使用360浏览器的开发者模式,能够直接在一个空文件夹下创建一个小程序Demo,可以通过此Demo查看小程序的代码结构。
360小程序代码由4种基础文件构成:
app.json——小程序全局配置
app.json是当前小程序的全局配置,目前已提供为小程序配置窗口相关内容的能力。Demo项目里边的app.json配置内容如下:
{
"window": {
"enableLargeWindow": false,
"showRefreshButton": false,
"windowWidth": 1138,
"windowHeight": 640,
"minWindowWidth": 400,
"minWindowHeight": 400,
"enableResize": true
}
}
字段内容解释如下:
| 属性 | 类型 | 说明 | 默认值 | 是否必填 |
|---|---|---|---|---|
| enableLargeWindow | boolean | 是否全部页面支持切换至大窗口,支持则在窗口顶部显示切换按钮 | false | 是 |
| showRefreshButton | boolean | 是否显示刷新按钮,false为不显示,true为显示 | false | 是 |
| windowWidth | number | 默认大窗口的尺寸-宽度 | 1138 | 是 |
| windowHeight | number | 默认大窗口的尺寸-高度 | 640 | 是 |
| minWindowWidth | number | 大窗口最小尺寸-宽度 | 400 | 是 |
| minWindowHeight | number | 大窗口最小尺寸-高度 | 400 | 是 |
| enableResize | boolean | 是否支持用户手动拖动窗口边线改变窗口大小 | true | 是 |
目前,360小程序采用标准HTML、CSS、JS开发,和网页编程一样:使用HTML定义网页的内容使用CSS规定网页的布局使用JavaScript对网页行为进行编程
开发者可使用新版本360安全浏览器(10.1.1889.0及以上版本)体验下方的小程序Demo