CODEWITHSUNDEEP
flutterlayoutrowspacing
Gunnar Eketrapp
Gunnar Eketrapp

Reputation: 2149

Why is there extra space at the end of my rows?

I have created a widget to dispay a league table but get som extra space at the end of each row.

The table is just a Column widget with a list of Row widgets.

Each row contains a list of Containers each with a fixed width.

See this picture:

enter image description here

''' child: Center( child: ClipRRect( borderRadius: BorderRadius.circular(10.0), child: Container(

            padding: EdgeInsets.all(10),
              color: Colors.red,
              child: Column(children: [
                    Row(
                      children: [
                        Container(child: Text('#', style: TextStyle(fontWeight: FontWeight.bold)), width: widths[0]),
                        Container(child: Text('Lag', style: TextStyle(fontWeight: FontWeight.bold)), width: widths[1]),
                        Container(child: Text('SP', style: TextStyle(fontWeight: FontWeight.bold)), width: widths[2]),
                        Container(child: Text('+', style: TextStyle(fontWeight: FontWeight.bold)), width: widths[3]),
                        Container(child: Text('=', style: TextStyle(fontWeight: FontWeight.bold)), width: widths[4]),
                        Container(child: Text('-', style: TextStyle(fontWeight: FontWeight.bold)), width: widths[5]),
                        Container(child: Text('PP', style: TextStyle(fontWeight: FontWeight.bold)), width: widths[6]),
                        Container(
                            child: Text(
                              'MP',
                              style: TextStyle(fontWeight: FontWeight.bold),
                              textAlign: TextAlign.right,
                            ),
                            width: widths[7]),
                      ],
                    ),
                    ...table.map((row) {
                      Widget w = Row(children: [
                        Container(child: Text('${row.pos}.'), width: widths[0], color: odd ? oddColor : evenColor),
                        Container(
                            child: Text(
                              row.name,
                              softWrap: false,
                              overflow: TextOverflow.fade,
                            ),
                            width: widths[1],
                            color: odd ? oddColor : evenColor),
                        Container(child: Text('${row.sp}'), width: widths[2], color: odd ? oddColor : evenColor),
                        Container(child: Text('${row.wins}'), width: widths[3], color: odd ? oddColor : evenColor),
                        Container(child: Text('${row.draws}'), width: widths[4], color: odd ? oddColor : evenColor),
                        Container(child: Text('${row.losses}'), width: widths[5], color: odd ? oddColor : evenColor),
                        Container(child: Text('${row.pp}'), width: widths[6], color: odd ? oddColor : evenColor),
                        Container(
                            child: Text('${row.mp.toStringAsFixed(0)}', style: TextStyle(fontWeight: FontWeight.bold), textAlign: TextAlign.right),
                            width: widths[7],
                            color: odd ? oddColor : evenColor),
                      ]);
                      odd = !odd;
                      return w;
                    }).toList()
                  ])))));

'''

Upvotes: 0

Views: 62

Answers (1)

Kamil Poniewierski
Kamil Poniewierski

Reputation: 334

Not 100% sure but try adding mainAxisSize = MainAxisSize.min to your rows, like that:

Widget w = Row(
  mainAxisSize = MainAxisSize.min,
  children: [

Upvotes: 0

Related Questions