реагировать на сбои родной карты в версии выпуска - PullRequest
Новая
       15

реагировать на сбои родной карты в версии выпуска

0 голосов
/ 03 сентября 2018

это мое первое приложение на реагировать на нативном, оно отлично работает, когда я использую реагирующий нативный run-android, и отлично работает на мобильных устройствах, но когда я делаю сборку, пожалуйста, установите и установите app-release.apk в мобильном приложении, приложение работает но он падает, когда я достигаю страницы карты, что означает, что реагирует на сбой родной карты. Пожалуйста, помогите мне решить проблему или помогите отладить ее в выпуске apk.

/ приложение / build.gradle / 

android {

compileSdkVersion 27

defaultConfig {
    applicationId "com.kobsterdelivery"
    minSdkVersion 18
    multiDexEnabled true
    targetSdkVersion 27
    versionCode 1
    versionName "1.0"
    ndk {
        abiFilters "armeabi-v7a", "x86"
    }
}
lintOptions {
  abortOnError false
}
}

dependencies {
    compile project(':react-native-svg')
    compile project(':react-native-location-switch')
    compile project(':react-native-linear-gradient')
    compile project(':react-native-geocoder')
    // compile project(':react-native-document-picker')
    implementation project(':rn-fetch-blob')   
    compile project(':react-native-image-picker')
    compile fileTree(include: ['*.jar'], dir: 'libs')
    compile 'com.android.support:appcompat-v7:26.1.0'
    compile 'com.facebook.react:react-native:+'
    // From node_modules
    compile(project(':react-native-maps')) {
        exclude group: 'com.google.android.gms', module: 'play-services-base'
        exclude group: 'com.google.android.gms', module: 'play-services-maps'
    }

implementation(project(':react-native-camera')) {
    exclude group: 'com.google.android.gms', module: 'play-services-base'
    exclude group: 'com.google.android.gms', module: 'play-services-maps'
}
compile 'com.google.android.gms:play-services-location:15.0.1'
compile 'com.google.android.gms:play-services-base:15.0.1'
compile 'com.google.android.gms:play-services-maps:15.0.1'
}

/ реагировать родной-карты / build.gradle / 

    apply plugin: 'com.android.library'
    apply from: 'gradle-maven-push.gradle'

    def DEFAULT_COMPILE_SDK_VERSION             = 25
    def DEFAULT_BUILD_TOOLS_VERSION             = "25.0.3"
    def DEFAULT_TARGET_SDK_VERSION              = 25
    def DEFAULT_GOOGLE_PLAY_SERVICES_VERSION    = "10.2.4"
    def DEFAULT_ANDROID_MAPS_UTILS_VERSION      = "0.5+"

    android {
      compileSdkVersion rootProject.hasProperty('compileSdkVersion') ? rootProject.compileSdkVersion : DEFAULT_COMPILE_SDK_VERSION
      // buildToolsVersion rootProject.hasProperty('buildToolsVersion') ? rootProject.buildToolsVersion : DEFAULT_BUILD_TOOLS_VERSION

      defaultConfig {
        minSdkVersion 18
        targetSdkVersion rootProject.hasProperty('targetSdkVersion') ? rootProject.targetSdkVersion : DEFAULT_TARGET_SDK_VERSION
      }

      packagingOptions {
        exclude 'META-INF/LICENSE'
        exclude 'META-INF/DEPENDENCIES.txt'
        exclude 'META-INF/LICENSE.txt'
        exclude 'META-INF/NOTICE.txt'
        exclude 'META-INF/NOTICE'
        exclude 'META-INF/DEPENDENCIES'
        exclude 'META-INF/notice.txt'
        exclude 'META-INF/license.txt'
        exclude 'META-INF/dependencies.txt'
        exclude 'META-INF/LGPL2.1'
      }

      lintOptions {
        disable 'InvalidPackage'
        abortOnError false    
      }

      compileOptions {
        sourceCompatibility JavaVersion.VERSION_1_7
        targetCompatibility JavaVersion.VERSION_1_7
      }
    }

    dependencies {
      def googlePlayServicesVersion = rootProject.hasProperty('googlePlayServicesVersion')  ? rootProject.googlePlayServicesVersion : DEFAULT_GOOGLE_PLAY_SERVICES_VERSION
      def androidMapsUtilsVersion   = rootProject.hasProperty('androidMapsUtilsVersion')    ? rootProject.androidMapsUtilsVersion   : DEFAULT_ANDROID_MAPS_UTILS_VERSION

      compileOnly "com.facebook.react:react-native:+"
      compileOnly "com.android.support:support-compat:25.2.0"
      compileOnly "com.android.support:appcompat-v7:25.2.0"
      implementation "com.google.android.gms:play-services-base:$googlePlayServicesVersion"
      implementation "com.google.android.gms:play-services-maps:$googlePlayServicesVersion"
      implementation "com.google.maps.android:android-maps-utils:$androidMapsUtilsVersion"
    }

/ Addresses.js / 

    import React, { Component } from 'react';
    import MapView, {PROVIDER_GOOGLE} from 'react-native-maps';
    import { connect } from 'react-redux'
    import Geocoder from 'react-native-geocoder';
    import {
      StyleSheet,
      View,
      Text,
      ActivityIndicator,
      TouchableOpacity,
      Dimensions,
      Button 
    } from 'react-native';
    import Header from '../common/Header'
    import colors from '../../assets/styles/colors.js';
    import { getAddresses } from '../../api/address'
    import { selectAddress } from '../../api/water'

    const { width, height } = Dimensions.get('window');
    const SCREEN_HEIGHT = height;
    const SCREEN_WIDTH = width;
    const ASPECT_RATIO = width / height;
    const LATITUDE_DELTA = 0.0922;
    const LONGITUDE_DELTA = LATITUDE_DELTA * ASPECT_RATIO;

    class Addresses extends Component {
      constructor(props) {
        super(props);
        this.state = { 
          location: false,
          markers: [],
          // address: ['Kobster E Shop Pvt Ltd (Kobster.com) 51-B, Mount Poonamallee Main Road, St. Thomas Mount, Chennai – 600016. (End of Kathipara Flyover - Towards Porur)','Kobster E Shop Pvt Ltd (Kobster.com)64/2, 6th cross, 3rd main road,Near Idgah Maidan, Chamrajpet,Bengaluru-560018.'],
          address_updated: false,
          selectedAddress: [],
          selectedId: null,
          initialPosition:{
            latitude: 20.5937,
            longitude: 78.9629,
            latitudeDelta: 0.0922,
            longitudeDelta: LONGITUDE_DELTA,
          },
          markerPosition:{
            latitude: 0,
            longitude: 0,
          }
        };
        this.fetchAddress = this.fetchAddress.bind(this);
        this.onSelect = this.onSelect.bind(this);
      }

      watchID = null;
      componentWillMount(){
        getAddresses(this.props.user);
        // this.fetchAddress();
        // var test = navigator.geolocation.requestAuthorization();
        // console.log(test);
        navigator.geolocation.getCurrentPosition((position) => {
          var lat = parseFloat(position.coords.latitude);
          var lon = parseFloat(position.coords.longitude);
          console.log(position);
          var initialRegion = {
            latitude: lat,
            longitude: lon,
            latitudeDelta: LATITUDE_DELTA,
            longitudeDelta: LONGITUDE_DELTA,
          }

          this.setState({
              location: true,
              initialPosition: initialRegion
            })
        },
        (error) => console.log(error),
        {enableHighAccuracy: false, timeout: 20000, maximumAge: 1000,distanceFilter: 10 })

        this.watchID = navigator.geolocation.watchPosition((position)=>{
          var lat = parseFloat(position.coords.latitude);
          var lon = parseFloat(position.coords.longitude);
          var lastRegion ={
            latitude: lat,
            longitude: lon,
            latitudeDelta: LATITUDE_DELTA/15,
            longitudeDelta: LONGITUDE_DELTA/15,
          }
          this.setState({initialPosition: lastRegion})
        },
        (error) => console.log(error),
        {enableHighAccuracy: false, timeout: 25000, maximumAge: 1000,distanceFilter: 10 })      
      }

      fetchAddress(){
        // Address Geocoding
          console.log(this.props.waddress);
          var address = [];
          this.props.waddress.map(function(address){
            console.log(address);
            Geocoder.geocodeAddress(address['location_address']).then(res => {
                // res is an Array of geocoding object (see below)
                var position = {
                  latitude: res[0].position.lat,
                  longitude: res[0].position.lng
                }
                var address_details = {
                  position: position,
                  company: address['company'],
                  address1: address['address1'],
                  city: address['city'],
                  postcode: address['postcode'],
                  phone: address['phone'],
                  address: address['location_address'],
                  displayAddress: address['show_address'],
                  id: address['id_address'],
                }

                this.setState({ address_updated: true, markers: this.state.markers.concat(address_details) })
            })
            .catch(err => {console.log(err)})  
          }.bind(this))
      }

      onSelect(id, address){
        console.log(id);
        console.log(address);
        selectAddress(id, address);
      }

      componentWillUnmount(){
        navigator.geolocation.clearWatch(this.watchID);
      }

      render() {

        let {markers} = this.state.markers;
        var i =0;
        if(this.state.address_updated == false && this.props.waddress.length > 0 && this.state.markers.length <= 0){
          this.fetchAddress();
        }

        return (
          <View  style={styles.container}>
            <Header header={"Select Address"} />
            {this.props.loading == true || this.state.location == false ?
              <View  style={styles.loadingContainer}>
                <ActivityIndicator size="large" color="#0110ff" />
              </View>:null
            }
            <MapView 
              ref={component => this._map = component}
              style={ styles.map }
              provider={PROVIDER_GOOGLE}  
              followUserLocation = {true}
              loadingEnabled = {true}
              loadingIndicatorColor = {"#0000ff"}
              loadingBackgroundColor = {"#00ff00"}
              region={this.state.initialPosition}>
              {this.props.waddress.length > 0 && this.state.markers != undefined && this.state.markers.length > 0 ?
                this.state.markers.map((coords)=>{
                  console.log("coords");
                  console.log(coords);
                  if(coords)
                    i++;
                    return (
                      <MapView.Marker
                      onPress={(e) => {this.setState({
                            selectedAddress: {
                                company: coords['company'],
                                address1: coords['address1'],
                                city: coords['city'],
                                postcode: coords['postcode'],
                                phone: coords['phone'],
                              }, 
                            selectedId: coords['id']},function(){
                        this._map.animateToCoordinate(coords['position'],1);
                      })}}
                      ref={(ref) => { this.markerRef = ref; }}
                      key={coords['id']}
                      coordinate={coords['position']}
                      title={coords['company']}
                      >
                      </MapView.Marker>
                    )
                }):null}
            </MapView>
            {this.state.selectedId > 0 ?
              <View style={styles.selectAddressContainer}>
                <AddressCard onSelect={this.onSelect} selectedAddress={this.state.selectedAddress} id={this.state.selectedId} />
              </View>
              :null}
          </View>
        );
      }
    }


    class AddressCard extends Component{
      onSelect = (e,v) => {
        console.log(e);
        console.log(v);
      }

      render(){
        return(
              <View style={styles.selectAddressWrapper}>
                <View style={styles.addressContainer}>
                  <Text style={[styles.address, styles.head]}>
                    {this.props.selectedAddress['company']}
                  </Text>
                  <Text style={styles.address}>
                    {this.props.selectedAddress['address1']}
                  </Text>
                  <Text style={styles.address}>
                    {this.props.selectedAddress['city']}
                  </Text>
                  <Text style={styles.address}>
                    {this.props.selectedAddress['postcode']}
                  </Text>
                  {this.props.selectedAddress['phone'] ?
                  <Text style={styles.address}>
                    {this.props.selectedAddress['phone']}
                  </Text>:null}
                </View>
                <View style={styles.btnContainer}>
                  <TouchableOpacity style={styles.btnWrapper} onPress={(e)=>{this.props.onSelect(this.props.id, this.props.selectedAddress)}}>
                    <Text style={styles.btnText}>Next</Text>
                  </TouchableOpacity>
                </View>
              </View>
          )
      }
    }

    const mapStateToProps = function(store) {
      console.log(store.AddressState.waddress);
        return {
          loading: store.AuthState.loading,
          user: store.AuthState.user,
          waddress: store.AddressState.waddress
        };
      };

    export default connect(mapStateToProps)(Addresses);


    const styles = StyleSheet.create({
      loadingContainer:{
        flex:1,
        alignItems: 'center',
        justifyContent: 'center',
        position: 'absolute',
        top: 50,
        bottom: 0,
        right: 0,
        left: 0,
      },
      container: {
        flex: 1,
      },
      map: {
        flex:1,
      },
      selectAddressContainer:{
        width: SCREEN_WIDTH,
        position: 'absolute',
        justifyContent: 'center',
        bottom: 0,
      },
      addressContainer: {
        marginBottom: 8,
      },
      selectAddressWrapper: {    
        backgroundColor: '#fff',
        padding: 16,
        margin: 16,
        borderRadius: 4,
      },
      address: {
        color: '#000',
      },
      head: {
        fontWeight: 'bold',
        fontSize: 18,
        color: '#000',
        marginBottom: 4,
      },
      hide: {

      },
      btnWrapper:{
        height: 50,
        borderRadius: 4,
        padding: 10,
        backgroundColor: '#841584',
      },
      btnText:{
        color: '#fdfdfd',
        textAlign: 'center',
        fontSize: 20,
      },
      btnContainer:{
        marginTop: 8,
      },
    });
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Похожие темы

...