【问题标题】:The SingleChildScrollView is not scrollableSingleChildScrollView 不可滚动
【发布时间】:2019-12-28 10:38:23
【问题描述】:

这个小部件除了不可滚动之外没有任何错误呈现

SingleChildScrollView(
    child: Column(
      children: [
        ListView(
          shrinkWrap: true,
          children: [
            ListTile(
              title: Row(
                children: const [
                    Expanded(child: Text('text'),),
                    Expanded(child: Text('text'),),
                ],
              ),
            ),
          ],
        ),
        RapportList(), // this is not scrollable
      ],
    ),
),

RapportList() 是一个有状态的小部件,它构建一个

ListView.builder(
  shrinkWrap: true,
  itemCount: _rapports.length,
  itemBuilder: (context, index) {
    return ListTile(
      title: Row(
        children: <Widget>[
        ...

我试图用SingleChildScrollView 包裹ListView.builder,但没有结果。它仍然不能滚动。

【问题讨论】:

    标签: flutter


    【解决方案1】:

    我想你只需要添加

    physics: const NeverScrollableScrollPhysics(),

    到您的 RapportList()。

    这是我测试的代码:

    import 'package:flutter/material.dart';
    
    void main() => runApp(MyApp());
    
    class MyApp extends StatelessWidget {
      @override
      Widget build(BuildContext context) {
        return MaterialApp(
          title: 'Flutter Demo',
          theme: ThemeData(
            primarySwatch: Colors.blue,
          ),
          home: MyHomePage(title: 'Flutter Demo Home Page'),
        );
      }
    }
    
    class MyHomePage extends StatefulWidget {
      MyHomePage({Key key, this.title}) : super(key: key);
      final String title;
      @override
      _MyHomePageState createState() => _MyHomePageState();
    }
    
    class _MyHomePageState extends State<MyHomePage> {
    
      @override
      Widget build(BuildContext context) {
        return Scaffold(
          appBar: AppBar(
            title: Text(widget.title),
          ),
          body: SingleChildScrollView(
            child: Column(
              children: <Widget>[
                ListView(
                  shrinkWrap: true,
                  children: <Widget>[
                    ListTile(
                      title: Row(
                        children: const <Widget>[
                          Expanded(child: Text('text'),),
                          Expanded(child: Text('text'),),
                        ],
                      ),
                    ),
                  ],
                ),
                ListView.builder( //<--RapportList().
                  physics: const NeverScrollableScrollPhysics(), //<--here
                  shrinkWrap: true,
                  itemCount: 100,
                  itemBuilder: (context, index){
                    return ListTile(
                      title: Row(
                        children: <Widget>[
                          Text("ListTile with index ${index}")
                        ],
                      ),
                    );
                  },
                ),
              ],
            ),
          ),
        );
      }
    }
    

    这样,RapportList() 将无法滚动,当您尝试“滚动”其中一个元素时,您将滚动整个 SingleChildScrollView() ;)

    【讨论】:

      【解决方案2】:
      @override
        Widget build(BuildContext context) {
          // TODO: implement build
          return Scaffold(body:  SingleChildScrollView(
          child: Column(
            children: <Widget>[
              ListView(
                shrinkWrap: true,
                children: <Widget>[
                  ListTile(
                    title: Row(
                      children: const <Widget>[
                          Expanded(child: Text('text'),),
                          Expanded(child: Text('text'),),
                      ],
                    ),
                  ),
                ],
              ),
              SizedBox(height: 6000,),
              Text("...."),
              Container(
              ),
            ],
          ),
      )
          );  
        }
      }
      
      

      【讨论】:

      • 你能编辑你的答案并解释为什么你的解决方案应该有效吗?
      猜你喜欢
      • 1970-01-01
      • 1970-01-01
      • 2020-11-05
      • 1970-01-01
      • 2021-05-07
      • 2022-07-12
      • 2021-10-28
      • 1970-01-01
      • 1970-01-01
      相关资源
      最近更新 更多