Android - MapView contained within a Listview

Ryan picture Ryan · Jun 2, 2010 · Viewed 17.9k times · Source

Currently I am trying to place a MapView within a ListView. Has anyone had any success with this? Is it even possible? Here is my code:

            ListView myList = (ListView) findViewById(android.R.id.list);
        List<Map<String, Object>> groupData = new ArrayList<Map<String, Object>>();

        Map<String, Object> curGroupMap = new HashMap<String, Object>();
        groupData.add(curGroupMap);
        curGroupMap.put("ICON", R.drawable.back_icon);
        curGroupMap.put("NAME","Go Back");
        curGroupMap.put("VALUE","By clicking here");

        Iterator it = data.entrySet().iterator();
        while (it.hasNext()) 
        {
            //Get the key name and value for it
            Map.Entry pair = (Map.Entry)it.next();
            String keyName = (String) pair.getKey();
            String value = pair.getValue().toString();

            if (value != null)
            {
                //Add the parents -- aka main categories
                curGroupMap = new HashMap<String, Object>();
                groupData.add(curGroupMap);

                //Push the correct Icon
                if (keyName.equalsIgnoreCase("Phone"))
                    curGroupMap.put("ICON", R.drawable.phone_icon);
                else if (keyName.equalsIgnoreCase("Housing"))
                    curGroupMap.put("ICON", R.drawable.house_icon);
                else if (keyName.equalsIgnoreCase("Website"))
                    curGroupMap.put("ICON", R.drawable.web_icon);
                else if (keyName.equalsIgnoreCase("Area Snapshot"))
                    curGroupMap.put("ICON", R.drawable.camera_icon);
                else if (keyName.equalsIgnoreCase("Overview"))
                    curGroupMap.put("ICON", R.drawable.overview_icon);  
                else if (keyName.equalsIgnoreCase("Location"))
                    curGroupMap.put("ICON", R.drawable.map_icon);
                else
                    curGroupMap.put("ICON", R.drawable.icon);

                //Pop on the Name and Value
                curGroupMap.put("NAME", keyName);
                curGroupMap.put("VALUE", value);
            }
        }

        curGroupMap = new HashMap<String, Object>();
        groupData.add(curGroupMap);
        curGroupMap.put("ICON", R.drawable.back_icon);
        curGroupMap.put("NAME","Go Back");
        curGroupMap.put("VALUE","By clicking here");

        //Set up adapter
        mAdapter = new SimpleAdapter(
                mContext,
                groupData,
                R.layout.exp_list_parent,
                new String[] { "ICON", "NAME", "VALUE" },
                new int[] { R.id.photoAlbumImg, R.id.rowText1, R.id.rowText2  }
        );

        myList.setAdapter(mAdapter); //Bind the adapter to the list 

Thanks in advance for your help!!

Answer

Siddharth Lele picture Siddharth Lele · Oct 7, 2012

To post an alternate solution to a rather old answer (over 2 years actually), but I thought this might help someone who might stumble on this post like I did.

NOTE: This might be useful for someone who simply needs to display the location in a "Map" but does not need to interact with it in the ListView. The actual Map can be displayed on say, a details page, after clicking on an item in the ListView

As already pointed out by @CaseyB, MapView is kind of a heavy view. To counter that aspect (and to make life a little but easier for me ;-) ), I chose to build an URL like you would for a static Google Map, using several parameters that are necessary for my application. You can get more options here: https://developers.google.com/maps/documentation/staticmaps/

First, when I am constructing the data for my ListView, I pass data such as the latitude and longitude to a string with some static variables taken from the link mentioned above. I get my co-ordinates from the Facebook API.

The code I use to construct the link:

String getMapURL = "http://maps.googleapis.com/maps/api/staticmap?zoom=18&size=560x240&markers=size:mid|color:red|"  
+ JOLocation.getString("latitude") 
+ "," 
+ JOLocation.getString("longitude") 
+ "&sensor=false";

The above constructed URL, when used in a browser, returns a .PNG file. Then, in my adapter for the activity, I use @Fedor's Lazy Loading to display the image generated from the URL contructed earlier to display in the custom ListView. You can of course choose your own method to display this Map (Map's image actually).

An example of the final result.

enter image description here

Currently, I have about 30 odd Checkin Maps (I use it in conjunction with the Facebook SDK) in this ListView, but users can have 100's of them and there have been absolutely no reports of it slowing down.

I suspect, this might not help the OP considering the time that has passed since the question, but hope it helps other users landing on this page in the future.