我想让我的列表项扩展全屏。根据材料建议。 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()));
}
}
答案 0 :(得分:3)
页面的根窗口小部件被迫填充屏幕,原因很简单:Flutter不知道如何对齐实际上未填充屏幕的路线。
因此,为简化起见,只需强制填充即可。
要解决此问题,只需将您的根窗口小部件包装到Align
中:
PageRouteBuilder(
transitionsBuilder: (context, animation, __, child) {
return Align(
child: SizeTransition(
sizeFactor: animation,
child: child,
),
);
},
),