I have a slider component which I want to have a handle as png image pass as a prop. Now, I want that png image to pass through react native to native modules(android and ios both). The component is written at native side for both ios(Objective C) and android(Java).
- How can I pass png image as a prop to native modules?
- How can I use them at native Java part?(I am using Canvas to draw myslider as shown below).
- How can I use them at native Objective C?(I am using CGContext todraw my slider).
What I have tried:
- I resolved path of png image by following code at React Native side.
const myImage = require('../assets/slider-handle.png'); const resolveAssetSource = require('react-native/Libraries/Image/resolveAssetSource'); const resolvedImage = resolveAssetSource(myImage);
Then pass the path of image as a prop imagePath={resolvedImage.uri}
.
Then at Java part I do following:
public void drawImage(String imagePath, Canvas canvas, int x, int y) { Bitmap bitmap = BitmapFactory.decodeFile(imagePath); canvas.drawBitmap(bitmap, y, x, somePaintValue);}
I am getting the path of image(the path is something like this: (http:/10.0.2.2:8081/assets/app/components/slider/assets/slider.png), I have verified that at native side by consoling the path.
Not sure if I need to pass only path of image or maybe there is a way to pass whole png.This is my first time working with Java and Objective C.This is the slider I am developing.Any help will be really appreciated.