Android Baidu Map SDK v3.0.0 (iii) Add overlay marker and Infowindow use

Source: Internet
Author: User

Reprint please indicate source: http://blog.csdn.net/lmj623565791/article/details/37737213

The previous blog has achieved the location of the map and a combination of direction sensor user Road fetish positioning direction, if you are not clear, please check: Android Baidu map SDK v3.0.0 (ii) Positioning and combination of direction sensor, this chapter will teach you how to add covering, to achieve the surrounding search, And the effect of the introduction of the overlay on the click Appearance.


Our demand is, when the user clicks on the basic necessities, or to the nearby search is, returns the data from the server (latitude and longitude, the merchant information, the introduction and so on), then dynamically generates the covering, achieves the above effect. About the picture, due to the limited memory on the phone, all the picture download should be stored in the preset cache, such as LRUCache, and then need to be taken from the cache, the cache is not, the download is done into the cache, that is, the implementation of all the memory of the image will never exceed the cache preset memory value, Of course, this is not the point of this article, I took a few pictures directly into our project simulation.

1. The entity that hosts the data

The part of the data that we return from the server, which may end up being a JSON array, we need to convert to the entity collection, the following info.java:

Package Com.zhy.zhy_baidu_ditu_demo03;import Java.io.serializable;import Java.util.arraylist;import java.util.List ;p Ublic class Info implements serializable{private static final long serialversionuid = -758459502806858414l;/** * Precision */PR  Ivate Double latitude;/** * Latitude */private double longitude;/** * picture ID, real project may be picture path */private int imgid;/** * Merchant name */private String name;/** * Distance */private string distance;/** * number of likes */private int zan;public static list<info> infos = new ARR Aylist<info> (); Static{infos.add (New Info (34.242652, 108.971171, R.drawable.a01, "British Aristocrat Inn", "Distance 209 m", 1456)); Infos.add (new info (34.242952, 108.972171, R.DRAWABLE.A02, "Manhole International Bath Club", "distance 897 m", 456)), Infos.add (new info (34.242852, 108.973171, r.drawable.a03, "Five Rings Clothing City", "distance 249 m", 1456)); Infos.add (New Info (34.242152, 108.971971, R.drawable.a04, " Lao mi home Paomo Fry "," distance 679 M ", 1456));} Public Info () {}public info (double latitude, double longitude, int imgid, String name,string distance, int Zan) {super (); thi S.latitude = Latitude;this.longItude = Longitude;this.imgid = Imgid;this.name = Name;this.distance = Distance;this.zan = Zan;} Public double Getlatitude () {return latitude;} public void Setlatitude (double latitude) {this.latitude = latitude;} Public double Getlongitude () {return longitude;} public void Setlongitude (double longitude) {this.longitude = longitude;} Public String GetName () {return name;} public int Getimgid () {return imgid;} public void Setimgid (int imgid) {this.imgid = Imgid;} public void SetName (String name) {this.name = name;} Public String getdistance () {return distance;} public void Setdistance (String distance) {this.distance = distance;} public int Getzan () {return Zan;} public void Setzan (int zan) {This.zan = Zan;}}

I declare a static list collection directly in the entity class, simulating the data Info.infos returned from the server.

2. Add overlay dynamically in the map

For convenience, I put the button on the menu:

@Overridepublic boolean onoptionsitemselected (MenuItem item) {switch (Item.getitemid ()) {case R.ID.ID_MENU_MAP_ Addmaker:addinfosoverlay (Info.infos); }}

/** * Initialize layer */public void Addinfosoverlay (list<info> infos) {mbaidumap.clear (); LATLNG latlng = null;overlayoptions overlayoptions = null; Marker Marker = null;for (Info info:infos) {//Position latlng = new Latlng (Info.getlatitude (), Info.getlongitude ());//Icon Overla Yoptions = new Markeroptions (). Position (LATLNG). Icon (miconmaker). ZIndex (5); marker = (marker) (Mbaidumap.addoverlay ( Overlayoptions)); Bundle bundle = new bundle (); Bundle.putserializable ("info", info); Marker.setextrainfo (bundle);} Move the map to the last latitude and longitude position mapstatusupdate u = mapstatusupdatefactory.newlatlng (latlng); Mbaidumap.setmapstatus (u);}

As you can see, we iterate to add the overlay and then set up the merchant's information in the returned marker, and when the user clicks on marker, they get the merchant data generation details layout.

3. Add a click event for marker on the map:

Click Mbaidumap.setonmarkerclicklistener for marker (new Onmarkerclicklistener () {@Overridepublic Boolean Onmarkerclick ( Final Marker Marker) {//Get data in Marker info info = (info) marker.getextrainfo (). Get ("info"); Infowindow minfowindow;// Generate a TextView user in the map showing Infowindowtextview location = new TextView (Getapplicationcontext ()); Location.setbackgroundresource (r.drawable.location_tips); location.setpadding (a), Location.settext ( Info.getname ());//marker The latitude and longitude of the information into the screen coordinates final LATLNG LL = Marker.getposition (); Point P = mbaidumap.getprojection (). Toscreenlocation (ll); LOG.E (TAG, "--!" + p.x + "," + p.y);p. Y-= 47; LATLNG Llinfo = Mbaidumap.getprojection (). Fromscreenlocation (P);//Add click event for popup Infowindow = new Minfowindow ( Location, Llinfo,new Oninfowindowclicklistener () {@Overridepublic void Oninfowindowclick () {// Hide Infowindowmbaidumap.hideinfowindow ();}); /Display Infowindowmbaidumap.showinfowindow (Minfowindow);//Set details layout to visible mmarkerinfoly.setvisibility (view.visible);// Set information for details layout based on business information Popupinfo (mMaRkerinfoly, info); return true;}); 

Add data to the controls in the details layout based on the merchant's information Info.java (remember to create a textview, set the background first, then set the padding, otherwise it may fail ~ ~ ~)

/** * Set information for controls on layout based on info *  * @param mMarkerInfo2 * @param info */protected void Popupinfo (Relativelayout mmarkerly, INF o info) {Viewholder Viewholder = null;if (Mmarkerly.gettag () = = null) {Viewholder = new Viewholder (); viewholder.infoimg = (I Mageview) Mmarkerly.findviewbyid (r.id.info_img); viewholder.infoname = (TextView) Mmarkerly.findviewbyid (R.id.info_ name); viewholder.infodistance = (TextView) Mmarkerly.findviewbyid (r.id.info_distance); Viewholder.infozan = ( TextView) Mmarkerly.findviewbyid (R.id.info_zan); Mmarkerly.settag (Viewholder);} Viewholder = (Viewholder) mmarkerly.gettag (); ViewHolder.infoImg.setImageResource (Info.getimgid ()); ViewHolder.infoDistance.setText (Info.getdistance ()); ViewHolder.infoName.setText (Info.getname ()); ViewHolder.infoZan.setText (Info.getzan () + "");}

Here we use a viewholer to reuse the control, so that Findviewbyid only executes once

/** * Reuse pop-up panel mmarkerly controls *  * @author Zhy *  */private class Viewholder{imageview infoimg; TextView InfoName; TextView infodistance; TextView Infozan;}

Finally add a click event for the map to hide the details that appear in the layout and Infowindow

Mbaidumap.setonmapclicklistener (New Onmapclicklistener () {@Overridepublic Boolean onmappoiclick (Mappoi arg0) {return false;} @Overridepublic void Onmapclick (latlng arg0) {mmarkerinfoly.setvisibility (view.gone); Mbaidumap.hideinfowindow ();});

Finally, let's look at our layout file:

<relativelayout xmlns:android= "http://schemas.android.com/apk/res/android" xmlns:tools= "http// Schemas.android.com/tools "android:layout_width=" match_parent "android:layout_height=" Match_parent "> <com. Baidu.mapapi.map.MapView android:id= "@+id/id_bmapview" android:layout_width= "Fill_parent" Android:lay out_height= "Fill_parent" android:clickable= "true"/> <relativelayout android:id= "@+id/id_marker_inf        O "android:visibility=" Gone "android:layout_width=" Fill_parent "android:layout_height=" 220DP "        Android:layout_alignparentbottom= "true" android:background= "#CC4e5a6b" android:clickable= "true" > <imageview android:id= "@+id/info_img" android:layout_width= "Fill_parent" android:layou t_height= "150DP" android:layout_marginbottom= "10DP" android:layout_marginleft= "12DP" Android Oid:layout_marginright= "12DP" Androidoid:layout_margintop= "10DP" android:alpha= "1.0" android:background= "@drawable/map_image_border_white        "Android:clickable=" true "android:scaletype=" Fitxy "android:src=" @drawable/a04 "/> <relativelayout android:layout_width= "fill_parent" android:layout_height= "50DP" a Ndroid:layout_alignparentbottom= "true" android:background= "@drawable/bg_map_bottom" > <linearl                Ayout android:layout_width= "fill_parent" android:layout_height= "Wrap_content" Android:layout_centervertical= "true" android:layout_marginleft= "20DP" android:orientation= " Vertical "> <textview android:id=" @+id/info_name "android:layou                    T_width= "Wrap_content" android:layout_height= "Wrap_content" android:text= "Lao mi home Paomo Fry" AndroiD:textcolor= "#FFF5EB"/> <textview android:id= "@+id/info_distance" Android:layout_width= "Wrap_content" android:layout_height= "Wrap_content" Android : text= "distance 200 m" android:textcolor= "#FFF5EB"/> </LinearLayout> <linear                Layout android:layout_width= "wrap_content" android:layout_height= "Wrap_content" Android:layout_alignparentright= "true" android:layout_centervertical= "true" android:layou                    t_marginright= "20DP" android:orientation= "Horizontal" > <imageview Android:layout_width= "Wrap_content" android:layout_height= "Wrap_content" Android:onc lick= "Zan" android:src= "@drawable/map_zan"/> <textview Android     : id= "@+id/info_zan"               Android:layout_width= "Wrap_content" android:layout_height= "Wrap_content" android:layout_gravity= "center" android:text= "652" android:textcolor= "#FFF5EB"/ > </LinearLayout> </RelativeLayout> </RelativeLayout></RelativeLayout>

In addition to Mapview, the rest is the layout of the details, which is hidden by default, when the user clicks the marker display and sets the initial value, and then hides the map when the user clicks it.


Okay, here's the introduction.


SOURCE Click to download

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.