Flutter - 如何隐藏或设置表格行可见？

Question

我正在使用 Flutter Table 小部件。我希望根据特定条件隐藏表格行之一。

我已经在 Tablerow 上尝试了可见性小部件，但它不允许。我也试过 bool 条件，例如。 bool ？ Tablerow(...) : Tablerow()，它似乎工作不正常，因为它给出了 null 异常 - 可能 Tablerow 是空的。

child: Table(
          border: TableBorder.all(width: 1.0, color: Colors.black),
          children: [

            TableRow(
              children: [
                TableCell(
                    child: Row(
                        children: <Widget>[
                          new Padding(
                            padding: const EdgeInsets.all(5.0),
                            child: new Text('ID1'),
                          ),
                        ]
                    )
                ),

                TableCell(
                    child: Row(
                        children: <Widget>[
                          new Padding(
                            padding: const EdgeInsets.all(5.0),
                            child: new Text('Name1'),
                          ),
                        ]
                    )
                )
              ]
            ),

            TableRow(
                children: [
                  TableCell(
                      child: Row(
                          children: <Widget>[
                            new Padding(
                              padding: const EdgeInsets.all(5.0),
                              child: new Text('ID2'),
                            ),
                          ]
                      )
                  ),

                  TableCell(
                      child: Row(
                          children: <Widget>[
                            new Padding(
                              padding: const EdgeInsets.all(5.0),
                              child: new Text('Name2'),
                            ),
                          ]
                      )
                  )
                ]
            ),


            TableRow(
                children: [
                  TableCell(
                      child: Row(
                          children: <Widget>[
                            new Padding(
                              padding: const EdgeInsets.all(5.0),
                              child: new Text('ID3'),
                            ),
                          ]
                      )
                  ),

                  TableCell(
                      child: Row(
                          children: <Widget>[
                            new Padding(
                              padding: const EdgeInsets.all(5.0),
                              child: new Text('Name3'),
                            ),
                          ]
                      )
                  )
                ]
            ),

          ],
        )

更新:

bool_row ? TableRow(
                children: [
                  TableCell(
                      child: Row(
                          children: <Widget>[
                            new Padding(
                              padding: const EdgeInsets.all(5.0),
                              child: new Text('ID2'),
                            ),
                          ]
                      )
                  ),

                  TableCell(
                      child: Row(
                          children: <Widget>[
                            new Padding(
                              padding: const EdgeInsets.all(5.0),
                              child: new Text('Name2'),
                            ),
                          ]
                      )
                  )
                ]
            ) : TableRow(),

使用 bool 方法，bool_row 为假，第二个条件“TableRow()”抛出错误:
: 在 null 上调用了方法“any”。
:接收者:空
:尝试调用:any(Closure: (Widget) => bool)

我不知道如何生成一个空的不可见 TableRow。

根据上面的代码，如果我想隐藏或将第二行设置为不可见。我怎样才能实现它？

提前致谢!

Answer 1

您可以执行以下操作，以编程方式隐藏和显示表格行，其中我们采用“visibilityTableRow” bool 变量，并基于此我们决定是否在表格单元格中传递某些内容:

import 'package:flutter/material.dart';

class MyTable extends StatefulWidget {
  createState() {
    return StateKeeper();
  }
}

class StateKeeper extends State<MyTable> {

  bool visibilityTableRow = true;

  void _changed() {
    setState(() {
      if(visibilityTableRow){
        visibilityTableRow = false;
      }else{
        visibilityTableRow = true;
      }
    });
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      primary: true,
      appBar: AppBar(
        title: Text("Table View"),
      ),

      body: Column(
        children: <Widget>[

          Table(
            border: TableBorder.all(width: 1.0, color: Colors.black),
            children: [

              TableRow(
                  children: [
                    TableCell(
                        child: Row(
                            children: <Widget>[
                              new Padding(
                                padding: const EdgeInsets.all(5.0),
                                child: new Text('ID1'),
                              ),
                            ]
                        )
                    ),

                    TableCell(
                        child: Row(
                            children: <Widget>[
                              new Padding(
                                padding: const EdgeInsets.all(5.0),
                                child: new Text('Name1'),
                              ),
                            ]
                        )
                    )
                  ]
              ),

              visibilityTableRow ? TableRow(
                  children: [
                    TableCell(
                        child: Row(
                            children: <Widget>[
                              new Padding(
                                padding: const EdgeInsets.all(5.0),
                                child: new Text('ID2'),
                              ),
                            ]
                        )
                    ),

                    TableCell(
                        child: Row(
                            children: <Widget>[
                              new Padding(
                                padding: const EdgeInsets.all(5.0),
                                child: new Text('Name2'),
                              ),
                            ]
                        )
                    )
                  ]
              ): new TableRow(
                  children: [
                    TableCell(
                        child: Row(
                            children: <Widget>[
                              new Container(),
                            ]
                        )
                    ),

                    TableCell(
                        child: Row(
                            children: <Widget>[
                              new Container(),
                            ]
                        )
                    )
                  ]
              ),


              TableRow(
                  children: [
                    TableCell(
                        child: Row(
                            children: <Widget>[
                              new Padding(
                                padding: const EdgeInsets.all(5.0),
                                child: new Text('ID3'),
                              ),
                            ]
                        )
                    ),

                    TableCell(
                        child: Row(
                            children: <Widget>[
                              new Padding(
                                padding: const EdgeInsets.all(5.0),
                                child: new Text('Name3'),
                              ),
                            ]
                        )
                    )
                  ]
              ),

            ],
          ),


          RaisedButton(
            child: Text("Hide/Show Table Row"),
            onPressed: () => _changed(),
          ),
        ],
      )
    );
  }
}