防止滚动的英雄在应用栏顶部跳跃

Question

我有一个REngine.SetEnvironmentVariables("C:\\Program Files\\R\\R-3.2.3\\bin\\i386"); 可以滚动，以便它的一部分在屏幕外。当我触发转换时，它似乎突然跳到Hero之上，然后在转换反转时跳回到它之下。如何强制AppBar保持在AppBar？

之上

Hero

Answer 1

将import 'package:flutter/material.dart'; void main() { runApp(new MaterialApp( home: new Example(), theme: new ThemeData(primaryColor: Colors.orange), debugShowCheckedModeBanner: false, )); } Widget positionHeroOverlay(BuildContext context, Widget overlay, Rect rect, Size size) { final RelativeRect offsets = new RelativeRect.fromSize(rect, size); return new Positioned( top: offsets.top, right: offsets.right, bottom: offsets.bottom, left: offsets.left, child: overlay, ); } class LogoPageRoute extends MaterialPageRoute<Null> { LogoPageRoute(this.colors) : super( builder: (BuildContext context) { return new Scaffold( appBar: new AppBar( title: new Text('Flutter Logo'), ), body: new ConstrainedBox( constraints: new BoxConstraints.expand(), child: new Hero( tag: colors, child: new FlutterLogo(colors: colors), ), ), ); }, ); /// The color of logo to display final MaterialColor colors; @override final Duration transitionDuration = const Duration(seconds: 1); } final List<MaterialColor> swatches = [ Colors.blue, Colors.orange, Colors.green, ]; class Example extends StatelessWidget { @override Widget build(BuildContext context) { return new Scaffold( appBar: new AppBar( title: new Text('All Logos'), ), body: new ListView( children: swatches.map((MaterialColor colors) { return new InkWell( onTap: () { Navigator.push(context, new LogoPageRoute(colors)); }, child: new Hero( tag: colors, child: new FlutterLogo(size: 360.0, colors: colors), ), ); }).toList(), ), ); } } 换成AppBar以迫使其保持最佳状态。

Hero

对于详细信息页面的 appBar: new PreferredSize( child: new Hero( tag: AppBar, child: new AppBar( title: new Text('All Logos'), ), ), preferredSize: new AppBar().preferredSize, ), ，我建议强制显示后退按钮，以便在页面标题更改的同时显示。

AppBar

这就是它的样子：