android中使用地图的地方随处可见，今天记录一下网络路径生成自定义marker，点击标记弹出自定义的窗口(在这里使用的是高德地图)
在这里我们使用Grilde去加载网络图片，因为这个简直太方便了！
在android studio下，在app/build.gradle文件当中添加如下依赖：
compile 'com.github.bumptech.glide:glide:3.7.0'
接下来就是代码的实现部分
代码注释的比较详细
/**
* Created by Yyyyq on 2018/4/20 0009.
* 根据网络路径生成自定义marker,点击弹出自定义窗体
*/
public class CustomMapActivity extends AppCompatActivity implements AMap.OnMarkerClickListener,
AMap.InfoWindowAdapter,AMap.OnMapClickListener{
//标题头
private TextView textView;
//返回按钮
private ImageView back;
private MapView mMapView;
private AMap aMap;
Marker marker;
//指向当前的marker（用于控制infowindow显示与消失）
Marker nowMarker;
SimpleVO tempSimpleVO;
@Override
protected void onCreate(@Nullable Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_custommap);
mMapView = (MapView) findViewById(R.id.map);
mMapView.onCreate(savedInstanceState);
init();
back=(ImageView)findViewById(R.id.back);
textView = (TextView) findViewById(R.id.toolbar_title);
Toolbar toolbar = (Toolbar) findViewById(R.id.activity_main_toolbar);
textView.setText("生成网络图片Marker");
toolbar.setTitle("");
setSupportActionBar(toolbar);
setTranslucentBar();
//返回按钮
back.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
finish();
}
});
}
private void init() {
if (aMap == null) {
aMap = mMapView.getMap();
setUpMap();
//获取后台数据源
getDataSource();
}
}
/**
* 设置aMap属性
*/
private void setUpMap() {
aMap.setOnMarkerClickListener(this);// 设置点击marker事件监听器
aMap.setInfoWindowAdapter(this);//自定义弹出窗体
aMap.setOnMapClickListener(this);//地图点击事件
}
/**
* @Description:沉浸式标题
*/
protected void setTranslucentBar() {
if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.KITKAT) {
Window window = getWindow();
// Translucent status bar
window.setFlags(
WindowManager.LayoutParams.FLAG_TRANSLUCENT_STATUS,
WindowManager.LayoutParams.FLAG_TRANSLUCENT_STATUS);
}
getWindow().addFlags(WindowManager.LayoutParams.FLAG_TRANSLUCENT_STATUS);
}
/**
*在这里模拟方法请求到数据源，可根据实际
* 我们用自定义实体类SimpleVO接收数据源
*/
private void getDataSource(){
//网络请求 得到List
List<SimpleVO> list="后台传递的数据源";
if(list.size()>0){
//根据第一条数据经纬度经地图移动到所视区域
LatLng curLatlng = new LatLng(Double.parseDouble(list.get(0).getLatitude()),Double.parseDouble(list.get(0).getLongitude()));
aMap.moveCamera(CameraUpdateFactory.newLatLngZoom(curLatlng, 14f));
for(int i=0;i<list.size();i++){
final int j = i;
//利用强大的Glide加载图片,可放占位符等，可百度Glide属性
Glide.with(CustomMapActivity.this)
.load(list.get(i).getUrl())
.into(new SimpleTarget<GlideDrawable>(){
@Override
public void onResourceReady(GlideDrawable resource, GlideAnimation<? super GlideDrawable> glideAnimation) {
//展示图片
View view = LayoutInflater.from(CustomMapActivity.this).inflate(
R.layout.map_userimg, null);
RoundImageView imageView = (RoundImageView) view.findViewById(R.id.user_img);
tempSimpleVO=list.get(j);
imageView.setImageDrawable(resource);
Bitmap bitmap = convertViewToBitmap(view);
MarkerOptions markerOptions = new MarkerOptions();
markerOptions.anchor(1.5f, 3.5f);
markerOptions.position(new LatLng(Double.parseDouble(tempSimpleVO.getLatitude()),Double.parseDouble(tempSimpleVO.getLongitude())));
markerOptions.draggable(false);
markerOptions.title(tempSimpleVO.getName());
markerOptions.icon(BitmapDescriptorFactory.fromBitmap(bitmap));
marker = aMap.addMarker(markerOptions);
//把相应的对象赋给marker，adapter中通过这个对象给控件赋值
marker.setObject(tempSimpleVO);
}
});
}
}
}
/**
* 点击marker弹出窗口
* 返回true 地图不移动中心点
*/
@Override
public boolean onMarkerClick(Marker marker) {
nowMarker=marker;
nowMarker.showInfoWindow();
return true;
}
/**
* 自定义窗口布局
*/
@Override
public View getInfoWindow(Marker marker) {
View infoContent = LayoutInflater.from(CustomMapActivity.this).inflate(
R.layout.item_map_window, null);
render(marker, infoContent,2);
return infoContent;
}
/**
* 对窗口信息赋值
*/
public void render(Marker marker, View view,int mark) {
LinearLayout layout = (LinearLayout) view.findViewById(R.id.window_linearlayout);
//设置透明度
layout.getBackground().setAlpha(240);
TextView name = (TextView) view.findViewById(R.id.window_name);
TextView info = (TextView) view.findViewById(R.id.window_info);
SimpleVO simpleVO = (SimpleVO) marker.getObject();
name.setText(simpleVO.getName());
info.setText(simpleVO.getInfo());
}
/**
* 因自定义窗口 返回null
*/
@Override
public View getInfoContents(Marker marker) {
return null;
}
/**
* 重写地图点击事件，点击地图任意点隐藏infowindow窗口
*/
@Override
public void onMapClick(LatLng latLng) {
//隐藏infowindow窗口
nowMarker.hideInfoWindow();
}
@Override
protected void onResume() {
super.onResume();
mMapView.onResume();
}
@Override
protected void onPause() {
super.onPause();
mMapView.onPause();
}
@Override
protected void onSaveInstanceState(Bundle outState) {
super.onSaveInstanceState(outState);
mMapView.onSaveInstanceState(outState);
}
@Override
protected void onDestroy() {
super.onDestroy();
mMapView.onDestroy();
}
/**
* view转bitmap
*/
private static Bitmap convertViewToBitmap(View view){
view.measure(View.MeasureSpec.makeMeasureSpec(0, View.MeasureSpec.UNSPECIFIED), View.MeasureSpec.makeMeasureSpec(0, View.MeasureSpec.UNSPECIFIED));
view.layout(0, 0, view.getMeasuredWidth(), view.getMeasuredHeight());
view.buildDrawingCache();
Bitmap bitmap = view.getDrawingCache();
return bitmap;
}
}
接下来就是主页面的布局 activity_custommap
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<!--标题栏-->
<android.support.v7.widget.Toolbar
android:id="@+id/activity_main_toolbar"
android:layout_height="wrap_content"
android:layout_width="match_parent"
android:paddingTop="16dp"
android:minHeight="?attr/actionBarSize"
android:background="@color/bluestyle_button">
<ImageView
android:id="@+id/back"
android:layout_width="25dp"
android:layout_height="25dp"
android:layout_marginLeft="10dp"
android:layout_gravity="center|left"
android:src="@drawable/jiantouzuo"/>
<TextView
android:id="@+id/toolbar_title"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:textColor="#fff"
android:textSize="18sp"/>
</android.support.v7.widget.Toolbar>
<com.amap.api.maps.MapView
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/map"
android:layout_width="match_parent"
android:layout_height="match_parent" />
</LinearLayout>
代码中应用的实力类 SimpleVO
public class SimpleVO {
private String id;
private String name;
private String latitude;
private String longitude;
private String url;
private String info;
//省略get，set，toString方法，需自己导入
}
之后需要展示我们的自定义头像 map_userimg 因为展示的是头像，我们用到了圆形工具类，若没有该工具类可查看复制上一篇随笔，可直接粘贴复制
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="center">
<!--自定义圆形工具类-->
<!--若没有该工具类可赋值上一篇代码，Ctrl+c Ctrl+v可用-->
<com.bc.yyyyq.util.RoundImageView
android:id="@+id/user_img"
android:scaleType="fitCenter"
android:layout_width="30dp"
android:layout_height="30dp"/>
</LinearLayout>
最后我们需要展示我们自定义的marker的弹出窗体 item_map_window
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/window_linearlayout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="@drawable/brokermap_layout"
android:padding="10dp"
android:orientation="vertical">
<!--姓名-->
<LinearLayout
android:layout_width="match_parent"
android:layout_height="30dp"
android:orientation="horizontal">
<TextView
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:gravity="center"
android:text="姓名："
android:textColor="#515151"
android:textSize="14sp"/>
<TextView
android:id="@+id/window_name"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_marginLeft="5dp"
android:gravity="center|left"
android:text=""
android:textColor="#515151"
android:textSize="14sp"/>
</LinearLayout>
<View
android:layout_width="match_parent"
android:layout_height="1dp"
android:background="#f2f2f2" />
<!--个人信息-->
<LinearLayout
android:layout_width="match_parent"
android:layout_height="30dp"
android:orientation="horizontal">
<TextView
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:text="个人信息："
android:gravity="center"
android:textColor="#515151"
android:textSize="14sp"/>
<TextView
android:id="@+id/window_info"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center|left"
android:layout_marginLeft="5dp"
android:text=""
android:textColor="#515151"
android:textSize="14sp"/>
</LinearLayout>
<View
android:layout_width="match_parent"
android:layout_height="1dp"
android:background="#f2f2f2" />
</LinearLayout>
就这样就完成了自定义网络图片的marker和点击标识弹出我们自定义的窗口，想要的效果就展示出来了