颤动如何使用文本字段搜索的结果使容器扩展

问题描述

我试图制作一个像自定义搜索结果页面这样的下拉菜单，但它失败了，并出现了一些错误，例如 RenderFlex 子项具有非零 flex 但传入的高度约束是无界的。有没有什么办法可以不用打包解决？？当我删除单个子滚动视图时，除了滚动之外的所有内容都在工作，但有什么方法可以实现可滚动？

列表页面

import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';

class ListPage extends StatefulWidget {
  @override
  _ListPageState createState() => _ListPageState();
}

class _ListPageState extends State<ListPage> {
  List<Map<String,String>> studentList = [
    {"John Honai": "Tokio"},{"John Wick": "Cuba"}
  ];
  bool showList = false;

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: SingleChildScrollView(
        child: Column(
          children: [
            SizedBox(
              height: 20,),Container(
              height: 50,child: Text("container1 height 50"),color: Colors.lightBlue,SizedBox(
              height: 20,child: Text("container2 height 50"),color: Colors.orangeAccent,ButtonSearchExpanded(
              onChangedText: (_) {
                setState(() {
                  showList = true;
                });
              },showList: showList,studentList: studentList,child: Text("container3 height 50"),color: Colors.white54,child: Text("container4 height 50"),color: Colors.cyanAccent,],);
  }
}

小工具页面 已更改响应的文本字段传递到列表页面并传回将 studentList 显示为 true 以显示列表视图。

import 'package:flutter/material.dart';

class ButtonSearchExpanded extends StatelessWidget {
  final List<Map<String,String>> studentList;
  final bool showList;
final Function onChangedText;
  ButtonSearchExpanded(
      {
      this.onChangedText,this.studentList,this.showList});
  @override
  Widget build(BuildContext context) {
    return Expanded(
        child: Container(
      child: Column(
        children: [
          Container(
            height: 60,child: Row(
              children: [Expanded(child:
               TextField(onChanged: onChangedText,)),Text("some other content"),showList?Expanded(child: ListView.builder(itemCount:studentList.length,itemBuilder: (context,index){
            return ListTile(title: Text(studentList[index].keys.first),trailing: Text(studentList[index].values.first),);
          })):Container()
        ],));
  }


}

解决方法

您是否尝试添加此行 shrinkWrap: true, ？

ListView.builder(
shrinkwrap:true,// add this line 
itemBuilder: (context,index){
            return 

,

根据我的研究，column->expanded->listviewbuilder 相互矛盾是不可能的，因为列缩小了它的子级而扩展了扩展了子级，所以我将其更改为具有属性 flexfit.loose 和列属性主轴的灵活size min，因此它解决了问题。我从 How to use Expanded in SingleChildScrollView?

得到了这个答案

  final List<Map<String,String>> studentList;
  final bool showList;
final Function onChangedText;
  ButtonSearchExpanded(
      {
      this.onChangedText,this.studentList,this.showList});
  @override
  Widget build(BuildContext context) {
    return Column(mainAxisSize: MainAxisSize.min,children: [
        Container(
          height: 60,child: Row(
            children: [
             Expanded(child: TextField(onChanged: onChangedText,)),Text("some other content"),],),showList?Flexible(fit: FlexFit.loose,child: ListView.builder(shrinkWrap: true,itemCount: studentList.length,itemBuilder: (context,index){
          return ListTile(title: Text(studentList[index].keys.first),trailing: Text(studentList[index].values.first),);
        })):Container()
      ],);
  }


}