Home > Blockchain >  Align children to top of row in Flutter?
Align children to top of row in Flutter?

Time:09-06

after I write my posts in my application, my photo and date center the text. I need to pin the photo and date to the beginning. What should I do for this? ............................................................................................................................................................................................ enter image description here

child: Row( children: [
                                Padding(
                                  padding: EdgeInsets.only(top: 15),
                                  child: CircleAvatar(
                                    radius: 20,
                                    backgroundImage: NetworkImage(
                                      userData['photoUrl'],
                                    ),
                                  ),
                                ),
                                Expanded(
                                  child: Padding(
                                    padding:
                                        EdgeInsets.only(left: 8, top: 20),
                                    child: Container(
                                      child: Column(
                                        mainAxisSize: MainAxisSize.min,
                                        crossAxisAlignment:
                                            CrossAxisAlignment.start,
                                        children: [
                                          Text(
                                            userData['username'],
                                            style: TextStyle(
                                                fontWeight:
                                                    FontWeight.bold),
                                          ),
                                          Container(
                                            width: double.infinity,
                                            padding: const EdgeInsets.only(
                                              top: 8,
                                            ),
                                            child: RichText(
                                              text: TextSpan(
                                                style: const TextStyle(
                                                    color: primaryColor),
                                                children: [
                                                  
                                                  TextSpan(
                                                    text:
                                                        ' ${(snap.data()! as dynamic)['description']}',
                                                  ),
                                                ],
                                              ),
                                            ),
                                          ),
                                        ],
                                      ),
                                    ),
                                  ),
                                ),
                                Container(
                                  padding:
                                      EdgeInsets.symmetric(vertical: 4),
                                  child: Text(
                                    DateFormat.yMd().format(
                                      (snap.data()!
                                              as dynamic)['datePublished']
                                          .toDate(),
                                    ),
                                    style: const TextStyle(
                                      fontSize: 15,
                                      color: secondaryColor,
                                    ),
                                  ),
                                ),

CodePudding user response:

child: Row( 
  crossAxisAlignment: CrossAxisAlignment.start,
  children: [

CodePudding user response:

In your Row, set crossAxisAlignment: CrossAxisAlignment.start. This will cause the Row's children to be aligned at the top of the row.

  • Related