首页 > 解决方案 > ScrollBar 和 SingleChildScrollView 不起作用

问题描述

我正在尝试在滚动视图中显示标题和字幕列表,但滚动视图不起作用。我收到此错误:

RenderBox 未布置:RenderRepaintBoundary#d93c1 relayoutBoundary=up4 NEEDS-PAINT
'package:flutter/src/rendering/box.dart':
断言失败:第 1940 行 pos 12:'hasSize'

我的飞镖文件的完整代码:

//import 'package:flappy_search_bar/flappy_search_bar.dart';
import 'package:flappy_search_bar/flappy_search_bar.dart';
import 'package:flappy_search_bar/search_bar_style.dart';
import 'package:flutter/material.dart';
import 'body.dart';

class DefinationBody extends StatelessWidget {
  const DefinationBody({
    Key key,
  }) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(
          backgroundColor: Colors.white,
          centerTitle: true,
          leading: Padding(
            padding: EdgeInsets.only(left: 12),
            child: IconButton(
              icon: Icon(Icons.arrow_back, color: Colors.black),
              onPressed: () => Navigator.push(
                context,
                MaterialPageRoute(builder: (context) => BusinessBody()),
              ),
            ),
          ),
          title: Text(
            "Definations",
            style: TextStyle(
              color: Colors.orange[900],
            ),
          ),
        ),
        //backgroundColor: Colors.yellow,
        body: Container(
          decoration: BoxDecoration(
            image: DecorationImage(
              image: AssetImage("assets/images/main_bottom.png"),
              alignment: Alignment.bottomCenter,
              fit: BoxFit.cover,
            ),
          ),
          child: MyCardWidget(),
        ),
      ),
    );
  }
}

/// This is the stateless widget that the main application instantiates.
class MyCardWidget extends StatelessWidget {
  MyCardWidget({Key key}) : super(key: key);
  //final ScrollController _scrollController = ScrollController();

  @override
  Widget build(BuildContext context) {
    return Center(
      child: Column(
        children: [
          Container(
            alignment: Alignment.topCenter,
            child: Padding(
              padding: const EdgeInsets.only(top: 10, left: 50.0),
              child: Column(
                children: [
                  SizedBox(
                    child: Row(
                      children: [
                        Text(
                          'Definations',
                          style: TextStyle(
                            fontFamily: 'Arial',
                            fontSize: 18,
                            fontWeight: FontWeight.bold,
                            color: Colors.black,
                            height: 2,
                          ),
                          textAlign: TextAlign.center,
                        ),
                        Padding(
                          padding: EdgeInsets.symmetric(horizontal: 10.0),
                          child: Container(
                            margin: EdgeInsets.only(top: 10),
                            height: 3.0,
                            width: 200.0,
                            color: Colors.orange[900],
                          ),
                        ),
                      ],
                    ),
                  ),
                ],
              ),
            ),
          ),
          Padding(
            padding: const EdgeInsets.only(top: 20.0, left: 20, right: 20),
            child: Container(
                height: 82,
                width: double.infinity,
                decoration: BoxDecoration(
                    border: Border.all(color: Colors.orange[900]),
                    borderRadius: BorderRadius.all(Radius.circular(40))),
                // ignore: missing_required_param
                child: SearchBar(
                  searchBarStyle: SearchBarStyle(
                    backgroundColor: Colors.transparent,
                    padding: EdgeInsets.all(20),
                    borderRadius: BorderRadius.circular(40),
                  ),
                  hintText: "Search",
                  hintStyle: TextStyle(
                    color: Colors.grey[100],
                  ),
                  textStyle: TextStyle(
                    color: Colors.black,
                    fontWeight: FontWeight.bold,
                  ),
                  mainAxisSpacing: 10,
                  crossAxisSpacing: 10,
                )),
          ),
          Container(
            child: new Expanded(
              flex: 1,
            child: Scrollbar(
              isAlwaysShown: true,
                child: SingleChildScrollView(
                    child: ListView(
                      children: [
              ListTile(
                title: Text('this is title'),
                subtitle: Text('this is sub title'),
              ),
              ListTile(
                title: Text('this is title'),
                subtitle: Text('this is sub title'),
              ),
              ListTile(
                title: Text('this is title'),
                subtitle: Text('this is sub title'),
              ),
            ]
            )
            )
            )
      ),
          ),
        ],
      ),
    );
  }
}

标签: flutterscrollbarsinglechildscrollview

解决方案


我认为你ListViewSingleChildScrollView是冲突的。

SingleChildScrollView(
    child: Column(
      children: [
        ListTile(
          title: Text('this is title'),
          subtitle: Text('this is sub title'),
        ),
        ListTile(
          title: Text('this is title'),
          subtitle: Text('this is sub title'),
        ),
        ListTile(
          title: Text('this is title'),
          subtitle: Text('this is sub title'),
        ),
      ],
    ),
  ),

或者你可以设置你的身高

SingleChildScrollView(
    child: SizedBox(
      height: 200,
      child: ListView(
        children: [
          ListTile(
            title: Text('this is title'),
            subtitle: Text('this is sub title'),
          ),
          ListTile(
            title: Text('this is title'),
            subtitle: Text('this is sub title'),
          ),
          ListTile(
            title: Text('this is title'),
            subtitle: Text('this is sub title'),
          ),
        ],
      ),
    ),
  ),

推荐阅读