# 如何在x2上开发小程序
| 本文档适用于雷鸟x2眼镜微信小程序开发过程中的规范与指引，微信小程序的基础开发组件与API均遵从微信开放平台小程序开发文档，本文档仅说明部分x2眼镜特性。
- 不建议在X2上基于小程序开发虚实融合的应用，限制太多
- x2通过内置微信小程序硬件框架实现兼容（ 查看详情），故并非直接兼容所有手机微信的小程序
|
| ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
## **x2基础信息**
1. 雷鸟x2眼镜为ost显示方案，更高的透过率支持屏显界面与现实世界的虚实结合；
2. 雷鸟x2眼镜的屏显分辨率为640\*480，及4:3的横屏展示；
3. x2中使用微信小程序时，需借助戒指射线进行操作，通过射线模拟屏幕触控；
4. x2中使用微信小程序，用户可通过扫码完成微信登录，但无法调用客户端相关的能力，如通讯录、分享、支付等；
## **x2微信小程序开发建议**
### **开发工具**
1. x2中微信小程序开发与常规小程序开发基本一致，兼容大部分基础组件及API，但当前暂不支持VisionKit、XR-Frame及部分开放能力，包括生物认证、分享、转发、唤起app等；
* 具体微信小程序开发指南请参考：
* 微信开发者工具下载：
2. x2中微信小程序建议设置为4：3横屏展示且默认为深色模式，在ide中可自定义屏幕显示尺寸及深色模式进行调试；
### **页面尺寸**
1. 微信小程序大屏应用文档参考（x2小程序中不允许屏幕旋转）：
2. 由于x2屏显为横屏展示，因此若应用同为4：3的横屏展示效果更佳，非横屏应用（常规手机小程序）将居中显示，效果如下：
|  |  |
| ---------------------------------------------------- | ---------------------------------------------------- |
3. 同一小程序若同时运行于眼镜端及手机端，需要通过设备形态判断页面显示尺寸，可通过以下实现：
```
// 判断当前是否为设备端拉起小程序
const isWmpf = typeof wmpf !== 'undefined'
```
### **深色模式**
1. 微信小程序深色模式文档参考：
2. 因x2屏显为ost方案，深色模式下人眼透视效率更高，更符合虚实结合场景。同时因x2为头戴显示设备，屏显色彩过于艳丽可能导致部分使用体验较差，建议开发者尽可能适配深色模式。效果如下：
|  |  |
| ---------------------------------------------------- | ---------------------------------------------------- |
### **交互规范**
1. x2中微信小程序使用，主要依赖外设戒指射线操作，模拟屏幕触控类的单击、滑动等操作； 因射线焦点限制，及射线操作非通用交互习惯，建议增加页面可触控区域间距，减少精密选择类操作流程，尽可能放大可点选热区。
2. x2微信小程序中涉及文字输入，可使用系统默认搜狗输入法，通过射线点击或语音转写的方式进行文本输入。但以上方式效率不高，建议尽可能减少应用中输入场景。
### **其他事项**
1. 基于x2整机特性，原则上建议开发者遵循横屏展示、深色模式的规范，但同样支持常规手机小程序平滑迁移至眼镜端运行，支持多数已上架常规微信小程序在眼镜端运行；
2. x2微信小程序发布流程与原生微信小程序发布保持一致，为避免体验版小程序开通体验权限等繁琐流程，建议开发者在开放平台通过审核并发布后，再通过雷鸟开放平台提交小程序审核；
## **X2小程序调试说明**
**前置条件**：小程序需先对外发布，支持正常使用
正式环境的小程序需要通过开放平台提交并测试通过后才可显示入口，故开发者开发过程若需调试，可**通过安装测试环境的launcher，从而访问测试环境的数据进行调试**，具体流程如下
1. 请将你需要调试的小程序**上架**到微信开放平台
2. 微信联系“[**雷鸟开发小助手**](https://leiniao-ibg.feishu.cn/wiki/OwFfwCpgqiEekBkSRwlcJuRPnoc#VgoPdDBLzoW7Q3xQIb8cEnxJnec)”并提供小程序app\_id、icon（144\*144 px）、名称，等待对方在测试环境配置对应数据
3. 安装以下“测试环境launcher”，从而实现访问测试环境的小程序数据
* 点击下载apk：
* 请通过adb指令安装，执行安装前，**需先通过该指令开启adb安装权限：adb shell settings put global mercury\_install\_allowed 1**
* 安装指令可以使用：adb install -d -r xxxx.apk
4. 【恢复】若要恢复原来线上launcher，可重置出场设置实现
## **X2小程序是否能直接运行XR内容？**
X2上是通过接入微信硬件框架实现小程序兼容的，而不是通过安装微信运行小程序，需要使用扫二维码进行登录
1. 支持常规类小程序运行，如阅读、游戏等类型
2. 暂不支持XR应用，该微信框架不支持XR-FRAME，同时眼镜也不兼容ARcore跟ARkit，故涉及到该部分的小程序均无法兼容
3. 小程序XR应用为vst模式，而X2眼镜为ost模式，故需要将小程序中背景画面置黑，实现ost效果，但该方式会导致虚拟物体跟现实空间位置关系错误
故X2小程序适合运行常规内容，暂不适合运行XR内容
---
# Agent Instructions: Querying This Documentation
If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.
Perform an HTTP GET request on the current page URL with the `ask` query parameter:
```
GET https://rayneo.gitbook.io/rayneo-devdoc/chang-jian-wen-ti/faq/ru-he-zai-x2-shang-kai-fa-xiao-cheng-xu.md?ask=
```
The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.
Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.