Всплывающие маршруты с поддержкой петли flutter

Когда приложение развернуто на Surface Duo, диалоговые окна отображаются на первом экране, который является левым экраном для конфигураций слева направо. Необязательный параметр anchorPointshowDialog метода позволяет переопределить это поведение. По умолчанию всплывающие меню не позволяют использовать петли. Если в коде есть пользовательские модальные маршруты, их можно упаковать с помощью DisplayFeatureSubScreen , чтобы избежать перекрытия петли.

По умолчанию это диалоговое окно отображается на левом экране для конфигураций слева направо и на правом экране для конфигураций справа налево:

showDialog(
    context: context,
    builder: (_) => AlertDialog(
        title: Text("Hinge Aware Dialog"),
        content: Text("Going on the left screen"),
    ),
);

Диалоговое окно Flutter Surface Duo на левом экране

Мы можем принудительно открыть диалоговое окно на правом экране с помощью anchorPoint параметра . Эта функция похожа на целевой объект, который можно использовать для выбора нужного экрана:

showDialog(
    context: context,
    builder: (_) => AlertDialog(
        title: Text("Hinge Aware Dialog"),
        content: Text("Going on the right screen"),
    ),
    anchorPoint: Offset(1000, 1000),
);

Диалоговое окно Flutter Surface Duo на правом экране

Пользовательские маршруты

В приложении могут быть собственные классы модальных или всплывающих маршрутов, которые необходимо сделать с учетом петли. Используйте мини-приложение DisplayFeatureSubScreen для переноса модального маршрута. Добавьте его в верхнюю часть макета маршрута, чтобы избежать петли. Это мини-приложение также принимает anchorPoint параметр:

class _MyRoute<T> extends PopupRoute<T> {
    @override
    Widget buildPage(BuildContext context, Animation<double> animation, Animation<double> secondaryAnimation) {
        return DisplayFeatureSubScreen(
            child: _myPageLayout(), // the previous content of buildPage
            anchorPoint: Offset.infinite,
        );
    }
}