应用盒子 App 小程序开发文档

开发自己小程序需要的文件及简易demo(myapp)。

$ npx @react-native-community/cli@latest init MyApp
$ cd MyAp
$ npx yarn add react-native-svg react-native-video
$ npx yarn add babel-plugin-module-resolver --dev

babel.config.js tsconfig.json 为处理短路径用 ~/ 和 :/
metro.config.json 为处理模块ID用，默认为 数字ID，改为 md5(path).md5(content+dependencies)
bundle.py 为打包小程序用，请修改ASSET_SERVER_PREFIX和asset_server_map和folder_map以及文件尾部的 rsync 文件同步命令行。打包命令： python3 bundle.py 或 python3 bundle.py myapp 或 python3 bundle.py {appId}
index.js 请不要修改
Container.tsx 为 AppBox 核心文件空实现

启动小程序链接格式：appbox://launch?appId={appId}&assetServer={assetServer}#!fragment #!后面是传递给小程序的参数export default ({fragment}) => {}，没有连#!也不用写

将小程序设置为默认小程序链接格式：appbox//startup?appId={appId}&assetServer={assetServer}

将小程序添加到【简易启动器】链接格式：appbox://launch?appId=b633ce51-26cb-fcef-d350-98947349f6c3&assetServer=https://appbox.duonan.eu.org/b633ce51-26cb-fcef-d350-98947349f6c3#!appId={appId}&assetServer={assetServer}&name=小程序名称&icon=图标URL

【简易启动器】启动小程序后可以用

const {
 launcher = "simple-launcher",
 isActive: boolean,
 isInMultiWindowMode = true,
 isInPictureInPictureMode: boolean,
 isInBackground: boolean,
 setWindowStyle({left, top, right, bottom, width, height} | undefined) {},
 setInBackground(boolean) {},
 launchApp(appId, assetServer, args = {}, multiOpen = false) {},
 quit() {}
} = useContainerContext()
quit 退出小程序
setWindowStyle({...}) 为进入 pictureInPicture 模式， setWindowStyle(undefined) 为退出 pictureInPicture 模式
launchApp 启动其他小程序，multiOpen 要注意数据冲突。

如需将其他小程序放入自己的小程序内，可以使用Loader

<Loader
 appId={"其他小程序appId"}
 assetServer={"其他小程序assetServer"}
 containerProps={useContainerContext拿到的数据}
 appProps={传递给其他小程序的参数}
/>

其他小程序：index.tsx

export default ({其他小程序传递过来的数据}) => {}