reagent react-native animation example

reagent-animated-example.cljs

;; very simple example on how to use Animated with reagent
;; https://facebook.github.io/react-native/docs/animations.html

(def animated (.-Animated js/React))
(def animated-value (.-Value animated))
(def animated-view (r/adapt-react-class (.-View animated)))


(defn testview []
    (r/create-class
      {:get-initial-state
       ;; instantiate a new Animated.Value class with 0 = completely hidden
        #(clj->js {:bounceValue (animated-value. 0)})
       :component-did-mount
        (fn [this]
          (.setValue (.. this -state -bounceValue) 1.5)
          (->
            ;; set the animation properties and start it off
            (.spring animated (.. this -state -bounceValue) #js {:toValue 0.8
                                                                 :friction 1})
            (.start)))
       :display-name "test-view"
       ;; render does not receive this as first argument
       ;; to get this, we need to use (reagent.core/current-component)
       :reagent-render
          (fn []
            (let [this (r/current-component)]
              [animated-view {:style {:flex 1
                                      :transform [{:scale (.. this -state -bounceValue)}]
                                      :backgroundColor "red"
                                      :borderRadius 10
                                      :margin 15
                                      :shadowColor "#000000"
                                      :shadowOpacity 0.7
                                      :shadowRadius 2
                                      :shadowOffset {:height 1 :width 0}}}
                [text {} "This is a test"]]))}))