WeChat-MiniProgram-AR-3D 项目使用教程

1. 项目目录结构及介绍

WeChat-MiniProgram-AR-3D/
├── app.js
├── app.json
├── app.wxss
├── pages/
│   ├── index/
│   │   ├── index.js
│   │   ├── index.json
│   │   ├── index.wxml
│   │   └── index.wxss
│   └── panorama/
│       ├── panorama.js
│       ├── panorama.json
│       ├── panorama.wxml
│       └── panorama.wxss
├── utils/
│   └── util.js
├── README.md
└── LICENSE

目录结构说明

• app.js: 小程序的入口文件，包含全局逻辑代码。
• app.json: 小程序的全局配置文件，定义页面路径、窗口表现、网络超时时间等。
• app.wxss: 小程序的全局样式文件。
• pages/: 存放小程序的页面文件。
  • index/: 首页页面文件夹。
    • index.js: 首页逻辑代码。
    • index.json: 首页配置文件。
    • index.wxml: 首页结构文件。
    • index.wxss: 首页样式文件。
  • panorama/: 全景视图页面文件夹。
    • panorama.js: 全景视图逻辑代码。
    • panorama.json: 全景视图配置文件。
    • panorama.wxml: 全景视图结构文件。
    • panorama.wxss: 全景视图样式文件。
• utils/: 存放工具函数文件。
  • util.js: 工具函数文件。
• README.md: 项目说明文件。
• LICENSE: 项目许可证文件。

2. 项目启动文件介绍

app.js

app.js 是小程序的入口文件，负责初始化小程序的全局状态和逻辑。以下是 app.js 的基本结构：

App({
  onLaunch: function () {
    // 小程序启动时执行的代码
  },
  globalData: {
    // 全局数据
  }
})

app.json

app.json 是小程序的全局配置文件，定义了小程序的页面路径、窗口表现、网络超时时间等。以下是 app.json 的基本结构：

{
  "pages": [
    "pages/index/index",
    "pages/panorama/panorama"
  ],
  "window": {
    "navigationBarTitleText": "AR 3D 小程序",
    "navigationBarBackgroundColor": "#ffffff",
    "navigationBarTextStyle": "black"
  }
}

app.wxss

app.wxss 是小程序的全局样式文件，定义了小程序的全局样式。以下是 app.wxss 的基本结构：

page {
  background-color: #f8f8f8;
}

3. 项目配置文件介绍

pages/index/index.json

index.json 是首页的配置文件，定义了首页的窗口表现、导航栏样式等。以下是 index.json 的基本结构：

{
  "navigationBarTitleText": "首页",
  "enablePullDownRefresh": true
}

pages/panorama/panorama.json

panorama.json 是全景视图页面的配置文件，定义了全景视图页面的窗口表现、导航栏样式等。以下是 panorama.json 的基本结构：

{
  "navigationBarTitleText": "全景视图",
  "disableScroll": true
}

通过以上配置文件，可以灵活地调整小程序的页面表现和行为。