i have a website where i had a pdf preview as a react component, the pdf should be in real dimension, all works smooth until I start working on making the website responsive, I didn't know wt to do exactly with the pdf preview, I have an idea to scale the whole component up and down like we do with an SVG but idk if that's possible to do
I think you better use a library to preview the PDF.Since you want to make it responsive without affecting the preview.You may make use of libraries like react-pdf. This library may generate PDF files from a URL, a local file within the project, or a base64 encoded version.
And i found this article useful.
Hope this may help you!
And as you have mentioned you have some troubles installing react-pdf it's not very compatible with webpack5that is mostly due to Buffer dependency.
Refer to thsi :react-pdf issues
Without knowing the exact error, it's so difficult to help, so be more specific when you are asking questions.
Related
I need a lib for react that takes an image (ex. 500w by 1000h following the baviour of object-fit: cover) and crops it to 256w by 144h
automaticly and serves it back to use at base64 format. English isn't my native language but I tried my best looking for this and only found libs that allow users to manually crop the image – I need an automatic procedure.
I've tried many libraries and the one that works best for me is smartcrop
It is very customizable (the most customizable I found).
You don't need NextJS to use it, you can use a simple node script.
I'm a newbie to codenameone. I'm trying to develop some image-processing app. I need to know if the image has geotagging information and eventually extract those. Is there a way to do that in CodenameOne?
I'm aware of the methods based on plain javax.imageio packages, but I know that those are not available in codenameone.
Thanks for any hints!
We don't have such an API as it's pretty different between Android/iOS. You can write something like this in pure Java and parse the image header which should be relatively simple.
Or you can build a cn1lib on top of native code e.g. see this library, It does that for video which is arguably harder.
I'm testing and looking forward into some solutions like react-pdf and others. But what I really need is to use css properties like transform, translate and more like scale and rotate for example.
Do You heard about som kinda solutions, maybe someone just used something like?
I'll be grateful for any advice.
For all future searcher:
I tried react-pdf and html-pdf, but they were not solutions that would suit me completely.
There was always a lack of either transition, transform or svg support. In addition, they required writing an additional pdf template from which to generate.
So, ultimately, I used a node library called Puppeteer, based on chromium, thanks to which you can generate a pdf just like in the preview on the chrome browser, and regardless of which browser we use.
Puppeter is in fact a Headless Chrome ('running Chrome without chrome') solution, which enters the address we want and performs actions without the participation of the user, in this case writing to a pdf file.
Link: [https://pptr.dev/]
Link: Headless Chrome
I am wanting to render a short piece of animation on the splash screen of my CN1 app but am struggling.
The Lottiefiles website contains a lot of good animation content, but the closest example i can find to using it is within XCode. I have the downloaded JSON file, of the animation, but am wanting to know if anyone has figured a way of incorporating into a CN1 Java app?
I can see that developers have used in Java, but CN1 wouldn't allow the LottieAnimationView component on it's layout manager i would guess.
https://steemit.com/utopian-io/#fahrulhidayat/beautiful-animation-for-android-application-using-lottie-library
Any pointers appreciated. Thanks
The "right way" would probably be to wrap the native implementations for the various OS's in a cn1lib so you can use lottie in a cross platform way. There's a long tutorial about wrapping native code in the developer guide and Steve did a 3 part video series on the subject a few years back: https://www.codenameone.com/blog/integrating-3rd-party-native-sdks-part-3.html
It's mostly mechanical so it shouldn't be too hard. If you want to take a shortcut you can probably use the web version of the API in a BrowserComponent and call it a day.
My stack is webpack, es6 modules and react for the client and koa for the server.
What I'm trying to achieve is a way to build/serve different versions of css, one for android, another for ios and another for the web.
I know I can achieve a way to put all in one css and just play with the classes according to the headers, but what I really want to do is to serve the minimum amount of css for each device.
I've some workarounds, but they all seem dirty, so let's go community, help me to solve this as elegant as possible.
For all those of you who get here looking for the same, I've created a small loader for webpack2 to achieve this. You can check it out here