Oh thanks it s Android. Proly I can see the log in Android studio? I will try @pesterhazy

I checked logcat in android studio and it says

so it seems like my camera is undefined. (nil)

@pesterhazy was it right error message?

Yeah

Try printing out the object: (prn ReactNativeCamera)

Also print out your camera from (def camera (.-Camera ReactNativeCamera)) A lot of the time it is actually .-default like: (def camera (.-default ReactNativeCamera))

That’s what I suspected as well but I wanted to explain the debugging process

You may also need to use the re-natal use-component command to make the npm lib visible to figwheel

Thank you guys! I was almost too frustrated ! I will try default and use-component command

yes turns out there's object in (def camera (.-default ReactNativeCamera))

but there is nothing was returned from render error. From camera component (as I delete the component then I see no errors.

the code is mostly unchanged... do I need to upload it? do you know why it might happen?

Compare these two lines: (def camera (.-default ReactNativeCamera)) (def text (r/adapt-react-class (.-Text ReactNative))) The difference is an indication of why you get the error

Read up on r/adapt-react-class to gain some more insight

Mmm true! Yes I will thanks. I saw app registry didn't need adapt react class function and I tried adapt react class function with .-Camera property but I forgot to do it with .-default ! I will try thanks!

Only been in web World it s first my mobile project, sorry if I am asking too many basics!

No, that's fine.

@harrybin Now that I have the time to try adapt-react-class function, I think the (.-default ReactNativeCamera) is not meant to be adapted

printing out after adapting only shows #object[reagent.impl.template.NativeWrapper]

whereas (.-default ReactNativeCamera) has the following

@wontheone1 it's a React component; to use it with Reagent you need to wrap in in adapt-react-class

re-natal use-component react-native-camera/default re-natal use-component react-native-camera/Camera re-natal use-component react-native-camera I tried all these command now because I don't know which one's right one to use 😄

Hopefully there was an easy to follow tutorial for this

Also will try out all these

(def ReactNativeCamera (js/require "react-native-camera")) (def camera1 (r/adapt-react-class (.-default ReactNativeCamera)))

(println :debug camera1)

prints :debug nil

no I think print prints :debug #object[reagent.impl.template.NativeWrapper]

another thing noticed is actually constants property is in ReactNativeCamera not in (.-default ReactNativeCamera)

right

try to poke around in the fighweel repl, if you can

don't worry, react-native-camera works with reagent

take it slowly, don't do too much at the same time

start from a minimal example

I am really trying to do minimal example 🙂...

I got to point no error but white screen is all I see

no touchable-highlight or text that I set it as button

Did you set the height and width for the camera component?

If you don't set them explicitly in the component's style, it defaults to 0 and you can't see anything

(When I'm testing out stuff like this, I also set backgroundColor, to make sure something is displayed)

yes I pretty much tried to just translate the basic JS example to cljs

I wonder if i did the right thing in :ref key

it needed this-as key which I am not sure from which context I need this

You have flex: 1 as camera style, as far as I remember, that won't work

You need to be explicit with height / width

Oh another thing I found is my outer most view is really small

@wojciech In the official react-native-camera README they are using

preview: { flex: 1, justifyContent: 'flex-end', alignItems: 'center' },

So the cljs can use the same right?

I also saw a js tutorial that uses that

Okay, you're right - maybe that changed

Now I actually see small box

So I have no other idea, other than maybe the view being too small to show it

small gray box

I am not sure if this is camera on emulator ... and if it is why so small 😄

On emulator in Android you see a fake image

Because there's no real camera

is the fake image gray?

It's a grey background with a box bouncing around, IIRC

I see I might be going somewhere then... although I don't see the bouncing box

Can you check on a real device?

Hmm I only have iPhone right now...

How did you set the :ref key for the camera component?

I see this error in logcat

Current code looks like this, if somebody can point me to code example where it is using react-native-camera, I 'd really appreciate 🙂 I am especially not sure what is the value of the :ref key and how did you use this-as macro if you have used it.

I wouldn't use this

here's an example of how to use a ref in reagent: https://gist.github.com/pesterhazy/4d9df2edc303e5706d547aeabe0e17e1

why do you use aspect etc.? Leave it out and see if you can make it work like that

set an explicit width and ehight to the camera component until you make it work — then clean it up by using flexbox etc

capturing the camera in a ref only makes sense if you use the ref somehow (in the on-press handler I guess)

Ok I ll try that when I have time. thanks ! I just thought this.camera = cam; was needed to render camera :)