百度地图创建InfoWindow自定义View显示

最近学习使用百度地图,自己做了个可以简单搜索兴趣点,设置搜索范围,搜索关键字,定位功能的应用。在使用百度地图API时发现了问题。
我想要完成的需求是:
    在地图上长按然后弹出自定义的View,并且能与用户进行交互操作。

但在百度地图开发指南中关于弹出覆盖物就简单的一段实例,如下: 查看连接
  1. 弹出窗覆盖物  
  2.   
  3. 弹出窗覆盖物的实现方式如下,开发者可利用此接口,构建具有更强交互性的地图页面。  
  4. //创建InfoWindow展示的view    
  5. Button button = new Button(getApplicationContext());    
  6. button.setBackgroundResource(R.drawable.popup);    
  7. //定义用于显示该InfoWindow的坐标点    
  8. LatLng pt = new LatLng(39.86923, 116.397428);    
  9. //创建InfoWindow , 传入 view, 地理坐标, y 轴偏移量   
  10. InfoWindow mInfoWindow = new InfoWindow(button, pt, -47);    
  11. //显示InfoWindow    
  12. mBaiduMap.showInfoWindow(mInfoWindow);  
  13. 下图为点击Marker弹出InfoWindow的示例图,开发者只需将InfoWindow的显示方法写在Maker的点击事件处理中即可实现该效果。  
  14. 运行结果如下:  



从上面简单的代码看出, InfoWindow可以显示View,但上面的实例仅仅是使用代码动态的创建了一个简单的View,但能不能从xml初始化一个自定义复杂的View呢?

在网上查阅资料发现各种答案,可能是度娘的原因,反正是没有找到有效的方法。有的解决了,但方法超复杂,不忍直视了。

自己就去查阅百度API,在InfoWindow的构造方法:

  1. InfoWindow  
  2.   
  3. public InfoWindow(View view,  
  4.           LatLng position,  
  5.           int yOffset)  
  6.   
  7. 通过传入的 view 构造一个 InfoWindow, 此时只是利用该view生成一个Bitmap绘制在地图中。  
  8.   
  9. 参数:  
  10.     view - InfoWindow 展示的 view  
  11.     position - InfoWindow 显示的地理位置  
  12.     yOffset - InfoWindow Y 轴偏移量  
  13.     listener - InfoWindow 点击监听者  
  14. 抛出:  
  15.     java.lang.IllegalArgumentException - view 和 position 不能为 null  

发现了InfoWindow的构造方法中,第一参数要求的是View,那能不能传入一个自定义的View呢,说干就干,就自己创建一个View,并将其传入InfoWindow,核心代码如下:

  1. //====================地图长按监听=============================  
  2.   
  3.     @Override  
  4.   
  5.     public void onMapLongClick(final LatLng latLng) {  
  6.   
  7.         //将长按点设置为地图显示中心  
  8.   
  9.         MapStatusUpdate mapStatusUpdate = MapStatusUpdateFactory.newLatLng(latLng);  
  10.   
  11.         map.animateMapStatus(mapStatusUpdate);  
  12.   
  13.         map.clear();//清空地图上的标记  
  14.   
  15.         //长按点位置显示标记  
  16.   
  17.         markerOptions = new MarkerOptions();  
  18.   
  19.         markerOptions.position(latLng);  
  20.   
  21.         BitmapDescriptor bitmapDescriptor = BitmapDescriptorFactory.fromResource(R.drawable.location1);  
  22.   
  23.         markerOptions.icon(bitmapDescriptor);  
  24.   
  25.         markerOptions.zIndex(9);  
  26.   
  27.         Marker marker = (Marker) map.addOverlay(markerOptions);  
  28.   
  29.         //从xml创建要显示的View,并设置相应的值  
  30.   
  31.         LayoutInflater inflater = LayoutInflater.from(getApplicationContext());  
  32.   
  33.         View view = inflater.inflate(R.layout.layout_map_item, null);  
  34.   
  35.         TextView txtLatLng = (TextView)view.findViewById(R.id.text_item_latlng);  
  36.   
  37.         final EditText background = (EditText) view.findViewById(R.id.ed_item_background);  
  38.   
  39.         final EditText keyWord = (EditText) view.findViewById(R.id.ed_item_keyword);  
  40.   
  41.         Button btnSearch = (Button) view.findViewById(R.id.btn_search);  
  42.   
  43.         Button btnCancel = (Button) view.findViewById(R.id.btn_cancel);  
  44.   
  45.         txtLatLng.setText("纬度:"+latLng.latitude+",经度:"+latLng.longitude);  
  46.   
  47.         final LatLng lngFinal = latLng;  
  48.   
  49.         //点击view上面的检索按钮调用方法  
  50.   
  51.         btnSearch.setOnClickListener(new View.OnClickListener() {  
  52.   
  53.             @Override  
  54.   
  55.             public void onClick(View v) {  
  56.   
  57.                 //Log.d("WorkMainActivity","搜索附近500米");  
  58.   
  59.                 map.clear();//清空地图上的标记  
  60.   
  61.                 String circumBackground = background.getText().toString();  
  62.   
  63.                 if(null==circumBackground||"".equals(circumBackground)){  
  64.   
  65.                     return;  
  66.   
  67.                 }else {  
  68.   
  69.                     String keyWordString = keyWord.getText().toString();  
  70.   
  71.                     if(null==keyWordString||"".equals(keyWordString)){  
  72.   
  73.                         return;  
  74.   
  75.                     }else {  
  76.   
  77.                         int circum = Integer.parseInt(circumBackground);  
  78.   
  79.                         PoiNearbySearchOption poiNearbySearchOption = new PoiNearbySearchOption();  
  80.   
  81.                         poiNearbySearchOption.location(lngFinal);  
  82.   
  83.                         //以长按坐标点为中心,画指定半径的圆,并制定透明度为100,作为搜索范围  
  84.   
  85.                         CircleOptions circleOptions = new CircleOptions();  
  86.   
  87.                         circleOptions.center(lngFinal);  
  88.   
  89.                         circleOptions.radius(circum);  
  90.   
  91.                         circleOptions.fillColor(Color.argb(100,28,95,167));  
  92.   
  93.                         map.addOverlay(circleOptions);  
  94.   
  95.                         poiNearbySearchOption.keyword(keyWordString);  
  96.   
  97.                         poiNearbySearchOption.radius(circum);  
  98.   
  99.                         poiSearch.searchNearby(poiNearbySearchOption);  
  100.   
  101.                         poiSearch.setOnGetPoiSearchResultListener(WorkMainActivity.this);  
  102.   
  103.                     }  
  104.   
  105.                 }  
  106.   
  107.             }  
  108.   
  109.         });  
  110.   
  111.         //点击取消按钮  
  112.   
  113.         btnCancel.setOnClickListener(new View.OnClickListener() {  
  114.   
  115.             @Override  
  116.   
  117.             public void onClick(View v) {  
  118.   
  119.                 //Log.d("WorkMainActivity","取消搜索");  
  120.   
  121.                 map.hideInfoWindow();  
  122.   
  123.             }  
  124.   
  125.         });  
  126.   
  127.         InfoWindow infoWindow = new InfoWindow(view, latLng, -47);  
  128.   
  129.         map.showInfoWindow(infoWindow);  
  130.   
  131.     }  

至于View的定义文件,即layout_map_item文件代码如下:

  1. <?xml version="1.0" encoding="utf-8"?>  
  2. <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"  
  3.               android:orientation="vertical"  
  4.               android:layout_width="wrap_content"  
  5.               android:background="#2B9685"  
  6.               android:layout_height="wrap_content">  
  7.     <TextView  
  8.             android:layout_width="100dp"  
  9.             android:layout_height="wrap_content"  
  10.             android:text="搜索附近"  
  11.             android:textSize="20sp"  
  12.             android:layout_gravity="center_horizontal"  
  13.             android:gravity="center_horizontal"  
  14.             />  
  15.     <TextView  
  16.             android:id="@+id/text_item_latlng"  
  17.             android:layout_width="wrap_content"  
  18.             android:layout_height="wrap_content"  
  19.             android:layout_gravity="center_horizontal"  
  20.             android:background="#37B158"  
  21.             />  
  22.     <LinearLayout  
  23.             android:orientation="horizontal"  
  24.             android:layout_width="match_parent"  
  25.             android:layout_height="wrap_content">  
  26.         <EditText  
  27.                 android:id="@+id/ed_item_background"  
  28.                 android:layout_width="0dp"  
  29.                 android:layout_height="wrap_content"  
  30.                 android:layout_weight="1"  
  31.                 android:background="#58C7F9"  
  32.                 android:hint="范围(m)"  
  33.                 />  
  34.         <EditText  
  35.                 android:id="@+id/ed_item_keyword"  
  36.                 android:layout_width="0dp"  
  37.                 android:layout_height="wrap_content"  
  38.                 android:layout_weight="1"  
  39.                 android:background="#BCEAA7"  
  40.                 android:hint="关键字"  
  41.   
  42.                 />  
  43.     </LinearLayout>  
  44.     <LinearLayout  
  45.             android:orientation="horizontal"  
  46.             android:layout_width="match_parent"  
  47.             android:layout_height="wrap_content">  
  48.         <Button  
  49.                 android:id="@+id/btn_search"  
  50.                 android:layout_width="0dp"  
  51.                 android:layout_height="wrap_content"  
  52.                 android:background="#BABA66"  
  53.                 android:textSize="20sp"  
  54.                 android:text="检索"  
  55.                 android:layout_weight="1"  
  56.                 />  
  57.         <Button  
  58.                 android:id="@+id/btn_cancel"  
  59.                 android:layout_width="0dp"  
  60.                 android:layout_height="wrap_content"  
  61.                 android:background="#BABAFF"  
  62.                 android:textSize="20sp"  
  63.                 android:layout_weight="1"  
  64.                 android:text="取消"  
  65.                 />  
  66.     </LinearLayout>  
  67.   
  68.   
  69. </LinearLayout>  

结果发现,确实可行,运行效果如下:(注:该程序编译版本API 19,需要手机,模拟器4.4.2以上的版本才能正常运行,如果版本过低,可以更改 AndroidManifest.xml中的<uses-sdk android:minSdkVersion="19"/>标签,改成相应版本即可)




(下面附上程序全部代码)

下载源代码


// 截图,在SnapshotReadyCallback中保存图片到 sd 卡
                    mBaiduMap.snapshot(new SnapshotReadyCallback() {
                        public void onSnapshotReady(Bitmap snapshot) {
                            File file = new File("/mnt/sdcard/test.png");
                            FileOutputStream out;
                            try {
                                out = new FileOutputStream(file);
                                if (snapshot.compress(
                                        Bitmap.CompressFormat.PNG, 100, out)) {
                                    out.flush();
                                    out.close();
                                }
                                Toast.makeText(MapControlDemo.this,
                                        "屏幕截图成功,图片存在: " + file.toString(),
                                        Toast.LENGTH_SHORT).show();
                            } catch (FileNotFoundException e) {
                                e.printStackTrace();
                            } catch (IOException e) {
                                e.printStackTrace();
                            }
                        }
                    });


©️2020 CSDN 皮肤主题: 大白 设计师:CSDN官方博客 返回首页