react-pdf
react-pdf copied to clipboard
Wrapping text around images.
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.
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
@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?
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
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.
Any progress on this feature?
Any progress on this feature??
Any progress on the PR so far ?
It would be great to see this feature to make it into the library!