在点击persistent bottom bar中的按钮时实施route need to be restored,之前的bottom bar。
单击底栏中的按钮时,将保存其当前路径路径(/a/b/c),并根据按钮单击恢复以前保存的路径。
从概念上讲,用户会将每个按钮视为工作空间,其状态永远不会丢失(包括后台堆栈)。用户可以安全地从一个工作区切换到另一个工作区。
当路由为rewinding to root?
时,如何在Flutter中获取当前路径路径答案 0 :(得分:6)
NavigatorState
不会公开用于获取当前路径路径的API,Route
也不会公开用于确定路径路径的API。路线可以(通常是)匿名的。您现在可以使用isCurrent
方法查看给定的Route
是否位于导航器堆栈的顶部,但这对您的用例来说不是很方便。
我建议您对此问题采取不同的方法,并且根本不回溯到根目录。相反,请为Navigator
的每个窗格使用不同的BottomNavigationBar
窗口小部件。这样,在窗格之间切换时,您不必倒回堆栈。您可以将Navigator
小部件包装在Opacity
和IgnorePointer
小部件中,以便在不破坏其堆栈时隐藏它们。
import 'package:flutter/material.dart';
void main() {
runApp(new MyApp());
}
class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return new MaterialApp(
home: new MyHomePage(),
);
}
}
class SecurePage extends StatelessWidget {
final int index;
SecurePage(this.index);
Widget build(BuildContext context) {
return new Material(
color: Colors.amber,
child: new InkWell(
child: new Center(
child: new Icon(
Icons.security,
color: Colors.white,
size: index * 100.0 + 20.0,
),
),
onTap: () {
Navigator.of(context).push(
new MaterialPageRoute(
builder: (BuildContext context) {
return new SecurePage(index + 1);
},
),
);
},
),
);
}
}
class VerifiedPage extends StatelessWidget {
final int index;
VerifiedPage(this.index);
Widget build(BuildContext context) {
return new Material(
color: Colors.green,
child: new InkWell(
child: new Center(
child: new Icon(
Icons.verified_user,
color: Colors.white,
size: index * 100.0 + 20.0,
),
),
onTap: () {
Navigator.of(context).push(
new MaterialPageRoute(
builder: (BuildContext context) {
return new VerifiedPage(index + 1);
},
),
);
},
),
);
}
}
class MyHomePage extends StatefulWidget {
@override
State createState() => new MyHomePageState();
}
class MyHomePageState extends State<MyHomePage> {
int _page = 0;
List<Widget> initialWidgets = <Widget>[
new SecurePage(0),
new VerifiedPage(0),
];
Widget build(BuildContext context) {
return new Scaffold(
body: new Stack(
children: new List<Widget>.generate(initialWidgets.length, (int index) {
return new IgnorePointer(
ignoring: index != _page,
child: new Opacity(
opacity: _page == index ? 1.0 : 0.0,
child: new Navigator(
onGenerateRoute: (RouteSettings settings) {
return new MaterialPageRoute(
builder: (_) => initialWidgets[index],
);
},
),
),
);
}),
),
bottomNavigationBar: new BottomNavigationBar(
currentIndex: _page,
onTap: (int index) {
setState(() {
_page = index;
});
},
items: <BottomNavigationBarItem>[
new BottomNavigationBarItem(
icon: new Icon(Icons.security),
title: new Text('Secure'),
),
new BottomNavigationBarItem(
icon: new Icon(Icons.verified_user),
title: new Text('Verified'),
),
],
),
);
}
}
答案 1 :(得分:4)
主要出于存档目的而发布此答案,但是正如@ikben所述,获取当前路线及其所有属性的一种方法是ModalRoute.of(context)
。这将返回一个ModalRoute
,尽管其名称正确,但它适用于大多数Navigator.push
呼叫,而不仅是showDialog
。有用的属性包括Route.settings
,Route.navigator
和Route.isFirst
。
答案 2 :(得分:2)
这应该给您确切的路线名称
import 'package:path/path.dart';
ModalRoute.of(context).settings.name
答案 3 :(得分:1)
要获取当前路线名称示例/ home或/ page,请尝试
ModalRoute.of(context).settings.name
答案 4 :(得分:0)
我找到了一个更简单的解决方案。我喜欢 StatelessWidget 的所以我用静态来做,但你可以用 StatefulWidget 来做。如果您有分层导航,您将需要一个 StatefulWidget。这是我的 NavDrawer 中的一个磁贴。 (静态的名声不好,但在 UI 中还不错,只有一个进程在运行单个线程。)
class NavListTile extends StatelessWidget {
static String currentRoute = 'dashboard';
final String route;
const NavListTile({
Key? key,
required this.route,
}) : super(key: key);
@override
Widget build(BuildContext context) {
var isCurrent = currentRoute == route;
String suffix = isCurrent ? '_green' : '';
return ListTile(
title: NavMenuItem(capitalizedRoute, isCurrent,
"assets/images/" + route + suffix + ".png", context),
onTap: () {
currentRoute = route;
Navigator.of(context).pushNamed('/' + route);
},
);
}
}
答案 5 :(得分:0)
如果您想通过使用导航键获取当前路线,可以使用 popUntil 方法:
String? currentPath;
navigatorKey.currentState?.popUntil((route) {
currentPath = route.settings.name;
return true;
});