使用 Android 的地图叠加中带有边框的图像

Question

我显示了此链接，但答案只是仅显示气球。

带有边框的图片作为地图叠加层

但我发现就像带边框的显示图像一样......就像这样。

如果有人知道如何执行此操作，请帮助我。

我已完成在地图中显示 3-5 张图像。但现在我只想显示带有边框的图像。

提前致谢。

Answer 1

您需要创建像这样的图像

这是 9 补丁图像。

现在您需要创建自定义布局来处理此自定义布局文件以显示气球

<?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:orientation="horizontal" 
    android:paddingBottom="35dip"
    android:paddingLeft="10dip"  
    android:id="@+id/balloon_main_layout"
    android:background="@drawable/balloon_overlay_bg_selector" 
    android:paddingTop="0dip"
    android:paddingRight="0dip">
       <ImageView android:layout_width="wrap_content"
        android:layout_height="wrap_content" 
        android:src="@drawable/your_default_image"
        android:id="@+id/img_button" 
        android:paddingLeft="10dip"
        android:paddingBottom="10dip" 
        android:paddingRight="8dip"
        android:paddingTop="8dip"></ImageView>
</LinearLayout>

现在您可以创建这种类型的图像并设置为布局背景，并在该图像视图中根据您的要求显示不同的图像

Answer 2

这是一些绘制圆形的代码：

private class ProximityOverlay extends Overlay {

    public void draw(Canvas canvas, MapView mapview, boolean b) {
        // draw some stuff in here, like
        Paint paint = new Paint();
        paint.setAntiAlias(true);
        paint.setStrokeWidth(2.0f);
        double latitude = location.getLatitude();
        double longitude = location.getLongitude();
        Projection projection = mapView.getProjection();
        GeoPoint leftGeo = new GeoPoint((int) (latitude * 1e6),
                (int) (longitude * 1e6));
        Point left = new Point();
        projection.toPixels(leftGeo, left);

        paint.setColor(Color.parseColor("#00CCFF"));
        paint.setStyle(Style.FILL);
        canvas.drawCircle(left.x, left.y, 9, paint);
        paint.setColor(Color.parseColor("#003399"));
        paint.setStyle(Style.STROKE);
        canvas.drawCircle(left.x, left.y, 10, paint);



    }

您可以修改它以绘制黑色矩形：

canvas.drawRect(left, top, right, bottom, paint);

Answer 3

按照 此处

并创建 xml，因为您想要显示叠加层（例如，我已经创建了这样的）

    <?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:orientation="horizontal" 
    android:paddingBottom="5dip"
    android:paddingLeft="5dip" 

    android:id="@+id/balloon_main_layout"
    android:background="@drawable/popupbg"
    android:paddingTop="0dip"
    >
<ImageView android:layout_width="40dp"
        android:layout_height="40dp" 

        android:id="@+id/diseaseImg" 
        android:padding="5dp"
        android:layout_gravity="center_vertical"
        ></ImageView>
    <LinearLayout 
        android:layout_width="wrap_content" 
        android:layout_height="wrap_content"
        android:orientation="vertical" 
        android:layout_weight="1"
        android:paddingTop="10dip" 
        android:paddingRight="30dip"
        android:id="@+id/balloon_inner_layout">
        <TextView android:layout_height="wrap_content"
            android:layout_width="wrap_content" 
            android:id="@+id/balloon_item_title"
            android:text="balloon_item_title" 
            android:layout_marginLeft="2dp"
            android:textSize="14dip"
            android:paddingBottom="5dp"
            android:textColor="#FF000000"></TextView>

    </LinearLayout>

    <ImageView android:layout_width="30dp"
        android:layout_height="30dp" 
        android:src="@android:drawable/ic_menu_close_clear_cancel"
        android:id="@+id/close_img_button" 
        android:layout_gravity="right"
        android:paddingLeft="10dip"
        android:paddingBottom="10dip" 
        android:paddingRight="8dip"
        android:paddingTop="2dip"></ImageView>

</LinearLayout>

，并创建了 BalloonOverlayView 类，如下所示，

import android.app.Activity;
import android.content.Context;
import android.content.Intent;
import android.view.Gravity;
import android.view.LayoutInflater;
import android.view.View;
import android.widget.FrameLayout;
import android.widget.ImageView;
import android.widget.LinearLayout;
import android.widget.TextView;
import android.widget.ImageView.ScaleType;

import com.google.android.maps.OverlayItem;
import com.healthcarealert.R;



public class BalloonOverlayView extends FrameLayout {

    private LinearLayout layout;
    private TextView title;
    private TextView snippet;
    private ImageView diseaseImg;
    public static boolean isPopupClicked = false;
    private Context con = null;
    /**
     * Create a new BalloonOverlayView.
     * 
     * @param context - The activity context.
     * @param balloonBottomOffset - The bottom padding (in pixels) to be applied
     * when rendering this view.
     */
    public BalloonOverlayView(Context context, int balloonBottomOffset) {

        super(context);
        this.con =context;
        setPadding(10, 0, 10, balloonBottomOffset);
        layout = new LinearLayout(context);
        layout.setVisibility(VISIBLE);

        LayoutInflater inflater = (LayoutInflater) context
                .getSystemService(Context.LAYOUT_INFLATER_SERVICE);
        View v = inflater.inflate(R.layout.balloon_map_overlay, layout);
        title = (TextView) v.findViewById(R.id.balloon_item_title);
    //  snippet = (TextView) v.findViewById(R.id.balloon_item_snippet);
        diseaseImg = (ImageView)v.findViewById(R.id.diseaseImg);
        ImageView close = (ImageView) v.findViewById(R.id.close_img_button);
        close.setOnClickListener(new OnClickListener() {
            public void onClick(View v) {
                layout.setVisibility(GONE);
            }
        });

        FrameLayout.LayoutParams params = new FrameLayout.LayoutParams(
                LayoutParams.WRAP_CONTENT, LayoutParams.WRAP_CONTENT);
        params.gravity = Gravity.NO_GRAVITY;

        addView(layout, params);

    }

    /**
     * Sets the view data from a given overlay item.
     * 
     * @param item - The overlay item containing the relevant view data 
     * (title and snippet). 
     */
    public void setData(OverlayItem item) {

        layout.setVisibility(VISIBLE);
        if (item.getTitle() != null) {
            title.setVisibility(VISIBLE);
            title.setText(item.getTitle());
        } else {
            title.setVisibility(GONE);
        }
        /*if (item.getSnippet() != null) {
            snippet.setVisibility(VISIBLE);
            snippet.setText(item.getSnippet());

        } else {
            snippet.setVisibility(GONE);
        }*/
    }   

public void setImage(String item) {

        layout.setVisibility(VISIBLE);
        if (item != null) {
            diseaseImg.setVisibility(VISIBLE);
            ImageLoader imageLoader =  new ImageLoader(this.con);;
            diseaseImg.setTag("http://healthcarealert.com/healthcaretest/" + item);
            diseaseImg.setScaleType(ScaleType.FIT_XY);


                imageLoader.DisplayImage("http://healthcarealert.com/healthcaretest/" + item,
                        HotSpotsMapActivity.activity,   diseaseImg);



        } else {
            diseaseImg.setVisibility(GONE);
        }
}
}

该类具有方法 setImage(String item)

其中 String包含图像的 URL

在 HelloItemized 覆盖的 onTap 方法中使用图像 url 路径调用此方法