Allright, let's see how far I got with: https://github.com/mapbox/react-native-mapbox-gl/blob/master/API.md#access-token I seem to be succeeded to let it run without any errors so far 🙂. in .re-natal:

"modules": [
    "react-native-mapbox-gl"
  ],

(def Mapbox (js/require "react-native-mapbox-gl")) ;; import Mapbox from 'react-native-mapbox-gl';
(.setAccessToken Mapbox "xxx") ;; Mapbox.setAccessToken('xxx');
[...]
(def mapview (partial create-element (.-MapView Mapbox))) ;; import { MapView } from 'react-native-mapbox-gl';
[...]
 (view {:style {:flexDirection "column" :margin 40 :alignItems "center"}}
                (text {:style {:fontSize 30 :fontWeight "100" :marginBottom 20 :textAlign "center"}} (:greeting @state))
                (image {:source logo-img
                        :style  {:width 80 :height 80 :marginBottom 30}})
                (touchable-highlight {:style   {:backgroundColor "#999" :padding 10 :borderRadius 5}
                                      :onPress #(alert "HELLO!")}
                                     (text {:style {:color "white" :textAlign "center" :fontWeight "bold"}} "press me"))
                (mapview))) ;; <MapView />

Try defining your mapview like this instead (def mapview (r/adapt-react-class (.-MapView MapBox)))

And make sure to enable both Android then Figwheel in that order

$ re-natal use-android-device <real|genymotion|avd>
$ re-natal use-figwheel
$ lein figwheel android 

Figwheel doesn't connect (I commented the new lines, just to be sure there's nothing wrong with these). The app does start, though.

$ re-natal use-android-device real
Using 'localhost' for device type real
Please run: re-natal use-figwheel to take effect.
$ re-natal use-figwheel
Cleaning...
index.ios.js was regenerated
index.android.js was regenerated
Host in RCTWebSocketExecutor.m was updated
Dev server host for iOS: localhost
Dev server host for Android: localhost
$  lein figwheel android 
Figwheel: Cutting some fruit, just a sec ...
Figwheel: Validating the configuration found in project.clj
Figwheel: Configuration Valid :)
Figwheel: Starting server at 
Figwheel: Watching build - android
Figwheel: Cleaning build - android
Compiling "target/android/not-used.js" from ["src" "env/dev"]...
Successfully compiled "target/android/not-used.js" in 8.062 seconds.
Launching ClojureScript REPL for build: android
Figwheel Controls:
          (stop-autobuild)                ;; stops Figwheel autobuilder
          (start-autobuild [id ...])      ;; starts autobuilder focused on optional ids
          (switch-to-build id ...)        ;; switches autobuilder to different build
          (reset-autobuild)               ;; stops, cleans, and starts autobuilder
          (reload-config)                 ;; reloads build config and resets autobuild
          (build-once [id ...])           ;; builds source one time
          (clean-builds [id ..])          ;; deletes compiled cljs target files
          (print-config [id ...])         ;; prints out build configurations
          (fig-status)                    ;; displays current state of system
  Switch REPL build focus:
          :cljs/quit                      ;; allows you to switch REPL to another build
    Docs: (doc function-name-here)
    Exit: Control+C or :cljs/quit
 Results: Stored in vars *1, *2, *3, *e holds last exception object
Prompt will show when Figwheel connects to your application

Not sure about this line: (def mapview (r/adapt-react-class (.-MapView MapBox))) - is that reagent specific? (I'm using rum now, and it has this create-element function; maybe I should try with reagent instead of rum?)

Got it. Very true didn't ask what you are using. I haven't used rum myself so not sure how it's done there

That's odd about the hang, I do know there was something about some avd magic you have to do to forward ports

Sorry meant adb

To run figwheel with real Android device please read Running on Device.
To make it work on a USB connected device I also had to run:
$ adb reverse tcp:8081 tcp:8081
$ adb reverse tcp:3449 tcp:3449 
Then:
$ re-natal use-android-device real
$ re-natal use-figwheel
$ lein figwheel android
$ react-native run-android 

Right... will try again. clean etc. if it doesn't work, I'll try a fresh project with reagent.

ok, got figwheel running now 🙂 thx. Problem one: solved 😛

probably rerunning adb reverse did the trick. Weird, but well, nice 🙂.

Notice the line about Figwheel starting on 3449, that's the reason for the need to forward the port. Can't recall why 8081

Without those forwards your device can't talk back to Figwheel

Right.

So, things seem to move forward; in the repl, from my ns

.core=> (str Mapbox)
"[object Object]"
.core=> (mapview)
#js {:$$typeof 60103, :type #object[MapView "function MapView(props) {
    babelHelpers.classCallCheck(this, MapView);

    var _this = babelHelpers.possibleConstructorReturn(this, (MapView.__proto__ || Object.getPrototypeOf(MapView)).call(this, props));

    _this._native = null;


    _this._onRegionDidChange = _this._onRegionDidChange.bind(_this);
    _this._onRegionWillChange = _this._onRegionWillChange.bind(_this);
    _this._onOpenAnnotation = _this._onOpenAnnotation.bind(_this);
    _this._onRightAnnotationTapped = _this._onRightAnnotationTapped.bind(_this);
    _this._onChangeUserTrackingMode = _this._onChangeUserTrackingMode.bind(_this);
    _this._onUpdateUserLocation = _this._onUpdateUserLocation.bind(_this);
    _this._onLongPress = _this._onLongPress.bind(_this);
    _this._onTap = _this._onTap.bind(_this);
    _this._onFinishLoadingMap = _this._onFinishLoadingMap.bind(_this);
    _this._onStartLoadingMap = _this._onStartLoadingMap.bind(_this);
    _this._onLocateUserFailed = _this._onLocateUserFailed.bind(_this);
    _this._onNativeComponentMount = _this._onNativeComponentMount.bind(_this);
    return _this;
  }"], :key nil, :ref nil, :props #js {:initialCenterCoordinate #js {:latitude 0, :longitude 0}, :initialDirection 0, :initialZoomLevel 0, :minimumZoomLevel 0, :maximumZoomLevel 20, :debugActive false, :rotateEnabled true, :scrollEnabled true, :pitchEnabled true, :showsUserLocation false, :styleURL "", :userTrackingMode 0, :zoomEnabled true, :annotationsPopUpEnabled true, :attributionButtonIsHidden false, :logoIsHidden false, :compassIsHidden false, :annotationsAreImmutable false, :annotations #js [], :contentInset #js [0 0 0 0]}, :_owner nil, :_store #js {}}

What does your new view code look like

(ns app.android.core
  (:require-macros [rum.core :refer [defc]])
  (:require [re-natal.support :as support]
            [rum.core :as rum]))

(set! js/window.React (js/require "react"))
(def ReactNative (js/require "react-native"))

(def Mapbox (js/require "react-native-mapbox-gl"))
(.setAccessToken Mapbox "XXX")

(defn create-element [rn-comp opts & children]
      (apply js/React.createElement rn-comp (clj->js opts) children))

(def app-registry (.-AppRegistry ReactNative))
(def view (partial create-element (.-View ReactNative)))
(def text (partial create-element (.-Text ReactNative)))
(def image (partial create-element (.-Image ReactNative)))
(def touchable-highlight (partial create-element (.-TouchableHighlight ReactNative)))
(def mapview (partial create-element (.-MapView Mapbox)))


(def logo-img (js/require "./images/cljs.png"))

(defn alert [title]
      (.alert (.-Alert ReactNative) title))

(defonce app-state (atom {:greeting "Hey hey! Welcome to cljs in iOS and Android!"}))

(defc AppRoot < rum/cursored-watch [state]
          (view {:style {:flexDirection "column" :margin 40 :alignItems "center"}}
                (text {:style {:fontSize 30 :fontWeight "100" :marginBottom 20 :textAlign "center"}} (:greeting @state))
                (image {:source logo-img
                        :style  {:width 80 :height 80 :marginBottom 30}})
                (touchable-highlight {:style   {:backgroundColor "#999" :padding 10 :borderRadius 5}
                                      :onPress #(alert "HELLO!")}
                                     (text {:style {:color "white" :textAlign "center" :fontWeight "bold"}} "press me"))
                (mapview)
))

(defonce root-component-factory (support/make-root-component-factory))

(defn mount-app [] (support/mount (AppRoot app-state)))

(defn init []
      (mount-app)
      (.registerComponent app-registry "app" (fn [] root-component-factory)))

Looks like with rum you're supposed to do? (def mapview (aget MapBox "MapView"))

.core=> (def mapview (aget MapBox "MapView")) 
#object[TypeError TypeError: undefined is not an object (evaluating 'app.android.core.MapBox["MapView"]')]

same type as text (if that matters at all):

.core=> (text)
#js {:$$typeof 60103, :type #object[Function "function (props, context, updater) {

      if (process.env.NODE_ENV !== 'production') {
        process.env.NODE_ENV !== 'production' ? warning(this instanceof Constructor, 'Something is calling a React component directly. Use a factory or ' + 'JSX instead. See:  : void 0;
      }

      if (this.__reactAutoBindPairs.length) {
        bindAutoBindMethods(this);
      }

      this.props = props;
      this.context = context;
      this.refs = emptyObject;
      this.updater = updater || ReactNoopUpdateQueue;

      this.state = null;

      var initialState = this.getInitialState ? this.getInitialState() : null;
      if (process.env.NODE_ENV !== 'production') {
        if (initialState === undefined && this.getInitialState._isMockFunction) {
          initialState = null;
        }
      }
      !(typeof initialState === 'object' && !Array.isArray(initialState)) ? process.env.NODE_ENV !== 'production' ? invariant(false, '%s.getInitialState(): must return an object or null', Constructor.displayName || 'ReactCompositeComponent') : _prodInvariant('82', Constructor.displayName || 'ReactCompositeComponent') : void 0;

      this.state = initialState;
    }"], :key nil, :ref nil, :props #js {:accessible true, :allowFontScaling true, :ellipsizeMode "tail"}, :_owner nil, :_store #js {}}

Yeah I'm not familiar enough with rum to know what might be off, but it definitely looks like you're close

thanks a lot for helping me so far 🙂. .

got it working! cool, thanks - it was about styling:

(view ;;{:style {:flexDirection "column" :margin 40 :alignItems "center"}}
                {:style {:flex 1, :alignItems "stretch"}}
                (mapview {:style {:flex 1}})
                (text {:style {:fontSize 30 :fontWeight "100" :marginBottom 20 :textAlign "center"}} (:greeting @state))
                (image {:source logo-img
                        :style  {:width 80 :height 80 :marginBottom 30}})
                (touchable-highlight {:style   {:backgroundColor "#999" :padding 10 :borderRadius 5}
                                      :onPress #(alert "HELLO!")}
                                     (text {:style {:color "white" :textAlign "center" :fontWeight "bold"}} "press me"))))

Nice 🙂

{:style {:flex 1, :alignItems "stretch"}} - have map {:flexDirection "column" :margin 40 :alignItems "center"}} - no map

Bah. I should have caught that...I was wondering if it was view ordering at one point but it was size

Nice work