ArcGIS for Android 之callout初级实现

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

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

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

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

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

<?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" >

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="horizontal" >

        <TextView
            android:id="@+id/callTitle"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginLeft="1dp"
            android:text="武夷山"
            android:textSize="15sp"
            android:textStyle="bold" >
        </TextView>

        <LinearLayout
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginLeft="180dp"
            android:orientation="horizontal" >

            <Button
                android:id="@+id/callcollect"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:background="@drawable/callcollect" />

            <Button
                android:id="@+id/callshare"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:background="@drawable/callshare" />

            <Button
                android:id="@+id/callexit"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:background="@drawable/callexit" />
        </LinearLayout>
    </LinearLayout>

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:orientation="horizontal" >

        <LinearLayout
            android:layout_width="wrap_content"
            android:layout_height="match_parent"
            android:orientation="vertical" >

            <TextView
                android:id="@+id/calladdre"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="地址：福建省南平市武夷山市" />

            <TextView
                android:id="@+id/calltype"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="类型：旅游风景区" />

            <TextView
                android:id="@+id/callcontent"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="详情：大众点评网述" />

            <TextView
                android:id="@+id/callnumb"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="电话：[phone]" />
        </LinearLayout>

        <LinearLayout
            android:layout_width="wrap_content"
            android:layout_height="wrap_content" >

            <ImageView
                android:id="@+id/calloutimg"
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:layout_marginLeft="5dp"
                android:src="@drawable/mm11" >
            </ImageView>
        </LinearLayout>
    </LinearLayout>

</LinearLayout>
           

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

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

final GraphicsLayer graphicsLayer = new GraphicsLayer();
		com.esri.core.geometry.Point pt1 = new com.esri.core.geometry.Point(
				1.2905771616285184E7, 3035967.556712447);
		Graphic g1 = new Graphic(pt1, new SimpleMarkerSymbol(Color.BLACK, 10,
				STYLE.CIRCLE));
		graphicsLayer.addGraphic(g1);
		mMapView.addLayer(graphicsLayer);
		mMapView.setOnSingleTapListener(new OnSingleTapListener() {
			public void onSingleTap(float x, float y) {
				// TODO Auto-generated method stub
				
				int[] graphicIDs = graphicsLayer.getGraphicIDs(x, y, 25);
				if (graphicIDs != null && graphicIDs.length > 0) {
					LayoutInflater inflater = LayoutInflater
							.from(HelloWorldActivity.this);
					View view = inflater.inflate(R.layout.callout, null);
					Graphic gr = graphicsLayer.getGraphic(graphicIDs[0]);
					com.esri.core.geometry.Point location = new com.esri.core.geometry.Point(
							1.2905771616285184E7, 3035967.556712447);
					Callout callout = mMapView.getCallout();
                                        callout.setStyle(R.xml.calloutstyle);
					callout.setOffset(0, -15);
					callout.show(location, view);
				}
				Log.v(TAG, "OnSingleTapLinstener is running !");
			}
		});
           

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

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