【问题标题】:ListTile at the bottom of the screen屏幕底部的 ListTile
【发布时间】:2022-01-07 07:19:17
【问题描述】:

我想要屏幕底部的菜单中的列表磁贴。我用一个 Sized box 完成了它,它适用于我的诺基亚 7.1,但是当我用另一部手机进行调试时,该解决方案不起作用,因为我为诺基亚定制了盒子,而不是为其他手机定制了盒子。现在我不知道我该怎么做。我尝试使用容器而不是抽屉,但它并没有解决问题。这是我的代码:

   return Drawer(
      child: ListView(
        physics: NeverScrollableScrollPhysics(),
        padding: EdgeInsets.zero,
        children: <Widget>[
          DrawerHeader(
            decoration: BoxDecoration(
              color: Colors.green,
            ),
            child: Text(
              'Menü',
              style: GoogleFonts.oswald(
                textStyle: TextStyle(
                  color: Colors.black,
                  fontSize: 45,
                )
              ),
            ),
          ),

[ListTiles] 这是我想要在底部的列表磁贴:

          // this is my first attempt:
          /*SizedBox(
            height: 410,
          ),*/

          ListTile(
          leading: Icon(Icons.arrow_back_outlined,
            color: Colors.black,
            size: 30,
          ),
          title: Text('Back',
            style: GoogleFonts.raleway(
              textStyle: TextStyle(
                color: Colors.black,
                fontSize: 30,
              )
            )
          ),
          onTap: () => Navigator.pop(context),
          ),
        ],
      ),
    );

【问题讨论】:

  • 试试我的回答here希望对你有帮助。
  • 你从那里的问题的解决方案对我不起作用
  • 创建一个完整的白屏

标签: flutter dart


【解决方案1】:

ListViewphysics: NeverScrollableScrollPhysics() 的结合来看,我认为对以下解决方案的重构也可能对您有用(为简洁起见):

Drawer(child:
  CustomScrollView(
    physics: NeverScrollableScrollPhysics(),
    slivers: <Widget>[
      SliverToBoxAdapter(child:
        Column(children: [
          DrawerHeader(decoration: BoxDecoration(color: Colors.green), child: Text('Menü')),
            // all of your list tiles
          ],
          crossAxisAlignment: CrossAxisAlignment.stretch,
        ),
      ),
      SliverFillRemaining(child:
        Align(child:
          ListTile(
            leading: Icon(Icons.arrow_back_outlined, color: Colors.black, size: 30),
            title: Text('Back'),
            onTap: () => Navigator.pop(context),
          ),
          alignment: Alignment.bottomCenter,
        ),
        hasScrollBody: false,
      )
    ],
  )
)

【讨论】:

  • 可以,但现在绿框没有菜单那么宽了。
  • 哎呀,错过了。在代码示例中,我向Column 添加了crossAxisAlignment: CrossAxisAlignment.stretch,。这样能解决吗?
猜你喜欢
  • 2012-12-10
  • 2013-07-08
  • 2013-04-29
  • 1970-01-01
  • 2021-03-20
  • 2013-08-19
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多