Flutter-Flutter 中是否可以将 RichText 类放在 Container 类中

Question

So I am currently working on an app project and I have arrived at a point where I want to put two text lines within a row on top of each one and other. As an example it should like this app demo created with figma . So far I have a row in which every element on the same altitude is contained within, but I am having a hard time being able to put 2 elements within a row on top of each other. I have found out this class called Stack but I am having a hard time implementing it. Within my Stack class I have a RichText Class. From the flutter api, what I understand is that you have to use containers (to be able to define the positions). So I wonder if I should switch to container classes right after the Stack class and then within each Container class, I put a RichText? If I could have some advice on this, or simply on how to create something like in the picture it would be great. Thanks in advance.

Answer 1

Added a demo of what you are trying to achieve:

        Column(
          crossAxisAlignment: CrossAxisAlignment.start,
          mainAxisAlignment: MainAxisAlignment.center,
          children: [
            // row containing the avatar, name, date and icons (likes and comments)
            Row(
              children: [
                // circle avatart
                CircleAvatar(
                  backgroundColor: Colors.blue,
                  radius: 25,
                ),
                // spacing
                SizedBox(
                  width: 10,
                ),

                // the name of poster and date in a column
                Column(
                  crossAxisAlignment: CrossAxisAlignment.start,
                  children: [
                    Text(
                      'Claire',
                    ),
                    Text(
                      'July 03 at 13:08PM',
                    ),
                  ],
                ),
                // spacer
                Spacer(),

                // likes icon
                Icon(Icons.favorite_border),
                Text(
                  '32',
                ),

                // spacing
                SizedBox(
                  width: 10,
                ),

                // comments icon
                Icon(
                  Icons.comment,
                ),
                Text(
                  '32',
                ),
              ],
            ),
            // spacing
            SizedBox(
              height: 10,
            ),
            // title text
            Text(
              'Dorm recommendation',
            ),

            // decription
            Text(
              'Any recommendations on dorm application? Does anyone know how\'s the facility at Talent Apartment? Are there teamrooms and gym in TA? Also, updates on the location of washers and dryers?',
              maxLines: 3,
              overflow: TextOverflow.ellipsis,
            ),
          ],
        ),

RESULT: