是否可以使导航抽屉始终在Flutter中打开?

时间:2019-08-22 02:15:00

标签: flutter

我希望抽屉始终在屏幕中打开,以便用户不必从左向右滑动屏幕。我发现了很多与此问题有关的问题,但在Dart / Flutter中找不到。

这是@aziza提供的有关如何更改脚手架内容的解决方案。用户单击“抽屉”时显示正文内容,但我希望它始终打开。

Flutter Drawer小部件-更改Scaffold.body内容

Flutter Drawer Widget - change Scaffold.body content

2 个答案:

答案 0 :(得分:2)

您可以尝试以下方法:

import 'package:flutter/material.dart';

class SideMenuScreen extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('Screen'),
      ),
      body: Column(
        children: <Widget>[
          Expanded(
            child: Row(
              mainAxisSize: MainAxisSize.max,
              crossAxisAlignment: CrossAxisAlignment.stretch,
              children: <Widget>[
                Flexible(
                  child: ListView(
                    children: <Widget>[
                      ListTile(title: Text("Menu A")),
                      ListTile(title: Text("Menu B")),
                      ListTile(title: Text("Menu C")),
                      ListTile(title: Text("Menu D")),
                      ListTile(title: Text("Menu E")),
                      ListTile(title: Text("Menu F")),
                      ListTile(title: Text("Menu G")),
                      ListTile(title: Text("Menu H")),
                      ListTile(title: Text("Menu I")),
                      ListTile(title: Text("Menu J")),
                      ListTile(title: Text("Menu K")),
                      ListTile(title: Text("Menu L")),
                      ListTile(title: Text("Menu M")),
                    ],
                  ),
                ),
                Expanded(
                  child: Container(
                    child: Center(child: Text('Content')),
                    color: Colors.black26,
                  ),
                ),
              ],
            ),
          ),
        ],
      ),
    );
  }
}

演示

我们可以通过PageView改进互动性:Github Repo

Flexible(
  child: StaticDrawer(),
),
Expanded(
  child: PageView(
    children: <Widget>[
      MainContent(),
      MainContent(),
      MainContent(),
    ],
  ),
),

稍后您会发现这个..

enter image description here

答案 1 :(得分:0)

我认为我的包裹适合您的需求。我最初是为桌面 Flutter 应用程序设计的,但决定用它制作一个包。

https://pub.dev/packages/side_navigation

在自述文件中,您还可以找到一个示例和一些要展示的图片。

干杯!