为什么当我把 ListView 放在抽屉里时,它有空白空间,而当它放在抽屉外面时却没有?

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

在我的 Flutter 项目中,我想构建一个文本字段来搜索用户名。我把它放在抽屉里,搜索后一切正常。我想在 ListView 中显示找到的用户名,所以我使用了 Listview.builder。
我遇到的问题是,结果列表顶部有空白空间,但只有当我将其放入抽屉时。我在没有抽屉的另一个视图中测试了它,然后没有空白空间,但是当我将其更改为位于抽屉内时,结果列表顶部有空白空间。

这是我的测试课:


class Test extends StatelessWidget {
  final List<String> entries = <String>['A', 'B', 'C'];
  final List<int> colorCodes = <int>[600, 500, 100];
  List<String> _searchResults = ["TestUser1", "TestUser2"]; // Die Liste der Suchergebnisse

  @override
  Widget build(BuildContext context) {
    return Drawer(child: ListView(
          padding: EdgeInsets.zero,
          children: [
            DrawerHeader(
              decoration: BoxDecoration(
                color: Color(0xFF2C2C2C),
              ),
              child: Column(
                crossAxisAlignment: CrossAxisAlignment.stretch,
                children: [
                  Text(
                    'Quester',
                    style: TextStyle(
                      color: Colors.white,
                      fontSize: 28,
                      fontWeight: FontWeight.bold,
                    ),
                    textAlign: TextAlign.center,
                  ),
                ],
              ),
            ),
            // Suchleiste mit Button
            Padding(
              padding: const EdgeInsets.all(8.0),
              child: Row(
                children: [
                  Expanded(
                    child: TextField(
                      controller: SearchController(),
                      style: TextStyle(color: Colors.white),
                      decoration: InputDecoration(
                        hintText: 'Benutzernamen eingeben...',
                        hintStyle: TextStyle(color: Colors.white70),
                        enabledBorder: UnderlineInputBorder(
                          borderSide: BorderSide(color: Colors.white),
                        ),
                        focusedBorder: UnderlineInputBorder(
                          borderSide: BorderSide(color: Colors.teal),
                        ),
                      ),
                      onSubmitted: (value) {
                         // Suchfunktion bei Enter auslösen
                      },
                    ),
                  ),
                  IconButton(
                    icon: Icon(Icons.search, color: Colors.white),
                    onPressed: () {
                       // Suchfunktion bei Button-Klick auslösen
                    },
                  ),
                ],
              ),
            ),
            // Dynamische Liste der Suchergebnisse
            if (_searchResults.isNotEmpty)
              Container(
                decoration: BoxDecoration(
                  color: Colors.blueGrey.withOpacity(0.8), // Hellere graue Hintergrundfarbe
                  border: Border.all(color: Colors.blueGrey), // Rahmen um die gesamte Liste
                  borderRadius: BorderRadius.circular(10),
                ),
                child: ListView.builder(
                  shrinkWrap: true,
                  itemCount: _searchResults.length,
                  itemBuilder: (context, index) {
                    return Container(
                      margin: EdgeInsets.symmetric(vertical: 4.0),
                      decoration: BoxDecoration(
                        color: Colors.blueGrey, // Hellere graue Farbe für die Listeneinträge
                        borderRadius: BorderRadius.circular(8),
                        border: Border.all(color: Colors.blueGrey), // Rahmen um jeden Eintrag
                      ),
                      child: ListTile(
                        title: Text(
                          _searchResults[index],
                          style: TextStyle(color: Colors.white),
                        ),
                        onTap: () {
                          
                        },
                      ),
                    );
                  },
                ),
              ),
            ListTile(
              leading: Icon(Icons.add, color: Colors.white),
              title: Text('Item 1', style: TextStyle(color: Colors.white)),
              onTap: () {
                // Aktion für Item 1
              },
            ),
            ListTile(
              leading: Icon(Icons.add, color: Colors.white),
              title: Text('Item 2', style: TextStyle(color: Colors.white)),
              onTap: () {
                // Aktion für Item 2
              },
            ),
            // Weitere Items hier hinzufügen
          ],
        ),
    );
  }
}

如果您将“返回抽屉...”更改为“返回脚手架...”,那么它就没有空的空间。 有什么想法吗?

android ios flutter dart
1个回答
0
投票

MediaQuery.removePadding( 上下文:上下文, 删除顶部:true, 子:ListView(), ) 试试这个

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