fix(android): add camera before styleLoad so defaultSettings can be a…

[mfazekas]

…pplied earlier

See: #3112

Tested with the following sample:

import React from 'react';
import { Button } from 'react-native';
import {
  Images,
  MapView,
  ShapeSource,
  SymbolLayer,
  CircleLayer,
  Camera,
} from '@rnmapbox/maps';

const styles = {
  mapView: { flex: 1 },
  circleLayer: {
    circleRadiusTransition: { duration: 5000, delay: 0 },
    circleColor: '#ff0000',
  },
};

const features = {
  type: 'FeatureCollection',
  features: [
    {
      type: 'Feature',
      id: 'a-feature',
      properties: {
        icon: 'example',
        text: 'example-icon-and-label',
      },
      geometry: {
        type: 'Point',
        coordinates: [-74.00597, 40.71427],
      },
    },
    {
      type: 'Feature',
      id: 'b-feature',
      properties: {
        text: 'just-label',
      },
      geometry: {
        type: 'Point',
        coordinates: [-74.001097, 40.71527],
      },
    },
    {
      type: 'Feature',
      id: 'c-feature',
      properties: {
        icon: 'example',
      },
      geometry: {
        type: 'Point',
        coordinates: [-74.00697, 40.72427],
      },
    },
  ],
};

class BugReportExample extends React.Component {
  state = {
    visible: false,
  };

  render() {
    const circleLayerStyle = {
      ...styles.circleLayer,
      ...{ circleRadius: this.state.radius },
    };
    const { visible } = this.state;

    return (
      <>
        <Button title="Show" onPress={() => this.setState({ visible: true })} />
        {visible && (
          <MapView style={styles.mapView}>
            <Camera
              defaultSettings={{
                centerCoordinate: [-74.00597, 40.71427],
                zoomLevel: 14,
              }}
            />
            <Images images={{ example: require('../assets/example.png') }} />
            <ShapeSource id={'shape-source-id-0'} shape={features}>
              <CircleLayer id={'circle-layer'} style={circleLayerStyle} />
              <SymbolLayer
                id="symbol-id"
                style={{
                  iconImage: ['get', 'icon'],
                }}
              />
            </ShapeSource>
          </MapView>
        )}
      </>
    );
  }
}

export default BugReportExample;

[mattijsf]

Very nice! Thanks for looking into this so quickly.