How do I set a Flutter TableRow in a Table to behave the way Expanded() behaves in a Column?

1.4k Views Asked by At

I have a Table in Flutter and I want to have it expand it's row so that the table takes up the full space that's available for it. Given that TableRow isn't a widget I can't use Expanded on it the way I would for Widgets in a Column. Is there another way to get similar behavior for a Table?

2

There are 2 best solutions below

0
On

According to my information, you need to use the Row and Columns widgets instead of the Table widget and in addition to using the Expanded widget, or you will need to set a specific height for each row separately and it cannot be Flexible, Using Container in TableRow children

0
On
Table(
      columnWidths: const {
        0: IntrinsicColumnWidth(),
        1: FixedColumnWidth(12),
        2: FlexColumnWidth()
      },
      defaultVerticalAlignment: TableCellVerticalAlignment.bottom,
      children: [
        ...textMap.entries.mapIndexed(
          (index, entry) => TableRow(
            children: [
              Padding(
                padding: EdgeInsets.only(top: index == 0 ? 0 : 12),
                child: Text(
                  entry.key.text,
                  style: TextStyle(
                      fontSize: 15,
                      color: appColors.textColor,
                      fontWeight: FontWeight.w500,
                      fontFamily: entry.key.fontFamily),
                ),
              ),
              const SizedBox(),
              Padding(
                padding: EdgeInsets.only(top: index == 0 ? 0 : 12),
                child: Text(
                  entry.value.text,
                  style: TextStyle(
                    fontSize: 16,
                    color: appColors.textColor,
                    fontWeight: FontWeight.w400,
                    fontFamily: entry.value.fontFamily,
                  ),
                ),
              ),
            ],
          ),
        ),
      ],
    )