能否让导航仪适应孩子的大小?

问题描述 投票:1回答:1

我有一个导航仪和一张嵌套在堆栈中的地图,导航仪的孩子有一个动态的大小.只有导航仪强迫自己占据所有他能占据的空间,并覆盖在他身后的地图上,因此不可能移动地图。因此,不可能移动地图.可以让导航器适应孩子的大小吗?

class Home extends StatefulWidget {
  Home({Key key}) : super(key: key);

  @override
  _HomeState createState() => _HomeState();
}

class _HomeState extends State<Home> {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Stack(
        children: [
          StreamProvider(
            create: (context) => LocationService().locationStream,
            child: MapView()
          ),
          Positioned(
            width: MediaQuery.of(context).size.width * 1,
            bottom: 0,
            child: ConstrainedBox(
              constraints: BoxConstraints(
                maxHeight: MediaQuery.of(context).size.height * 1,
                maxWidth: MediaQuery.of(context).size.width * 1
              ),
              child: navigator(),
            )
          ),
        ],
      )
    );
  }

  navigator() {
    return Navigator(
      initialRoute: 'anyview',
      onGenerateRoute: (settings) {
        Widget view;
        switch (settings.name) {
          case 'anyview':
            view = AnyViewDraggableScrollableSheet();
            break;
          case 'otheranyview':
            view = OtherAnyViewDraggableScrollableSheet();
            break;
        }
        var builder = (BuildContext _) {
          return view;
        };
        return MaterialPageRoute(builder: builder, settings: settings);
      },
    );
  }
}

这里有一个问题的演示,导航仪占据了所有可用的空间,因此通过点击红色块来阻止它。https:/dartpad.devcd1c4d8f1067db0cc65ea2f62c2cbaad。

flutter flutter-layout
1个回答
0
投票

导航器管理着一堆路线,你可以从这些路线中推送路线到页面中,或者从其中弹出路线。如果你想在地图上方的同一页面上有一个特定的容器,我不认为导航器是正确的部件,除非你真的想在它上方有一个页面。

我建议你使用一个向上滑动的面板,可以放置在你的地图上方的页面底部,用户只需滑动它就可以使用或查看任何信息或按钮,你希望在上面播放。

如果你不希望自己创建一个,我在过去的相同情况下使用这个包已经成功了。

滑动面板包

另外,我认为使用Navigator更简单的方法是简单的 Navigator.push(context, MaterialPageRoute(builder: (BuildContext context) => MyPage())); 如果你想路由到一个与你当前所在的页面不同的页面,并且 Navigator.pop(context); 如果你想回到前一个页面。还有很多其他更具体的推送和弹出方法,你可以在详细的Flutter文档中查找。

© www.soinside.com 2019 - 2024. All rights reserved.