首页 > 解决方案 > 为什么 Flutter CupertinoApp 的标题和下面的条子之间会有重叠,除非我将它包装在 Material 小部件中?

问题描述

这似乎是一个错误,但我想先征求反馈。在下面我的简单演示应用程序中,您可以看到 SliverChildBuilderDelegate 在哪里生成文本小部件作为 SliverList。当您向上滚动时,文本小部件与标题重叠。如果将 Text 小部件包装在 Material 小部件中,那么问题就解决了(可能是因为 Material 的裁剪能力?)。然而,混合 Material 和 Cupertino 小部件并不是最好的,特别是如果您想使用 CupertinoTheme。

任何有关正在发生的事情以及如何处理的建议都将受到赞赏。

谢谢

void main() {
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  // This widget is the root of your application.
  @override
  Widget build(BuildContext context) {
    return CupertinoApp(
      title: 'Cupertino Demo',
      home: MyHomePage(),
    );
  }
}

class MyHomePage extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return CupertinoPageScaffold(
      child: SafeArea(
        child: CustomScrollView(
          shrinkWrap: true,
          slivers: [
            CupertinoSliverNavigationBar(
              largeTitle: Text('Cupertino Demo'),
            ),
            SliverList(
              delegate: SliverChildBuilderDelegate(
                (_, index) => Material(child: Text('This is list item number $index')),
              ),
            )
          ],
        ),
      ),
    );
  }
}

标签: iosflutter

解决方案


由于 shrinkWrap:true,您可以在此处阅读更多内容: https ://github.com/flutter/flutter/issues/28197

我不明白你为什么需要它,所以只需删除它就可以了。


推荐阅读