Скорость / длительность перехода страницы смены флаттера в теме
Как изменить продолжительность / скорость переходов, установленных в теме приложения?
Я могу изменить анимацию перехода, используя тему для 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,
);
}
}
4 ответа
Я мог бы добиться этого с помощью именованных маршрутов, которые вам нужно указать в вашем собственном экземпляре 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);
}
Создайте этот класс:
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()));
при добавлении маршрутов в маршрут onGenerate в материальном приложении он отлично работает на мобильных устройствах, но в сети флаттера он не позволяет навигацию по URL-адресам с глубокими ссылками (например, google.com/products), поэтому лучше изменить скорость в файле MaterialPageRoute(page.dart) для порхающая паутина
Лучше попробуйте обновить скорость перехода по умолчанию во флаттере. в файле MaterialPageRoute (page.dart).
Длительность get transitionDuration => const Duration (миллисекунды: 300);
Обновите эту строку. Обычно это будет 300 миллисекунд, установленных в флаттере.