Wrapping text around images.

[huv1k]

Is your feature request related to a problem? Please describe. I would like to use float to wrap text around images. Is this possible with current implementation? I don't want to use flex-flow: row to have image and text in one row. because I want to wrap text around an image. The text could be 10 pages long like a lot of articles in news do.

Describe the solution you'd like

<View>
  <Image
    src="https://avatars1.githubusercontent.com/u/5691926?s=460&v=4"
    style={{ width: 100, float: 'left' }}
  />
  <Text>
    Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse
    ut ligula ullamcorper, sodales ante dignissim, commodo lorem. In a
    egestas ex. Sed rhoncus lorem posuere massa rutrum consectetur. In
    at augue vitae risus fermentum volutpat sagittis nec ex.
  </Text>
</View>

Describe alternatives you've considered Using flex, but it's not possible to wrap text under the image with it.

[diegomura]

Thank you @Huvik ! Currently is not possible to achieve something like this. The fact that you can't achieve this using flexbox is not a trivial problem, mainly because we use Yoga to perform and calculate layout. Not sure if Yoga supports this, but if don't the implementation would be even more difficult

[kwoterG]

@diegomura it would be really great if this feature is developed. Is there anyway I can support to achieve this?

I'm using react-pdf to generate dynamic PDF files from a WYSIWYG editor. The PDF's are created by end-users, so I don't have any control on where and when the images are positioned.

This is an example of a document I would like to render as PDF. https://app.kwoter.nl/d/yqLQ4Hgiw6ZB4oanr

Is there anyway I can be of help here?

[diegomura]

This is something that has to be build on both textkit and react-pdf layers, but to be honest, I couldn't think yet about an implementation yet. The first step would be if textkit supports exclude sections from render containers (I wrote the current implementation but I don't remember if does. An old, but incomplete, version did). But the problem relies in where that exclusion area is, and how to deal with pagination. I'm working in a v2.0 solution which is much more modular and maybe then it would be easier to add, but still, it's not as easy as it might seem

[kwoterG]

Tnx for the reply. For now we will tell our users that we don't support this yet.

I will take a look if I can be of any help, but i'm afraid my knowledge is a bit limited...

Tnx for all your work on react-pdf. It's great.

[MichalKalita]

Any progress on this feature?

[lfoliveir4]

Any progress on this feature??

[CrownKira]

Any progress on the PR so far ?

[platon-ivanov]

It would be great to see this feature to make it into the library!