demo.cljs

(ns cljs-rn-sandbox.views
  (:require [reagent.core :as r]
            [cljs-rn-sandbox.actions :as actions]
            [cljs-rn-sandbox.store :as store]))

(def ReactNative (js/require "react-native"))
(def expo (js/require "expo"))
(def AtExpo (js/require "@expo/vector-icons"))
(def ionicons (.-Ionicons AtExpo))
(def ic (r/adapt-react-class ionicons))
(def ReactNativeElements (js/require "react-native-elements"))
(def ReactNavigation (js/require "react-navigation"))

(def text (r/adapt-react-class (.-Text ReactNative)))
(def view (r/adapt-react-class (.-View ReactNative)))
(def image (r/adapt-react-class (.-Image ReactNative)))
(def button (r/adapt-react-class (.-Button ReactNativeElements)))
(def create-tab-navigator (.-createBottomTabNavigator ReactNavigation))

(def main-view-style {:flex 1
                      :flex-direction "column"
                      :align-items "center"
                      :justify-content "center"})

(def text-style {:font-size 30
                :font-weight "100"
                :margin-bottom 20
                 :text-align "center"})

(defn counter
  []
  [view {:style main-view-style}
   [image {:source (js/require "./assets/images/cljs.png")
           :style {:width 200
                   :height 200}}]
   [text {:style text-style} (str "Counter -> " @store/counter-cursor)]
   [ic {:name "ios-arrow-down" :size 60 :color "green"}]
   [button {:title "Increment" :on-press actions/increment-counter}]])

(defn greeter
  []
  [view {:style main-view-style}
   [text {:style text-style} "Hello!"]])

(defn counter-icon
  []
  [ic {:name "counter"}])

(defn greeter-icon
  []
  (fn []
    [ic {:name "smile-o"}]))

(defn home
  []
  (create-tab-navigator
   (clj->js {"Counter" {"screen" (r/reactify-component counter)}
             "Greeter" {"screen" (r/reactify-component greeter)
                        "navigationOptions" (fn []
                                              (clj->js {"title" "Hello!"
                                                        "tabBarIcon" (r/reactify-component greeter-icon)}))}})))

(defn main
  []
  [(r/adapt-react-class (home))])