如何解决showModalBottomSheet 中的 Flutter 导航与 isScrollControlled 冲突
我正在尝试构建一个底部对话框,其中包含一个单独的导航器,用于引导流程。
对话框应该有一个自动高度(大多大于默认的 50%),所以我启用了 isScrollControlled
。但是,当我在 Navigator
构建器中放入 showModalBottomSheet
时,默认情况下它会创建一个全高页面。
showModalBottomSheet<void>(
isScrollControlled: true,clipBehavior: Clip.antiAliasWithSaveLayer,shape: RoundedRectangleBorder(
borderRadius: BorderRadius.only(
topLeft: Radius.circular(20.0),topRight: Radius.circular(20.0),),context: context,builder: (BuildContext context) {
return new Navigator(
initialRoute: OnboardingPage.route().toString(),onGenerateRoute: (routeSettings) {
final path = routeSettings.name;
if (path == '/onboardingpage') {
return MaterialPageRoute(
settings: routeSettings,builder: (_) => OnboardingPage(),);
}
return new MaterialPageRoute(
settings: routeSettings,);
},},
OnboardingPage
是一个 StatelessWidget
Column(
mainAxisSize: MainAxisSize.min,children: [
Text("Welcome to this example onboarding"),Text("subtitle"),],);
需要导航器,因为对话框应该有多个页面,用户可以在其中导航。可以设置 height 属性,但我同时想要一个动态高度和一个导航器。我错过了什么吗?
解决方法
如果您的登机屏幕有脚手架,请将其移除,因为您不需要它。在您的登机屏幕中,将您的专栏包裹在一个容器中,并使用 MediaQuery 为其指定一个动态高度。
Contaner(
height: MediaQuery.of(context).size.height * 0.50,//50% of the screen.
child:
Column(
children:[
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。