iPad大屏&Flutter多引擎适配之路(详细)
💡
原文中文,约7600字,阅读约需19分钟。
📝
内容提要
本文介绍了闲鱼在iPad适配中的疑难点,包括分屏模式和分屏模式逻辑,UINavigationController改造,原生界面改造,H5界面适配和Flutter业务技术改造。多引擎共享isolate方案解决了多个Flutter视图无法同屏的问题,可应用于Android折叠屏场景。
🎯
关键要点
- 闲鱼在iPad适配中面临的主要问题包括分屏模式、UINavigationController改造、原生界面改造、H5界面适配和Flutter业务技术改造。
- 分屏模式的实现需要让iPad版本的操作逻辑与折叠屏相似,支持左右分屏展示。
- 分屏模式逻辑分为双屏比价模式和双屏导航模式,分别适用于商品对比和列表展示。
- 技术方案包括对UINavigationController的改造,以支持左右分屏而不改变原有的push/pop逻辑。
- 原生界面改造需要使用相对布局和autolayout,以适应横竖屏切换。
- H5界面适配需感知横竖屏切换事件,确保在不同屏幕上良好展示。
- Flutter业务技术改造中,界面重排时无需特别调整,监听didChangeMetrics即可。
- 多引擎共享isolate方案解决了多个Flutter视图无法同屏的问题,适用于Android折叠屏场景。
- 闲鱼的Flutter路由系统基于flutter_boost,优化了内存和数据共享,但存在引擎只能存在一个的问题。
- 轻量级多引擎方案允许多个Flutter界面共享资源,但不共享isolate,需通过共享isolate方案实现业务逻辑兼容。
- 最终目标是实现多个引擎之间的渲染隔离,同时允许内部数据访问,提升用户体验。
➡️