Android Google Maps API v2：实现可调整大小的圆形功能

嘿，这个需求我之前刚好做过！Google Maps的Circle确实没有原生的拖拽调整功能，不过咱们可以自己组合现有API来实现，思路其实很清晰，下面给你一步步拆解：

1. 初始化基础组件 #

首先先创建固定的中心Marker、初始Circle，还有那个用来拖拽调整半径的「控点」Marker：

// 固定中心坐标
LatLng centerPoint = new LatLng(-33.87365, 151.20689);

// 添加固定中心Marker（设置draggable为false，禁止拖动）
Marker centerMarker = map.addMarker(new MarkerOptions()
        .position(centerPoint)
        .draggable(false)
        .title("固定中心"));

// 初始化Circle，给填充色加个透明度会更友好
Circle adjustableCircle = map.addCircle(new CircleOptions()
        .center(centerPoint)
        .radius(10000) // 初始半径10km
        .strokeColor(Color.RED)
        .fillColor(Color.argb(70, 0, 0, 255)));

// 添加圆周上的拖拽控点Marker，初始位置在中心正北方（和Circle初始半径对应）
// 这里用到了Google Maps工具库的SphericalUtil，后面会说依赖
LatLng initialControlPoint = SphericalUtil.computeOffset(centerPoint, adjustableCircle.getRadius(), 0);
Marker radiusControlMarker = map.addMarker(new MarkerOptions()
        .position(initialControlPoint)
        .draggable(true)
        .icon(BitmapDescriptorFactory.defaultMarker(BitmapDescriptorFactory.HUE_ORANGE)));

上面用到的SphericalUtil是Google官方的地图工具类，需要在build.gradle里加依赖：

implementation 'com.google.maps.android:android-maps-utils:2.2.0'

2. 监听控点Marker的拖动事件 #

接下来给控点Marker绑定拖动监听，实时计算它和中心的距离，然后更新Circle的半径：

map.setOnMarkerDragListener(new GoogleMap.OnMarkerDragListener() {
    @Override
    public void onMarkerDragStart(Marker marker) {
        // 只响应控点Marker的拖动事件
        if (marker.equals(radiusControlMarker)) {
            // 这里可以加个拖动开始的反馈，比如改变控点图标颜色
        }
    }

    @Override
    public void onMarkerDrag(Marker marker) {
        if (marker.equals(radiusControlMarker)) {
            // 计算控点和中心的球面距离（单位：米，和Circle半径单位一致）
            double newRadius = SphericalUtil.computeDistanceBetween(centerPoint, marker.getPosition());
            // 实时更新Circle的半径
            adjustableCircle.setRadius(newRadius);
        }
    }

    @Override
    public void onMarkerDragEnd(Marker marker) {
        if (marker.equals(radiusControlMarker)) {
            // 拖动结束后的收尾操作，比如保存最终半径值
        }
    }
});

3. 额外优化建议 #

• 强制控点在圆周上：如果担心用户把控点拖到Circle外面，可以在拖动时把控点拉回当前圆周：

  @Override
  public void onMarkerDrag(Marker marker) {
      if (marker.equals(radiusControlMarker)) {
          // 计算中心到控点的方向角
          double bearing = SphericalUtil.computeHeading(centerPoint, marker.getPosition());
          // 计算新半径
          double newRadius = SphericalUtil.computeDistanceBetween(centerPoint, marker.getPosition());
          // 更新Circle
          adjustableCircle.setRadius(newRadius);
          // 把控点拉回圆周上
          LatLng correctedPosition = SphericalUtil.computeOffset(centerPoint, newRadius, bearing);
          marker.setPosition(correctedPosition);
      }
  }
  

• 限制半径范围：如果需要控制半径的最大/最小值，在计算newRadius时加个判断：

  double minRadius = 100; // 最小100米
  double maxRadius = 50000; // 最大50公里
  newRadius = Math.max(minRadius, Math.min(maxRadius, newRadius));
  

• 添加平滑动画：可以给Circle的半径变化加个属性动画，让调整过程更流畅。

原理说明 #

Google Maps的Circle本身是静态图形，但我们通过「拖拽Marker + 实时计算球面距离更新Circle半径」的方式，模拟出了可调整大小的交互，完全基于现有API实现，不需要自定义View，兼容性也很好。

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