[英]Flutter SizeTransition and PageRouteBuilder not working
我正在嘗試讓我的列表項展開全屏顯示。 根據材料推薦。 PageRouterBuilder看起來很可行,SlideTransition和ScaleTransition都很好,但是SizeTransition似乎不起作用。 當我單擊列表項時,新頁面立即顯示。 我希望它會在一開始就被裁剪掉。
下面的代碼。
先謝謝您的幫助!
import 'package:flutter/material.dart';
import 'package:flutter/scheduler.dart';
void main() => runApp(new MyApp());
class MyApp extends StatelessWidget {
// This widget is the root of your application.
@override
Widget build(BuildContext context) {
timeDilation = 10.0;
return new MaterialApp(
title: 'Flutter Demo',
home: new MyHomePage(),
);
}
}
class MyHomePage extends StatelessWidget {
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: new AppBar(title: new Text("Test Expand")),
body: ListView(children: <Widget>[
new ListTile(
title: new Text("Todo 1"),
onTap: () {
_onTap(context, 1);
}),
new ListTile(
title: new Text("Todo 2"),
onTap: () {
_onTap(context, 2);
})
]),
);
}
void _onTap(BuildContext context, int i) {
Navigator.of(context).push(new PageRouteBuilder(pageBuilder:
(BuildContext context, Animation animation,
Animation secondaryAnimation) {
return TaskPage(task: i);
}, transitionsBuilder: (BuildContext context,
Animation<double> animation,
Animation<double> secondaryAnimation,
Widget child) {
return new SizeTransition(sizeFactor: animation, child: child);
}));
}
}
class TaskPage extends StatelessWidget {
final int task;
TaskPage({this.task});
@override
Widget build(BuildContext context) {
return new Scaffold(
appBar: new AppBar(title: new Text("Edit")),
body: new Text("Task " + task.toString()));
}
}
頁面的根小部件被強制填充屏幕,原因很簡單:Flutter不知道如何對齊實際上未填充屏幕的路線。
因此,為簡化起見,只需要填充即可。
為了解決這個問題,只需將您的根窗口小部件包裝到Align
:
PageRouteBuilder(
transitionsBuilder: (context, animation, __, child) {
return Align(
child: SizeTransition(
sizeFactor: animation,
child: child,
),
);
},
),
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.