Pad & 折叠屏适配

涂鸦小程序运行在 Pad 与折叠屏设备上时,可能出现显示异常、无法操控等问题。完成 Pad 与折叠屏适配后,可保证小程序在此类设备上有良好的使用效果。

Info

折叠屏会根据屏幕宽度判断是否按 Pad 处理。若您已体验到 Pad 适配相关能力,则表示当前设备已进入适配态。

版本要求

  • App 基线版本:iOS / Android >=7.7.0,鸿蒙 >=1.0.24

适配方法

1. 开启 App 平板适配

在涂鸦开发者平台 → App 开发 → 功能配置 → App 高级功能中,开启「适配平板」功能。

2. 区分 iOS 与 Android

系统操作说明
iOS无需额外操作
Android需在 App 设置中开启「平板横屏切换」开关

3. 配置 largeScreenDisplayMode

在小程序的 src/global.config.ts 中配置 largeScreenDisplayMode 字段:

取值效果小程序侧要求效果示意备注
contained 或未配置内容居中,左右留白(按 9:16)无需额外处理—
fullscreen全屏铺满需自行适配全屏样式按屏幕宽度做样式适配:宽 >=600 且 <920 时字号 +2px,宽 >=920 时字号 +4px;其余尺寸将 rpx 按 1rpx = 0.5px 转为 px(原 px 保持不变);less / css / scss 用 @media,模板内联与 JS/TSX 动态 style 用运行时宽度分支
export default {
  largeScreenDisplayMode: 'contained',
};

4. 完成适配

完成以上配置后,即可在 Pad 与折叠屏设备上正常使用小程序。