微软发布Flutter对于可折叠设备的支持新进展

2,050 阅读2分钟

之前,微软曾向用户展示了在 Flutter Framework 和 Engine 上打开的 PR。现在,这些PR有了一些新的进展,Engine PR 已经合并,最初的 Framework PR 被拆分成更小的 PR,并且合并了其中的一些PR。

图: Flutter 可折叠 PR 的进展

MediaQuery 支持 Display Features

Display Features 被视为是阻挡硬件功能发展的部分。比如,Surface Duo 上的hinge 就是一个 display feature。而现在,MediaQuery的PR已经合并了。

这意味着,如果你在本地Flutter设置上切换到主通道,就可以访问displayFeatures 。由于一个设备可以有多个显示功能,所以这个新属性是一个列表。下面是项目结构:

class DisplayFeature {
  final Rect bounds;
  final DisplayFeatureType type;
  final DisplayFeatureState state; 
}

使用以下代码切换到主频道:

flutter channel master

如果代码总是在过滤显示特征列表来获取hinge,可以使用如下的扩展方法:

/// Extension method that helps with working with the hinge specifically.
extension MediaQueryHinge on MediaQueryData {
  DisplayFeature? get hinge {
    for (final DisplayFeature e in displayFeatures) {
      if (e.type == DisplayFeatureType.hinge)
        return e;
    }
    return null;
  }
}

DisplayFeatureSubScreen 合并

如果只想在Surface Duo 一个屏幕上显示对话框,可以选择使用DisplayFeatureSubScreen 。这个部件主要用于模态路线,在 对话框和弹出窗口支持 PR中被大量使用。

class _MyRoute<T> extends PopupRoute<T> {
  @override
  Widget buildPage(...) {
    return DisplayFeatureSubScreen(
      child: _myPageLayout(),
      anchorPoint: Offset.infinite, 
    );
  }
}

新的设计模式

一旦使用了 Flutter 分支中的foldable_support_complete分支,就可以看到最新的样本,例如Flutter团队为双屏设备做的所有设计模式。

Surface Duo模拟器中的 Flutter 双屏

大屏幕支持

除了双屏之外,技术团队还将设计模式扩展到了大屏幕上。这意味着用户可以在桌面上运行样本,调整应用程序的大小,看看设计模式在不同场景下的表现。