一张入库核对卡在常规字号下，看起来很容易排：左侧货品说明，右侧库存数量，下面放一个“确认入库”按钮。把系统文字放大到 1.75 倍、再把折叠设备收成窄窗，真正有风险的往往不是标题，而是被挤到屏幕下沿的操作区。用户能够看完数据，却够不到确认按钮，这和文字截断一样属于功能失效。本文拿一个演示页面 LargeTypeGate 讨论这个问题。它不是根据某台真实设备录制的复现稿，而是预先固定了 412vp 宽度、1.75 字号倍率、任务 LT-1814 的构造场景，用布局规则分析怎样让卡片变高时按钮仍然可达。页面和日志配图都是生成的界面示意，未进行 DevEco 编译或无障碍实机验证。## 一、真正需要守住的，是动作而非列数项目最初可以用双列展示：左边货品信息，右边数量与操作说明。大字号让文案增加行数，双列宽度却没有跟着增长，结果可能先出现文字相互挤压，随后整个操作区被推到可视区域之外。简单把 Text 的字体缩小，确实能让截图看起来整齐，却与用户主动设置大字体的目标相矛盾。LargeTypeGate 的设计先明确三项业务信息：任务 LT-1814，待核对两项货品，当前核对项为 LOT-204，下一项为 LOT-205。确认按钮固定叫“确认入库”；完成布局判定后只显示自定义状态 STACKED_OK。这里的 OK 表示示例布局规则已经选择单列且按钮安排在独立区域，并非系统已经测得无障碍合规，也不是已提交成功。关键判断可以很朴素：在空间宽裕且字号正常时保留双列；当可用宽度不足或者字号倍率较高时，把两列改为上下排列，让每项信息得到整行宽度。为避免在临界宽度来回跳动，正式项目还应结合布局测量设置适当的滞回区间，本文先验证最小模型。## 二、配置“跟随系统”不能被页面样式偷偷抵消大字体适配不等同于给一段标题增加 fontSize。应用是否跟随系统字体、最多跟随到什么倍率，与 Text 等组件自己的上限是两层不同的控制。华为《支持适老化》文档给出了通过 AppScope/resources/base/profile/configuration.json 开启系统字体跟随并指定最大倍率的方式；文档也建议在大字体下将横向并列内容转为纵向内容以避免重叠、截断。下面先放置配置文件，解决“页面始终保持默认字号”这一入口问题。示例把应用最大跟随倍率设置为 1.75。生产项目不能只改完配置就认定适配完成，还需要检查所有页面是否能够消化变大的行高。json{ "configuration": { "fontSizeScale": "followSystem", "fontSizeMaxScale": "1.75" }}这个 JSON 应由应用的 app.json5 中 configuration 引用，不能把它误当作 ArkUI 组件属性。它只规定字体跟随策略，不会自动调整横竖布局。本文没有声称所有设备或所有 SDK 都采用同一默认值，实际需按照当前目标版本检查配置能力。需要标题在特定范围内采用更大字号时，可再为相应的 Text 设置 maxFontScale(2)，但也意味着该区域必须具备更充分的垂直伸展空间。## 三、布局判断要可解释，也要可重复接下来把选择策略写成一段纯 ArkTS 函数。业务上需要输入的是页面真正可用的宽度和用于演示判断的倍率；这两项都不是凭设备名称猜测出来的。手机展开、折叠、多窗口拖动后，同一设备都可能处于不同宽度。这里设定小于 600vp 或示例倍率不小于 1.75 时改用纵向堆叠，阈值是本 Demo 的设计选择，不是 HarmonyOS 给出的标准断点。tstype CardLayout = 'TWO_COLUMN' | 'STACKED';function chooseCardLayout(widthVp: number, fontScale: number): CardLayout { if (!Number.isFinite(widthVp) || widthVp <= 0) return 'STACKED'; if (!Number.isFinite(fontScale) || fontScale <= 0) return 'STACKED'; return widthVp < 600 || fontScale >= 1.75 ? 'STACKED' : 'TWO_COLUMN';}如果输入异常，函数宁愿退到更保守的纵向展示，也不把一个未知宽度当成宽屏处理。实战中，字数最长的商品名、提示文案与本地化版本会影响阈值；测试时应加入中文长标题、英文长词、右到左排版与极端字号，而不是把 600 当成永久正确答案。布局函数单独抽离后还可以用简单单元测试逐个喂入尺寸，避免每次都依赖肉眼查看页面。## 四、让信息滚动，而不是让确认按钮消失最容易被忽略的一步在页面结构。即使已经改为单列，内容变长后整个页面仍有可能滚动；如果把确认按钮也放进内容列表末尾，用户必须找完全部信息才能见到它。对需要先读再确认的业务，这可能合理；但入库页面希望按钮始终可见，因此本例选择上方信息区滚动、底部操作区独立布局。是否要额外消费系统安全区高度，应按窗口和容器的实际避让行为决定，不能重复手加高度。下面是核心 ArkUI 结构的示意片段。previewWidthVp 和 previewFontScale 明确是案例输入参数，不是声称它们自动读到了系统值。真实窗口可通过布局尺寸变化等官方方式获取宽度，字体倍率需从实际配置或环境读取并同步刷新。示例用这些参数把信息结构和按钮归属关系展示清楚。ts@Entry@Componentstruct ReviewPage { @State private previewWidthVp: number = 412; @State private previewFontScale: number = 1.75; @State private status: string = 'STACKED_OK'; @Builder private detailCard() { Column({ space: 10 }) { Text('任务 LT-1814').fontSize(18).maxFontScale(2) Text('当前货品 LOT-204').fontSize(16) Text('待核对 2 项').fontSize(16) }.width('100%').padding(16) } build() { Column({ space: 12 }) { Text('LargeTypeGate · 入库核对').fontSize(22).maxFontScale(2) Scroll() { Column() { if (chooseCardLayout(this.previewWidthVp, this.previewFontScale) === 'STACKED') { this.detailCard() } else { Row() { this.detailCard() } } Text(this.status) }.width('100%') }.layoutWeight(1) Button('确认入库').width('100%').height(52) }.height('100%').padding(16) }}这里的双列分支只是为了对比布局选择，实际双列页面应有两个真正的业务卡片，而不是把一个卡片装进 Row 就自称实现了双列。状态字符串也不是框架的自带布局事件。最值得注意的是 Scroll().layoutWeight(1) 与底部 Button 处于兄弟层级：信息增长优先在内容区消化，按钮保留固定的布局参与位置。组件背景、触控目标、焦点顺序和屏幕阅读器标签仍需单独验收。## 五、验收不要停在“看着没重叠”为方便手动演示，本文统一约定宽度 412vp、字体倍率 1.75、布局 STACKED、界面状态 STACKED_OK，操作按钮“确认入库”。构造日志为 [LargeTypeGate] LT-1814 width=412vp scale=1.75 和 [LargeTypeGate] LT-1814 layout=STACKED_OK action=VISIBLE。日志里的 VISIBLE 是预期检查条件，不是自动化框架的检测结论；只有在实际设备进行可见范围、可触达和辅助服务检查后，才能把它归为通过。可以给纯布局函数准备一张检查清单：412vp/1.75 必须选单列；840vp/1.00 可以选双列；840vp/1.75 仍然选单列，以免大字号内容在看似宽阔的双列里相互挤压。异常宽度也统一降级为单列。这些都是由函数静态规则直接可推导的预期结果，不是用模拟器跑出来的成绩单。在真正的 DevEco 测试中还应记录屏幕阅读器遍历顺序、窗口可见区域、键盘弹起时按钮是否被遮挡，以及前后台返回后倍率和布局是否同步。特别需要检查折叠态到展开态的连续切换：先阅读长文案再展开设备，页面不应把滚动位置硬复位到顶部；重新折叠时也不应在按钮上留下截断文字。真正的验收对象是业务流程完整可走通，不是只有一张干净的宽屏截图。## 六、把适配责任留在正确的层次全局字体跟随属于应用配置，卡片横纵切换属于布局策略，按钮始终可操作属于页面结构，系统安全区属于窗口和容器行为。四件事虽然同时影响一张页面，却不能用一个神奇参数一并解决。盲目扩大底部 padding 会浪费小屏空间；强行限制字号会破坏用户选择；只为某一台折叠设备写死宽度则会在分屏场景再次失效。LargeTypeGate 这组固定数据的目标是让讨论有一个可复查的起点：LT-1814、412vp、1.75、STACKED_OK，并要求“确认入库”停留在独立的操作区。该状态依然只是设计预期，后续需要按真机结果修正阈值、滚动布局和安全区处理。相比追求一张好看的界面，持续保住用户能看懂、能滑动、能点击的路径更有工程价值。参考资料：华为开发者文档《支持适老化》及多设备自适应应用。版本配置与组件实际支持情况以目标 SDK 和设备测试为准。