flutterflutter-layoutflutter-testflutter-textflutter-row

Flutter Row widget with two two text widget is not following one another


I am trying to wrap text (multi line) followed by "Read More" in a Row widget.

Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. Read More...

I tried using row widget (Read More) it's overflowing to next line.

Just want to show the readmore text followed by the content without overflowing to next line. on clicking read more i am showing bottommodelsheet.

Please help..


Solution

  • You can use RichText instead of Row:

    RichText(
                    text: TextSpan(
                      style: TextStyle(color: Colors.black),
                      children: <TextSpan>[
                        TextSpan(
                          text:
                              "Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book.",
                        ),
                        TextSpan(
                          text: 'Read more!',
                          style: TextStyle(fontWeight: FontWeight.bold),
                          recognizer: TapGestureRecognizer()
                            ..onTap = () {
                              print('Read more click');
                              // what you wnat when click more
                            },
                        ),
                      ],
                    ),
                  ),
    

    enter image description here