I want to do image capture and pass text along with the image in react native app, just like whatsapp does. When you invoke the camera to take a picture it will just capture the image and there is no way to add the text. Is there any component available for this kind of requirement.
Something like this Sample Example
No component can achieve that at the moment, you can simply add text on the picture juste like: https://medium.com/#mheavers/vertically-centering-text-over-images-in-react-native-with-flexbox-935e822751f3
and use this package to save it as an image
https://github.com/gre/react-native-view-shot
You can use react-native-camera.
Related
dribble news app design, the image is the third image below just right before the login button, I will like to extract that image from the login screen, or perhaps, how can I implement that using react-native. Thanks! I look forward to your positive and helpful comments
I am currently attempting to code an app in react native for an android device. I have created a custom loading component and am using the to show a loading icon.
But, I want to use a custom gif loading icon that contains my app's colours. I have looked but I cannot seem to find anything, is it possible to do this?
react native does not support gif feature in its raw form. However, in order to reach what you want and use gifs in the application, you can take a look at the accepted answer on the subject;
How do I display an animated gif in React Native?
Then all you need to do is to use Image component instead of ActivityIndicator. And passing the relevant gif information to the image component.
I am new to react-native. I want a toggle button with 2 text blocks. How this can be achieved with react native?.
The toggler should animate when clicking buy and sell texts respectively.
Following is the image reference for the design.
You can try this library.
This does not match the design exactly but it's a toggle with two text blocks. If you want something that looks exactly like your image I'm afraid you will have to build it yourself. You could use the mentioned library as a starting point.
I need to show an image (eg:blur image) with loading indicator shows
the image is loading in UI. For eg) In facebook app feed posts are shows as loading before it fetch from server. I need the same.
Any suggestion or any package in react-native?
We have opacity prop and blurRadius prop for image in react native.
so what you can do is....
you can use async function to check if image is completely downloaded ...if yes then setState({downloaded:true}) and then if downloaded is true , based on your choice you can change the opacity to 100% for addon..you can even use activityindicator on top of that.
i hope it solves your problem...
you can also refer to this link : https://medium.com/the-react-native-log/progressive-image-loading-in-react-native-ecc88e724343
I am trying to build a language selection picker in react native which has a picture of the country's flag next to the label, like this:
The icons have to be images and not unicode. I've had a look around but there doesn't seem to be anything available. Does anyone know of anything I can use to create this?
If nothing can be used then I will create a custom picker, I aim to make use of a ScrollView to handle the scrolling but I am not sure what I can use to replicate the rotation effect of the native iOS picker, so if anyone can help me with this also I would really appreciate it.
You can try this:
https://github.com/xcarpentier/react-native-country-picker-modal
It's not inside a native picker like your screenshot, but it should do what you are asking for.
You can use emoji by copy from online emoji website(many available on internet) and add picker item code as below,
<Picker.Item label="🇫🇷 France" value="fr" />