Fork me on GitHub
#cljsrn
<
2018-01-25
>
alexey08:01:18

@deg check out https://github.com/status-im/status-react. It's quite a complex app built with re-natal and re-frame

manu11:01:30

Hi all! who knows how to use react-native-push-notifiction? I would like to open a specific screen when the user click on a notification.. works fine on ios but not on android (same code). Do you know how to handle it? Thx 🙂

deg16:01:46

How do I show a list component (FlatList or Picker, or anything similar)? My attempts are all displaying as whitespace. I looked at the code in status-react, but even once I dragged in a pile of their support functions, I still got nothing. I assume that I'm either missing some attribute or I'm hitting some js/cljs data conversion problem, but I don't yet have the tools to know how to debug this.

maxt16:01:13

@deg I'm also new to this, but I got both flat-list and picker to work. The picker looked something like this

(def picker (partial create-element (.-Picker ReactNative)))
(def picker-item (partial create-element (.. ReactNative -Picker -Item)))

(picker {}
                  (picker-item {:label "hej"})
                  (picker-item {:label "hopp"}))

deg17:01:06

@maxt Thanks. What is create-element?

deg17:01:36

Never mind, found it in reagent.core.

deg17:01:06

But, still not working.. First, it complained that {:label .. and {} were not js objects. Even once I wrapped them, I just returned to my status quo: displaying blank white space.

deg17:01:31

I finally got something working! Found code in https://gist.github.com/escherize/86e7da7984dca037a930, from https://clojurians-log.clojureverse.org/cljsrn/2016-03-16.html. Now splitting the differences, to see what my problem was, but guessing that I needed to specify width and height styles.

deg18:01:17

Yeah, that was it, plus I had a whole pile of jumbled syntax (I'd passed in a vector of items, rather than having them at top-level; I had :on-change instead of :on-value-change, etc.). Here's what does work:

(def picker (r/adapt-react-class (.-Picker ReactNative)))
(def picker-item (r/adapt-react-class (.-Item (.-Picker ReactNative))))
...
       [picker {:style {:width 350 :height 50 :margin 10}
                :selected-value :b
                :on-value-change #(js/alert "Kilroy")}
        [picker-item {:value :a :label "Alabama"}]
        [picker-item {:value :b :label "Baltimore"}]
        [picker-item {:value :c :label "Canada"}]]