Переход на страницу Android 10
Я хотел бы создать Android 10 как переход страницы в моем приложении для всех устройств (включая версии SDK ниже 29).
Я знаю, что во Flutter мы можем создавать собственные анимации перехода между страницами, но я понятия не имею, как реализовать эффект масштабирования, который есть на устройствах с Android 10.
До сих пор
import 'package:flutter/material.dart';
Route zoomTransitionRoute(Widget child) {
return PageRouteBuilder(
pageBuilder: (context, animation, secondaryAnim) {
return ScaleTransition(
scale: animation,
child: child,
);
},
transitionsBuilder: (context, animation, secondaryAnim, child) {
var begin = Offset(0.0, 0.1);
var end = Offset(0.0, 0.0);
var curve = Curves.ease;
var tween = Tween(begin: begin, end: end);
var curvedAnim = CurvedAnimation(parent: animation, curve: curve);
return SlideTransition(
position: tween.animate(curvedAnim),
child: child,
);
},
transitionDuration: Duration(milliseconds: 200));
}
Это НЕ похоже на то, что я хочу. Может кто-нибудь мне помочь?
Редактировать
Это то, чего я хочу достичь
Обратите внимание, как родительская страница немного увеличивается, тогда как дочерняя страница также увеличивается в масштабе почти .9
@yahyaparvar эй, посмотри
Ответы 2
Вы можете попробовать это page_trasition
Поскольку есть различные эффекты перехода, здесь также доступно то, что вы хотите.
Navigator.push(context, PageTransition(type: PageTransitionType.fade, child: DetailScreen()));
Также вы можете напрямую использовать переход затухания (вы можете изменить это по своему требованию). Вот так
Navigator.push( context,
PageRouteBuilder(
pageBuilder: (c, a1, a2) => Page2(),
transitionsBuilder: (c, anim, a2, child) =>
FadeTransition(opacity: anim, child: child),
transitionDuration: Duration(milliseconds:
2000),
),
);
И более подробно, проверьте это.
https://flutter.dev/docs/cookbook/animation/page-route-animation
Нет, зум-переход. Не исчезать. Это тонкий переход, при котором и родитель, и дочерний объект уменьшаются. Вы прочитали весь вопрос?
Да, именно поэтому я предлагаю библиотеку page_transition. Все переходы, которые я знаю, я предложил.
Эта ссылка page_transition показывает ошибку 404, а кулинарная книга - это то место, откуда я получил текущий код, она не объясняет, как анимировать родительскую страницу. Пожалуйста, проверьте ссылку page_transition
Я просто искал page_transition, который НЕ содержит того, что мне нужно
Я нашел способ использовать встроенный PageTransitionsTheme, чтобы решить эту проблему.
В родительском MaterialApp ,
MaterialApp(
debugShowCheckedModeBanner: false,
theme: lightTheme,
darkTheme: darkTheme,
themeMode: ThemeMode.system,
home: RegisterPage(),
);
lightTheme и darkTheme могут иметь атрибут pageTransitionsTheme,
ThemeData lightTheme = ThemeData(
//...
pageTransitionsTheme: myPageTransitionsTheme,
//...
);
И myPageTransitionsTheme инициализируется так:
PageTransitionsTheme pageTransitionsTheme = PageTransitionsTheme(builders: {
TargetPlatform.android: ZoomPageTransitionsBuilder(),
TargetPlatform.iOS: ZoomPageTransitionsBuilder()
});
Проверено на iOS и Android, работает!
Не могли бы вы показать нам пример GIF того, чего вы хотите достичь?