react-native-maps, google map

오영일·2024년 6월 2일

ReactNative

목록 보기
7/9

https://github.com/react-native-maps/react-native-maps/blob/master/docs/installation.md

react-native-maps 설치

  1. yarn add react-native-maps

  2. npx pod-install ios

  3. ios/[service]App/AppDelegate.mm 경로에

    #import <GoogleMaps/GoogleMaps.h>

    [GMSServices provideAPIKey:@"YOUR_API_KEY"];

#import "AppDelegate.h"

#import <GoogleMaps/GoogleMaps.h>
#import <React/RCTBundleURLProvider.h>

@implementation AppDelegate

- (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions
{
  [GMSServices provideAPIKey:@"_YOUR_API_KEY_"];
  self.moduleName = @"ReviewItApp";

를 추가하고 YOUR_API_KEY여기에 구글 맵 API 키를 넣어줍니다.

  1. Podfile파일에
    platform :ios, '13.4'이걸로 변경해주고

rn_maps_path = '../node_modules/react-native-maps'
pod 'react-native-google-maps', :path => rn_maps_path
여기 두 줄을 추가해줍니다

platform :ios, '13.4'
prepare_react_native_project!


rn_maps_path = '../node_modules/react-native-maps'
pod 'react-native-google-maps', :path => rn_maps_path
config = use_native_modules!

config = use_native_modules!위에 두 줄을 추가해주면 됩니다.

  1. npx pod-install ios
  2. android/app/src/main/AndroidManifest.xml여기에
   <meta-data
     android:name="com.google.android.geo.API_KEY"
     android:value="Your Google maps API Key Here"/>

이 코드를 추가해주고 구글 맵 API 키를 넣어줍니다.

  1. info.plist에
<key>NSLocationAlwaysAndWhenInUseUsageDescription</key>
<string>위치 확인을 위해서 위치 접근 권한 동의가 필요합니다.</string>
<key>NSLocationAlwaysUsageDescription</key>
<string>위치 확인을 위해서 위치 접근 권한 동의가 필요합니다.</string>
<key>NSLocationWhenInUseUsageDescription</key>
<string>위치 확인을 위해서 위치 접근 권한 동의가 필요합니다.</string>
<key>NSMotionUsageDescription</key>
<string>위치 확인을 위해서 위치 접근 권한 동의가 필요합니다.</string>

코드를 추가해줍니다.
설명을 자세하게 작성해야 앱 배포시 거절당하지 않습니다.

profile
ISurrender

0개의 댓글