Flutter изменить скорость / продолжительность перехода страницы в теме

Как изменить продолжительность/скорость переходов, установленных в теме приложения?

Я могу изменить анимацию перехода, используя тему для MaterialApp. В приведенном ниже примере переходы по умолчанию заменены на FadeTransition. При использовании плавного перехода он кажется медленным, и я не могу понять, как изменить продолжительность переходов, установленных в теме.

import 'package:flutter/material.dart';

void main() {
  runApp(MyApp());
}

final themeData = ThemeData(
  pageTransitionsTheme: PageTransitionsTheme(builders: {
    TargetPlatform.iOS: FadeTransitionBuilder(),
    TargetPlatform.android: FadeTransitionBuilder(),
  }),
);

class FadeTransitionBuilder extends PageTransitionsBuilder {
  @override
  Widget buildTransitions<T>(_, __, animation, ___, child) => FadeTransition(opacity: animation, child: child);
}

class MyApp extends StatefulWidget {
  @override
  _MyAppState createState() => _MyAppState();
}

class _MyAppState extends State<MyApp> with WidgetsBindingObserver {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Mobile',
      theme: themeData,
      initialRoute: '/',
      routes: routes,
    );
  }
}

ios flutter android flutter-theme flutter-animation
person Your Friend Ken    schedule 14.10.2019    source источник
comment
Похоже, что в исходном коде флаттера это жестко запрограммировано на 300 миллисекунд ????: github.com/flutter/flutter/blob/dev/packages/flutter/lib/src/   -  person Your Friend Ken    schedule 14.10.2019

Ответы (2)


arrow_upward
7
arrow_downward

Я мог бы добиться этого, используя именованные маршруты, которые вам нужно перечислить в вашем собственном экземпляре Navigator, предоставленном разработчику MaterialApp. Свойство initialRoute в MaterialApp должно быть удалено.

class _MyAppState extends State<MyApp> with WidgetsBindingObserver {

  Route<dynamic> generateRoute(RouteSettings settings) {
    switch (settings.name) {
      case '/about':
        return CustomPageRoute(
            builder: (context) => About());
      default:
        return CustomPageRoute(
            builder: (context) => Home());
    }
  }

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Mobile',
      theme: themeData,
      builder: (context, widget) {
        return Navigator(
          onGenerateRoute: generateRoute,
        );
      },
    );
  }
}

class CustomPageRoute extends MaterialPageRoute {
  @override
  Duration get transitionDuration => const Duration(milliseconds: 1000);

  CustomPageRoute({builder}) : super(builder: builder);
}
person Patrick L    schedule 21.06.2020

arrow_upward
0
arrow_downward

Создайте этот класс:

class MyRoute extends MaterialPageRoute {
  MyRoute({WidgetBuilder builder}) : super(builder: builder);

  @override
  Duration get transitionDuration => Duration(seconds: 3);
}

Теперь вместо обычного

Navigator.push(context, MaterialPageRoute(builder: (_) => Page2()));

использовать

Navigator.push(context, MyRoute(builder: (_) => Page2()));
person CopsOnRoad    schedule 09.05.2021