react-native-maps를 설치하고 우선 지도를 내보내기

개요



  • airbnb/react-native-maps을 설치하고 먼저지도를 떠날 때까지의 단계를 정리합니다
  • iOS 용 빌드 만 시도했기 때문에 iOS 용 단계 만 작성했습니다
  • 네이티브 기능을 사용하기 위해 create-react-native-app 한 사람은 eject가 필요합니다
  • 버전
  • react-native: 0.47.0
  • react-native-maps: 0.16.4


  • 설치


  • react-native-maps 설치
  • npm install react-native-maps --save
    
  • 종속 네이티브 라이브러리를 설치하고 프로젝트에 연결
  • react-native link react-native-maps
    

    Apple의 지도를 표시하는 만큼은, 위의 2 커멘드만으로 준비 완료입니다. 공식 문서 가 좀처럼 읽기 어렵다(이하를 실행하라고 말해 보거나 불필요하다고 말하거나...), pod install 등해야 하는지 혼란했습니다. 분명히 Google Map을 표시하려는 경우를 제외하고 위의 두 명령을 실행하면 됩니다. 그건 그렇고, 옛날에는 조금 번거로웠던 것처럼 ( htps : // 이 m / 포 g / ms / 1121 36 31 09f1b2).

    지도 표시


  • index.ios.js에 다음을 구현합니다.
  • StyleSheet를 적용하지 않으면지도가 표시되지 않으므로주의

  • import React, { Component } from 'react';
    import { StyleSheet } from 'react-native';
    import MapView from 'react-native-maps';
    
    export default class Main extends Component {
      render() {
        return (
          <MapView
            style={styles.map}
            initialRegion={{
              latitude: 37.78825,
              longitude: -122.4324,
              latitudeDelta: 0.0922,
              longitudeDelta: 0.0421,
            }}
          />
        );
      }
    }
    
    const styles = StyleSheet.create({
      map: { ...StyleSheet.absoluteFillObject, },
    });
    
  • 빌드
  • react-native run-ios
    



    보충



    스타일 시트의 점 3 개는 무엇입니까?


  • 개체를 속성으로 확장하는 기법
  • h tp // // 야미베타. 는 bぉ. jp/엔트리/2016/09/06/112330

  • 좋은 웹페이지 즐겨찾기