NativeScript 6+&Angular 8+：Google Maps定位按钮已启用却不显示如何解决

我之前也碰到过一模一样的情况，结合你的代码和这个Google Maps插件的特性，咱们可以从这几个方向排查修复：

1. 先确认位置权限配置&授权 #

这个按钮能显示的前提是App有权限获取位置信息，所以先检查平台配置：

• Android：在AndroidManifest.xml里添加必要权限：

  <uses-permission android:name="android.permission.ACCESS_FINE_LOCATION" />
  <uses-permission android:name="android.permission.ACCESS_COARSE_LOCATION" />
  

• iOS：在Info.plist里添加权限说明（iOS要求必须给用户解释权限用途）：

  <key>NSLocationWhenInUseUsageDescription</key>
  <string>需要获取您的位置来显示当前定位</string>
  <key>NSLocationAlwaysUsageDescription</key>
  <string>需要获取您的位置来显示当前定位</string>
  

之后在组件里主动请求权限，比如在ngOnInit里添加：

import { Permissions } from "nativescript-permissions";

public ngOnInit() {
  Permissions.requestPermission(
    android.Manifest.permission.ACCESS_FINE_LOCATION, // Android端权限标识
    "需要位置权限来显示您的当前位置"
  ).then(() => {
    console.log("位置权限已授权");
  }).catch(() => {
    console.log("位置权限被拒绝");
  });
}

2. 同时启用myLocationEnabled和myLocationButtonEnabled #

你当前模板只设置了myLocationButtonEnabled="true"，但这个插件的逻辑是：必须先开启位置追踪（myLocationEnabled），位置按钮才会显示。而且你模板里的myLocationTapped绑定少了圆括号，修正后模板代码如下：

<MapView row="1" #mapView i-padding="50,50,50,50" 
  (mapReady)="onMapReady($event)" 
  myLocationButtonEnabled="true" 
  myLocationEnabled="true"
  (myLocationTapped)="myLocationTapped()" 
  iosOverflowSafeArea="true">
</MapView>

3. 检查布局padding是否遮挡按钮 #

你给MapView设置了i-padding="50,50,50,50"，这个内边距可能在部分设备上把右下角默认位置的“我的位置”按钮完全挡住了。可以先临时去掉padding测试：

<MapView row="1" #mapView 
  (mapReady)="onMapReady($event)" 
  myLocationButtonEnabled="true" 
  myLocationEnabled="true"
  (myLocationTapped)="myLocationTapped()" 
  iosOverflowSafeArea="true">
</MapView>

如果按钮显示了，再根据需求调整布局间距，避免遮挡按钮。

4. 代码手动启用（备选方案） #

如果上面的设置还是不生效，可以在地图初始化完成后，通过代码强制启用：

public onMapReady(event) {
  console.log(" map ready ");
  const mapView = event.object;
  this.mapView = mapView;
  // 手动开启位置追踪和按钮显示
  mapView.myLocationEnabled = true;
  mapView.myLocationButtonEnabled = true;
}

按这几个步骤排查下来，基本就能解决按钮不显示的问题了。

内容的提问来源于stack exchange，提问作者user1261710