flutteruser-interfacecss-float

How to acheive float(CSS property) like property in flutter


I want to create the following design in flutter:

enter image description here

I want to create this design in which the image is float at the right and the text is at the right and when the the height of the image is end means after the image the text will continue to take the full width. It is very easy in html with just one property float.

image{
  float: right;
}

but i don't have idea how to do it in flutter your help would be highly appreciated.


Solution

  • You can use drop_cap_text package for this purpose try the following code:

     DropCapText(
                            messageContent,
                            dropCapPosition: DropCapPosition.end,
                            style: TextStyle(
                              color: Colors.white,
                              fontSize: 17.sp,
                              fontWeight: FontWeight.normal,
                              height: 1.4,
                              fontFamily: 'Raleway',
                            ),
                            dropCap: DropCap(
                              width: 200,
                              height: 200,
                              child: Image.asset(
                                'assets/images/experience_images/6.png',
                              ),
                            ),
                          )