如何在 SingleChildScrollView 中实现不可滚动的列表视图

Question

我试图在这里实现一个不可滚动的 ListView 构建器，但似乎无法找到如何去做。 原因是因为我希望所有内容都是可滚动的，并且我不想在可滚动的父级中有一个 Scrollable 小部件。

class _DashboardState extends State<Dashboard> {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
        appBar: AppBar(title: Text('App Bar Here')),
        body: SingleChildScrollView(
          child: Column(
            mainAxisAlignment: MainAxisAlignment.center,
            children: <Widget>[
              Text('Hello World'),
              Container(
                child: ListView.builder(
                  itemBuilder: (context, index) {
                    return Card(
                      child: Padding(
                        padding: const EdgeInsets.all(16.0),
                        child: Column(
                          children: <Widget>[
                            Container(
                                color: Color(0xffaaaaaa),
                                height: 20,
                                child: Text('Jss One')),
                            Text(
                              'English',
                              style: TextStyle(fontSize: 20),
                            ),
                          ],
                        ),
                      ),
                    );
                  },
                  itemCount: 50,
                ),
              ),],),));
  }}

Answer 1

class _DashboardState extends State<Dashboard> {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
        appBar: AppBar(title: Text('App Bar Here')),
        body: SingleChildScrollView(
          child: Column(
            mainAxisAlignment: MainAxisAlignment.center,
            children: <Widget>[
              Text('Hello World'),
              Container(
                child: ListView.builder(
                  physics: NeverScrollablePhysics() //add this line,
                  itemBuilder: (context, index) {
                    return Card(
                      child: Padding(
                        padding: const EdgeInsets.all(16.0),
                        child: Column(
                          children: <Widget>[
                            Container(
                                color: Color(0xffaaaaaa),
                                height: 20,
                                child: Text('Jss One')),
                            Text(
                              'English',
                              style: TextStyle(fontSize: 20),
                            ),
                          ],
                        ),
                      ),
                    );
                  },
                  itemCount: 50,
                ),
              ),],),));
  }}

将物理属性设置为 NeverScrollablePhysics() 以不滚动 lisview

Answer 2

尝试使用listview物理属性

physics: NeverScrollableScrollPhysics()

希望能帮助到你..

Answer 3

我想要的解决方案。 这里发生的是 ListBuilder 小部件将构建一个不在可滚动小部件中的项目列表。 父小部件本身是可滚动的，这使得整个屏幕都可以滚动。 为此，将shrinkWrap: true和physics: NeverScrollableScrollPhysics()到ListView.builder()属性。

class _DashboardState extends State<Dashboard> {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
        appBar: AppBar(title: Text('App Bar Here')),
        body: SingleChildScrollView(
          child: Column(
            mainAxisAlignment: MainAxisAlignment.center,
            children: <Widget>[
              Text('Hello World'),
              Container(
                child: ListView.builder(
                  shrinkWrap: true, //add this line
                  physics: NeverScrollableScrollPhysics() //add this line,
                  itemBuilder: (context, index) {
                    return Card(
                      child: Padding(
                        padding: const EdgeInsets.all(16.0),
                        child: Column(
                          children: <Widget>[
                            Container(
                                color: Color(0xffaaaaaa),
                                height: 20,
                                child: Text('Jss One')),
                            Text(
                              'English',
                              style: TextStyle(fontSize: 20),
                            ),
                          ],
                        ),
                      ),
                    );
                  },
                  itemCount: 50,
                ),
              ),],),));
  }}