Align text inside children of Row widget in flutter

Issue

I am trying to generate the legends of the chart using the Column and Row widget dynamically. The issue that I am facing is aligning the text in the next row.

You can see that because of the larger text Average and Sub-Pair the next item in the column is moving towards the right. Not sure how to align all in a specific row and colmn.

Here is the code

  Widget _buildLegends() {
    return Column(
      children: List.generate(
        sectionDataList.length,
        (index) {
          return Padding(
            padding: const EdgeInsets.all(8.0),
            child: Row(
              mainAxisAlignment: MainAxisAlignment.spaceEvenly,
              crossAxisAlignment: CrossAxisAlignment.start,
              children: [
                Text(
                  indicatorDataList[index].subText,
                  textAlign: TextAlign.left,
                ),
                Container(
                  height: 25,
                  width: 50,
                  color: indicatorDataList[index].color,
                ),
                Text(indicatorDataList[index].text),
                Text(
                  indicatorDataList[index].value.toString(),
                ),
              ],
            ),
          );
        },
      ),
    );
  }

Solution

Explicitly give width of all four column using MediaQuery.of(context).size.width

Answered By – Abhinav kumar sintoo

Answer Checked By – Pedro (FlutterFixes Volunteer)