首页 > 解决方案 > 如何在 Flutter 中使用 Cardview 中的 Listview?

问题描述

下面的代码是关于一个带有 Scaffold 的有状态类,它的主体中包含 Listview,它的一个子类是关于一个本身有一些子类的堆栈,我想使用 ListView 作为卡片小部件的子类,以便滚动数据表在卡片里面,但是当我在卡片视图里面使用列表视图时,脚手架中的所有东西都消失了,但是当没有列表视图时,一切都回来了,

  class DevicePageState extends State<DevicePage>{
    Widget bodyData()=>DataTable(
        columns:<DataColumn>[
          DataColumn(
            label: Text('وضعیت',style: TextStyle(color: Colors.deepPurple,fontWeight: FontWeight.bold,fontSize: 14.0),),
            numeric: false,
            onSort: (i,b){},
            tooltip: "to display first name of th e name"
          ),
          DataColumn(
              label: Text('عملکرد',style: TextStyle(color: Colors.deepPurple,fontWeight: FontWeight.bold,fontSize: 14.0),),
              numeric: false,
              onSort: (i,b){},
              tooltip: "to display Last name of th e name"
          ),
        ],
      rows: names.map((name)=>DataRow(
        cells: [
          DataCell(
          new Text(name.firstName, style: TextStyle(color: Colors.blueAccent,fontWeight: FontWeight.bold,fontSize: 12.0 ),
            ),
          showEditIcon: false,
          placeholder: false,
          ),
          DataCell(
            new Text(name.lastName,style: TextStyle(color: Colors.blueAccent,fontWeight: FontWeight.bold,fontSize: 12.0),),
            showEditIcon: false,
            placeholder: false,
          ),

        ],
      ),
      ).toList()
    ) ;


    @override
    Widget build (BuildContext){
      return new Scaffold(
      appBar:AppBar(
        title:  new Text('خانه هوشمند'),
      ),
      body:
          new ListView(
            children: <Widget>[
              new Container(
                padding: EdgeInsets.all(30.0),
                child: new Image.asset('images/acc.png'),
              ),
              new ListTile(
                title: new Text('نام دستگاه',textAlign: TextAlign.right,style: TextStyle(fontSize: 25.0),),
                subtitle:  new Text('کولر',textAlign: TextAlign.right,style: TextStyle(fontSize: 20.0),),
              ),
               new Stack(
                children: <Widget>[
                  new Container(
                    padding: EdgeInsets.all(300.0),
                    decoration:  new BoxDecoration(
                      image:DecorationImage(image: new AssetImage('images/c.PNG'),fit: BoxFit.cover),

                    ),
                  ),
                 new Card(
                   margin: EdgeInsets.only(left: 77.0,top: 128.0),
                   color: Color.fromRGBO(255, 255, 255, 0.85),
                   child:
                   new ListView(
                     children: <Widget>[
                       Container(
                         child: bodyData(),

                       ),
                     ],
                   ),
                 ),

                ],
              ),
            ],
          ),

      );

  }
  }
  class Name {
  String firstName;
  String lastName;

  Name({this.firstName,this.lastName});
}

var names = <Name>[
  Name(firstName: 'روشن',lastName: "پمپ آب"),
  Name(firstName: 'خاموش',lastName: "دور کند"),
  Name(firstName: 'روشن',lastName: "دور تند"),


];

标签: flutter

解决方案


您必须将shrinkWrapListView 的属性设置为true


推荐阅读