ArcGIS for Android 之callout初级实现

 ArcGIS for Android 的callout会实现的功能就是当你单击地图上一个标注的时候，会弹出一个衔套在MapView之上的弹窗，里面可以显示该标注的一些信息和属性。

    今天，我将在这里总结我这些天对callout的皮毛研究，能力有限，如有错误之处请回复提出。

首先是要在res文件夹下创建一个xml文件夹，里面新建文件calloutstyle.xml，然后用代码对该callout的样式进行设置。根据英文API中的介绍，做了一些简单的翻译：

[html] view plaincopy

1. <?xml version="1.0" encoding="utf-8"?>  
2.   <resources>  
3.       <calloutViewStyle  
4.          titleTextColor="#000000"      <!-- some RGB color or a reference to a color />  
5.          titleTextSize = 10;           <!-- size of the title text in scaled pixels  />  
6.          titleTextStyle = 0;           <!—字体样式/>  
7.          titleTextTypeFace = 0;        <!—字体设置0-4/>   
8.           backgroundColor="#ffffff"    <!—信息框的整个内在的背景颜色 />  
9.           backgroundAlpha="255"        <!-- 0(透明) to 255(不透明) />设置透明度参数  
10.           frameColor="#000000"         <!—框架的颜色（就是整个信息框的四周边缘颜色） />  
11.           flat="true"                  <!-- draws a 3D frame（平面的还是3D的，这里true是代表平面的） />  
12.           style.getCornerCurve()="0"   <!--窗口角落的半径曲率(max=40) />  
13.           anchor="5" />                <!--  anchor的位置（0-8，根据ANCHOR_POSITION_XXX常量的选择）/>   
14.    </resources>  

接下来，便是要在res/layout下创建callout显示的内部布局文件：calloutdisplay.xml。

[html] view plaincopy

1. <?xml version="1.0" encoding="utf-8"?>  
2. <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"  
3.     android:layout_width="match_parent"  
4.     android:layout_height="match_parent"  
5.     android:orientation="vertical" >  
6.   
7.     <LinearLayout  
8.         android:layout_width="match_parent"  
9.         android:layout_height="wrap_content"  
10.         android:orientation="horizontal" >  
11.   
12.         <TextView  
13.             android:id="@+id/callTitle"  
14.             android:layout_width="wrap_content"  
15.             android:layout_height="wrap_content"  
16.             android:layout_marginLeft="1dp"  
17.             android:text="武夷山"  
18.             android:textSize="15sp"  
19.             android:textStyle="bold" >  
20.         </TextView>  
21.   
22.         <LinearLayout  
23.             android:layout_width="wrap_content"  
24.             android:layout_height="wrap_content"  
25.             android:layout_marginLeft="180dp"  
26.             android:orientation="horizontal" >  
27.   
28.             <Button  
29.                 android:id="@+id/callcollect"  
30.                 android:layout_width="wrap_content"  
31.                 android:layout_height="wrap_content"  
32.                 android:background="@drawable/callcollect" />  
33.   
34.             <Button  
35.                 android:id="@+id/callshare"  
36.                 android:layout_width="wrap_content"  
37.                 android:layout_height="wrap_content"  
38.                 android:background="@drawable/callshare" />  
39.   
40.             <Button  
41.                 android:id="@+id/callexit"  
42.                 android:layout_width="wrap_content"  
43.                 android:layout_height="wrap_content"  
44.                 android:background="@drawable/callexit" />  
45.         </LinearLayout>  
46.     </LinearLayout>  
47.   
48.     <LinearLayout  
49.         android:layout_width="match_parent"  
50.         android:layout_height="match_parent"  
51.         android:orientation="horizontal" >  
52.   
53.         <LinearLayout  
54.             android:layout_width="wrap_content"  
55.             android:layout_height="match_parent"  
56.             android:orientation="vertical" >  
57.   
58.             <TextView  
59.                 android:id="@+id/calladdre"  
60.                 android:layout_width="wrap_content"  
61.                 android:layout_height="wrap_content"  
62.                 android:text="地址：福建省南平市武夷山市" />  
63.   
64.             <TextView  
65.                 android:id="@+id/calltype"  
66.                 android:layout_width="wrap_content"  
67.                 android:layout_height="wrap_content"  
68.                 android:text="类型：旅游风景区" />  
69.   
70.             <TextView  
71.                 android:id="@+id/callcontent"  
72.                 android:layout_width="wrap_content"  
73.                 android:layout_height="wrap_content"  
74.                 android:text="详情：大众点评网述" />  
75.   
76.             <TextView  
77.                 android:id="@+id/callnumb"  
78.                 android:layout_width="wrap_content"  
79.                 android:layout_height="wrap_content"  
80.                 android:text="电话：[phone]" />  
81.         </LinearLayout>  
82.   
83.         <LinearLayout  
84.             android:layout_width="wrap_content"  
85.             android:layout_height="wrap_content" >  
86.   
87.             <ImageView  
88.                 android:id="@+id/calloutimg"  
89.                 android:layout_width="match_parent"  
90.                 android:layout_height="match_parent"  
91.                 android:layout_marginLeft="5dp"  
92.                 android:src="@drawable/mm11" >  
93.             </ImageView>  
94.         </LinearLayout>  
95.     </LinearLayout>  
96.   
97. </LinearLayout>  

布局文件和样式文件都已经完成了。

那么，接下来就是java代码的实现了，我的思路是，在地图上创建一个临时的point，然后当单击该point后，弹窗callout。

[java] view plaincopy

1. final GraphicsLayer graphicsLayer = new GraphicsLayer();  
2.         com.esri.core.geometry.Point pt1 = new com.esri.core.geometry.Point(  
3.                 1.2905771616285184E7, 3035967.556712447);  
4.         Graphic g1 = new Graphic(pt1, new SimpleMarkerSymbol(Color.BLACK, 10,  
5.                 STYLE.CIRCLE));  
6.         graphicsLayer.addGraphic(g1);  
7.         mMapView.addLayer(graphicsLayer);  
8.         mMapView.setOnSingleTapListener(new OnSingleTapListener() {  
9.             public void onSingleTap(float x, float y) {  
10.                 // TODO Auto-generated method stub  
11.                   
12.                 int[] graphicIDs = graphicsLayer.getGraphicIDs(x, y, 25);  
13.                 if (graphicIDs != null && graphicIDs.length > 0) {  
14.                     LayoutInflater inflater = LayoutInflater  
15.                             .from(HelloWorldActivity.this);  
16.                     View view = inflater.inflate(R.layout.callout, null);  
17.                     Graphic gr = graphicsLayer.getGraphic(graphicIDs[0]);  
18.                     com.esri.core.geometry.Point location = new com.esri.core.geometry.Point(  
19.                             1.2905771616285184E7, 3035967.556712447);  
20.                     Callout callout = mMapView.getCallout();  
21.                                         callout.setStyle(R.xml.calloutstyle);  
22.                     callout.setOffset(0, -15);  
23.                     callout.show(location, view);  
24.                 }  
25.                 Log.v(TAG, "OnSingleTapLinstener is running !");  
26.             }  
27.         });  

通过上面的代码，我是先初始化地图时就创建一个黑色的圆点。然后设置地图单击监听事件，当单击到这个黑色点的时候，弹出callout。

那么，接下来看看实现的效果：

原帖地址：

http://blog.csdn.net/vaecer/article/details/8804127