如何删除Flutter中DataTable的复选框图标？

odopli94 于 2023-01-14 发布在 Flutter

关注(0)|答案(5)|浏览(174)

我正在实现一个DataTable来显示一些数据，为此我使用了一个PaginatedDataTable，这样我就可以加载和显示我的数据，问题是我的DataTable每行显示一个CheckBox，我不想要它。
这是我目前的结果：

我想删除这些复选框，但不知道如何操作。

- 代码：**

ExpensesDataSource _expensesDataSource = ExpensesDataSource([expense]);

    Widget getDataTable() {
      return PaginatedDataTable(
        header: Text('Despesas', style: TextStyle(color: Color(0xFF4C4C4C), fontWeight: FontWeight.bold, fontSize: 15),),
        columns: <DataColumn>[
          DataColumn(
            label: Text("Data"),
            numeric: false,
          ),
          DataColumn(
            label: Text("Descrição"),
            numeric: false,
          ),
          DataColumn(
            label: Text("Total"),
            numeric: false,
          ),
        ],
        source: _expensesDataSource,
      );
  }

class ExpensesDataSource extends DataTableSource {

  List<Expense> _expenses = <Expense>[];
  int _selectedCount = 0;

  ExpensesDataSource(List<Expense> listExpenses) {
      this._expenses = listExpenses;
  }

  @override
  DataRow getRow(int index) {
    final Expense expense = _expenses[index];
    return DataRow.byIndex(
        index: index,
        onSelectChanged: (bool value) {
          print('Row selected: $value ${expense.name}');
        },
        cells: [
          DataCell(Text(expense.date)),
          DataCell(Text(expense.name)),
          DataCell(Text(Utils.convert2currency(expense.total_amount)))
        ]
    );
  }

  @override
  // TODO: implement rowCount
  int get rowCount => _expenses.length;

  @override
  bool get isRowCountApproximate => false;

  @override
  int get selectedRowCount => _selectedCount;

}

flutter

来源：https://stackoverflow.com/questions/54669526/how-to-remove-checkbox-icon-of-datatable-in-flutter

5条答案

按热度按时间

t5fffqht1#

- 更新**

现在可在稳定频道。
如果您在主通道上而不是在稳定通道上，这是可能的。
您只需向DataTable添加一个属性，即showCheckboxColumn为false。
您的完整代码编辑后将是

@override
Widget build(BuildContext context) {
return Scaffold(
    appBar: AppBar(
        title: Text(
          "Sample",
          style: TextStyle(color: Colors.white),
        ),
    body: Column(children: <Widget>[
      DataTable(
        showCheckboxColumn: false,
        sortAscending: true,
        columns: <DataColumn>[
          DataColumn(
            label: Text('Product name'),
          ),
          DataColumn(
            label: Text('Product Quantity'),
          ),
        ],
        rows: items
            .map(
              (itemRow) => DataRow(
                onSelectChanged: (bool selected) {
                  if (selected) {
                    //'row-selected: ${itemRow.index}'
                  }
                },
                cells: [
                  DataCell(
                    Text(itemRow.itemName),
                    showEditIcon: false,
                    placeholder: false,
                  ),
                  DataCell(
                    Text(itemRow.itemQuantity),
                    showEditIcon: true,
                    placeholder: false,
                    //onTap: _getSelectedRowInfo,
                  ),
                ],
              ),
            )
            .toList(),
      )
    ]),
    bottomNavigationBar: BottomNavigationBar(
      items: const <BottomNavigationBarItem>[
        BottomNavigationBarItem(
          icon: Icon(Icons.home),
          title: Text('Home'),
        ),
      ],
      currentIndex: _selectedIndex,
      selectedItemColor: Colors.amber[800],
      onTap: _onItemTapped,
    ));
  }
}

有些flutter开发人员不建议更改master，但如果您没有问题，可以使用以下命令更改：x1米2英寸x1米3英寸

赞(0）回复(0）举报 2023-01-14

wko9yo5t2#

当前只能通过省略onSelectionChange: ...或传递null而不是

onSelectChanged: (bool value) {
      print('Row selected: $value ${expense.name}');
    },

https://docs.flutter.io/flutter/material/DataRow/onSelectChanged.html

赞(0）回复(0）举报 2023-01-14

but5z9lq3#

我删除了DataRow.byIndex()中的这两个selected:和onSelectChanged:，复选框消失了。

赞(0）回复(0）举报 2023-01-14

ekqde3dh4#

从DataRow中删除onSelectChanged和selected属性，并将其添加到每个数据单元格。

DataCell(
    Text(
       employee.lastName.toUpperCase(),
    ),
    onTap: () {
      print("Tapped " + employee.firstName);
      // do whatever you want
    },
),

赞(0）回复(0）举报 2023-01-14

q8l4jmvw5#

您只需向DataTable添加一个属性，即showCheckboxColumn，即可使其为false。
编辑后的完整代码将是：

@override
Widget build(BuildContext context) {
return Scaffold(
    appBar: AppBar(
        title: Text(
          "Sample",
          style: TextStyle(color: Colors.white),
        ),
    body: Column(children: <Widget>[
      DataTable(
        showCheckboxColumn: false,
        sortAscending: true,
        columns: <DataColumn>[
          DataColumn(
            label: Text('Product name'),
          ),
          DataColumn(
            label: Text('Product Quantity'),
          ),
        ],
        rows: items
            .map(
              (itemRow) => DataRow(
                onSelectChanged: (bool selected) {
                  if (selected) {
                    //'row-selected: ${itemRow.index}'
                  }
                },
                cells: [
                  DataCell(
                    Text(itemRow.itemName),
                    showEditIcon: false,
                    placeholder: false,
                  ),
                  DataCell(
                    Text(itemRow.itemQuantity),
                    showEditIcon: true,
                    placeholder: false,
                    //onTap: _getSelectedRowInfo,
                  ),
                ],
              ),
            )
            .toList(),
      )
    ]),
    bottomNavigationBar: BottomNavigationBar(
      items: const <BottomNavigationBarItem>[
        BottomNavigationBarItem(
          icon: Icon(Icons.home),
          title: Text('Home'),
        ),
      ],
      currentIndex: _selectedIndex,
      selectedItemColor: Colors.amber[800],
      onTap: _onItemTapped,
    ));
  }
}

赞(0）回复(0）举报 2023-01-14

我来回答

如何删除Flutter中DataTable的复选框图标？

5条答案

相关问题

热门标签

最新问答