android开发百度地图怎么实现自定义弹出窗口

Posted 2023-05-07

参考技术A 　　基本原理就是用ItemizedOverlay来添加附加物，在OnTap方法中向MapView上添加一个自定义的View（如果已存在就直接设为可见），下面具体来介绍我的实现方法：
　　一、自定义覆盖物类：MyPopupOverlay，这个类是最关键的一个类ItemizedOverlay，用于设置Marker，并定义Marker的点击事件，弹出窗口，至于弹出窗口的内容，则通过定义Listener，放到Activity中去构造。如果没有特殊需求，这个类不需要做什么改动。代码如下，popupLinear这个对象，就是加到地图上的自定义View：
　　public class MyPopupOverlay extends ItemizedOverlay<OverlayItem>

　　private Context context = null;
// 这是弹出窗口， 包括内容部分还有下面那个小三角
private LinearLayout popupLinear = null;
// 这是弹出窗口的内容部分
private View popupView = null;
private MapView mapView = null;
private Projection projection = null;
　　// 这是弹出窗口内容部分使用的layoutId，在Activity中设置
private int layoutId = 0;
// 是否使用百度带有A-J字样的Marker
private boolean useDefaultMarker = false;
private int[] defaultMarkerIds = R.drawable.icon_marka,
R.drawable.icon_markb, R.drawable.icon_markc,
R.drawable.icon_markd, R.drawable.icon_marke,
R.drawable.icon_markf, R.drawable.icon_markg,
R.drawable.icon_markh, R.drawable.icon_marki,
R.drawable.icon_markj, ;
　　// 这个Listener用于在Marker被点击时让Activity填充PopupView的内容
private OnTapListener onTapListener = null;
　　public MyPopupOverlay(Context context, Drawable marker, MapView mMapView)
super(marker, mMapView);
this.context = context;
this.popupLinear = new LinearLayout(context);
this.mapView = mMapView;
popupLinear.setOrientation(LinearLayout.VERTICAL);
popupLinear.setVisibility(View.GONE);
projection = mapView.getProjection();

　　@Override
public boolean onTap(GeoPoint pt, MapView mMapView)
// 点击窗口以外的区域时，当前窗口关闭
if (popupLinear != null && popupLinear.getVisibility() == View.VISIBLE)
LayoutParams lp = (LayoutParams) popupLinear.getLayoutParams();
Point tapP = new Point();
projection.toPixels(pt, tapP);
Point popP = new Point();
projection.toPixels(lp.point, popP);
int xMin = popP.x - lp.width / 2 + lp.x;
int yMin = popP.y - lp.height + lp.y;
int xMax = popP.x + lp.width / 2 + lp.x;
int yMax = popP.y + lp.y;
if (tapP.x < xMin || tapP.y < yMin || tapP.x > xMax
|| tapP.y > yMax)
popupLinear.setVisibility(View.GONE);

return false;

　　@Override
protected boolean onTap(int i)
// 点击Marker时，该Marker滑动到地图中央偏下的位置，并显示Popup窗口
OverlayItem item = getItem(i);
if (popupView == null)
// 如果popupView还没有创建，则构造popupLinear
if (!createPopupView())
return true;


if (onTapListener == null)
return true;
popupLinear.setVisibility(View.VISIBLE);
onTapListener.onTap(i, popupView);
　　popupLinear.measure(0, 0);
int viewWidth = popupLinear.getMeasuredWidth();
int viewHeight = popupLinear.getMeasuredHeight();
　　LayoutParams layoutParams = new LayoutParams(viewWidth, viewHeight,
item.getPoint(), 0, -60, LayoutParams.BOTTOM_CENTER);
layoutParams.mode = LayoutParams.MODE_MAP;
　　popupLinear.setLayoutParams(layoutParams);
Point p = new Point();
projection.toPixels(item.getPoint(), p);
p.y = p.y - viewHeight / 2;
GeoPoint point = projection.fromPixels(p.x, p.y);
　　mapView.getController().animateTo(point);
return true;

　　private boolean createPopupView()
// TODO Auto-generated method stub
if (layoutId == 0)
return false;
popupView = LayoutInflater.from(context).inflate(layoutId, null);
popupView.setBackgroundResource(R.drawable.popupborder);
ImageView dialogStyle = new ImageView(context);
dialogStyle.setImageDrawable(context.getResources().getDrawable(
R.drawable.iw_tail));
popupLinear.addView(popupView);
android.widget.LinearLayout.LayoutParams lp = new android.widget.LinearLayout.LayoutParams(
LayoutParams.MATCH_PARENT, LayoutParams.WRAP_CONTENT);
lp.topMargin = -2;
lp.leftMargin = 60;
popupLinear.addView(dialogStyle, lp);
mapView.addView(popupLinear);
return true;

　　@Override
public void addItem(List<OverlayItem> items)
// TODO Auto-generated method stub
int startIndex = getAllItem().size();
for (OverlayItem item : items)
if (startIndex >= defaultMarkerIds.length)
startIndex = defaultMarkerIds.length - 1;
if (useDefaultMarker && item.getMarker() == null)
item.setMarker(context.getResources().getDrawable(
defaultMarkerIds[startIndex++]));


super.addItem(items);

　　@Override
public void addItem(OverlayItem item)
// TODO Auto-generated method stub
// 重载这两个addItem方法，主要用于设置自己默认的Marker
int index = getAllItem().size();
if (index >= defaultMarkerIds.length)
index = defaultMarkerIds.length - 1;
if (useDefaultMarker && item.getMarker() == null)
item.setMarker(context.getResources().getDrawable(
defaultMarkerIds[getAllItem().size()]));

super.addItem(item);

　　public void setLayoutId(int layoutId)
this.layoutId = layoutId;

　　public void setUseDefaultMarker(boolean useDefaultMarker)
this.useDefaultMarker = useDefaultMarker;

　　public void setOnTapListener(OnTapListener onTapListener)
this.onTapListener = onTapListener;

　　public interface OnTapListener
public void onTap(int index, View popupView);

本回答被提问者和网友采纳

Android在GoogleMap（百度地图）实现自定义指南针旋转与回正功能

Android在GoogleMap（百度地图）实现自定义指南针旋转与回正功能

• 关于
• • 效果图
  • 实现（这里只讲googleMap）

关于

  因为项目需要，需要在googleMap上面自定义指南针，实现指南针实时根据地图方位变化转动，点击指南针方位回正两个功能。

效果图

  可以参考高德地图导航开始后地图旋转的指南针效果。
  因为手机像素过高的原因，导致我没法一次上传上来，这个是旋转效果。

  定位回正

实现（这里只讲googleMap）

  关于GoogleMap的引用可以先看这篇《Android使用GoogleMap实现定位及定位回正》
我们新建一个activity，修改activity_google_maps.xml(compass的图标可以去阿里巴巴图标库等去找即可):

<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context="com.stationdm.kawasaki.GoogleMapsActivity">
    <fragment
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:name="com.google.android.gms.maps.SupportMapFragment"
        android:id="@+id/map"/>

    <com.google.android.material.floatingactionbutton.FloatingActionButton
        android:id="@+id/fab_compass_location"
        android:layout_width="48dp"
        android:layout_height="48dp"
        android:src="@drawable/ic_map_compass_icon"
        app:fabCustomSize="48dp"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        android:layout_marginEnd="16dp"
        android:layout_marginTop="16dp" />

</androidx.constraintlayout.widget.ConstraintLayout>

  修改GoogleMapsActivity：

private var map:GoogleMap? = null

override fun onCreate(savedInstanceState: Bundle?) 
        super.onCreate(savedInstanceState)
        binding = ActivityGoogleMapsBinding.inflate(layoutInflater)
        setContentView(binding.root)
        val mapFragment : SupportMapFragment = supportFragmentManager.findFragmentById(R.id.map) as SupportMapFragment
        mapFragment.getMapAsync(this)
         //指南针回正
        binding.fabCompassLocation.setOnSingleClickListener 
            map?.cameraPosition?.target?.let 
                val cameraPosition = CameraPosition.Builder()
                    .target(LatLng(it.latitude, it.longitude))
                    .zoom(map!!.cameraPosition.zoom)
                    .bearing(0f)
                    .tilt(map!!.cameraPosition.tilt)
                    .build()
                map!!.animateCamera(CameraUpdateFactory.newCameraPosition(cameraPosition))
            
        
    

  @SuppressLint("MissingPermission")
    override fun onMapReady(googleMap: GoogleMap) 
        map = googleMap
        googleMap.mapType = GoogleMap.MAP_TYPE_HYBRID
        //关于定位权限在我这里就不做赘述了，这里假设定位以及成功了
        map?.setCompassEnabled(false)//这里可以打开看一下我们实际效果和自带的是否有差异
        //添加相机移动的监听和空闲监听用来作为控制指南针监听的开关
        map?.setOnCameraMoveStartedListener(this)
        map?.setOnCameraIdleListener(this)
        //页面继承方法
   
  override fun onCameraMoveStarted(p0: Int) 
        when (p0) 
            GoogleMap.OnCameraMoveStartedListener.REASON_GESTURE -> //手势引起的地图移动
                openRotation(true)
            
        
    

    override fun onCameraIdle() 
        openRotation(false)
    
    
    //是否开启旋转
  private fun openRotation(isOpen: Boolean) 
        if (isOpen) 
            job?.cancel()
            job = lifecycleScope.launch 
                delay(100) //测试发现延迟0.1ms效果比较流畅
                map?.cameraPosition?.bearing?.let 
                    binding.fabCompassLocation.rotation = -it
                    openRotation(isOpen)
                
            
        
    

  本篇到此就结束了，有问题欢迎批评指教，觉得不错的也请点个赞，谢谢