Text Overflowing in a Row, Flutter

Try using Expanded widget with flex value set as per the expectation of UI filling.

Sample Code:

Center(
        child: Container(
      height: 80,
      color: Colors.yellow,
      child: Row(
        mainAxisAlignment: MainAxisAlignment.start,
        children: [
          Padding(
            padding: const EdgeInsets.all(8.0),
            child: Icon(Icons.bus_alert),
          ),
          Expanded(
              flex: 1,
              child: Container(
                width: 1,
                color: Colors.green,
                child: Column(
                  children: [Text("Text 1"), Text("Text 1")],
                ),
              )),
          Expanded(
              flex: 3,
              child: Container(
                color: Colors.blue,
                child: Column(
                  mainAxisAlignment: MainAxisAlignment.spaceAround,
                  children: [
                    Text("1 World Way, Los Angeles, CA 90045, USA"),
                    Text("FLIGHT 3231"),
                  ],
                ),
              ))
        ],
      ),
    ))

Note: There is a limitation for the text content using. We need to make sure to set the height according to the expected text length.

Example


You can use Flexible or Expanded Widget You should try to below code :

Card(
        shape: RoundedRectangleBorder(
          side: BorderSide(
            color: Colors.blue,
          ),
          borderRadius: BorderRadius.circular(15.0),
        ),
        margin: EdgeInsets.all(16.0),
        child: Container(
          padding: EdgeInsets.all(8.0),
          alignment: Alignment.centerLeft,
          child: Column(
            children: [
              Row(
                crossAxisAlignment: CrossAxisAlignment.start,
                children: [
                  Icon(Icons.directions_car),
                  SizedBox(
                    width: 10,
                  ),
                  Flexible(
                    child: Column(
                      crossAxisAlignment: CrossAxisAlignment.start,
                      children: [
                        Text("Text 1"),
                        SizedBox(
                          height: 4,
                        ),
                        Text('TEXT 2'),
                      ],
                    ),
                  ),
                  SizedBox(
                    width: 27,
                  ),
                  Flexible(
                    child: Container(
                      child: Column(
                        children: [
                          Text(
                            '1 World Way, Los Angeles, CA 90045, USA',
                            textAlign: TextAlign.left,
                          ),
                          SizedBox(
                            height: 4,
                          ),
                          Text(
                            'FLIGHT 3231',
                            textAlign: TextAlign.left,
                          ),
                        ],
                      ),
                    ),
                  ),
                ],
              ),
            ],
          ),
        ),
      ),

Your screen like this : Screen Like this