Flutter Align the widget onto the top in ROW

2,146

You need to set crossAxisAlignment as CrossAxisAlignment.start

Row(
  mainAxisAlignment: MainAxisAlignment.spaceBetween,
  crossAxisAlignment: CrossAxisAlignment.start,
  children: mainBodyList,
);
Share:
2,146
Anas Reza
Author by

Anas Reza

Updated on December 22, 2022

Comments

  • Anas Reza
    Anas Reza over 1 year

    I have an issue in ROW that one child has many items so it is large and another child has fewer items so its height is small so the less item is showing in the center of the ROW, so I need it to align to the top inside the ROW, you can have a look at the image.

    enter image description here

    Please have a look at my code as well.

    rowList = Row(
      mainAxisAlignment: MainAxisAlignment.spaceBetween,
      children: mainBodyList,
    );
    

    MAIN BODY LIST

      Container(
       width: screenWidth * 0.49,
       child: Card(
        color: Colors.white,
        child: Column(
          children: <Widget>[
            Container(
              //width: 200,
              padding: EdgeInsets.symmetric(vertical: 8, horizontal: 8),
              decoration: BoxDecoration(
                color: Colors.black12,
              ),
              child: Row(
                children: <Widget>[
                  ClipOval(
                    child: Material(
                      color: Colors.white,
                      child: SizedBox(
                        width: 40,
                        height: 40,
                        child:
                            /*Image.asset(
                                            'assets/icons/doc_icon.png'),*/
                            Icon(
                          Icons.playlist_add_check,
                          color: AppTheme.primaryColor,
                        ),
                      ),
                    ),
                  ),
                  Flexible(
                    child: Padding(
                      padding: const EdgeInsets.all(8.0),
                      child: Column(
                        crossAxisAlignment: CrossAxisAlignment.start,
                        children: <Widget>[
                          Text(
                            _localization.localeString(name),
                            style: TextStyle(color: AppTheme.primaryColor),
                          ),
                        ],
                      ),
                    ),
                  ),
                ],
              ),
            ),
            Container(
              child: Column(
                children: _dynamicListWidget(list),
              ),
            ),
          ],
        ),
      ),
    );