How to draw a border around a mapview

Question

i am trying to draw a margin around my mapView when a button is clicked.

So this is what i have tried and it does not work. The mapview is inside a relative layout.

LayoutInflater inflater = getLayoutInflater();

LinearLayout mView = (LinearLayout) inflater.inflate(
                        R.layout.map_view_create_ps, mapView, false);

GeoPoint viewLoc = mapView.getMapCenter();
MapView.LayoutParams params = new MapView.LayoutParams(
                        LayoutParams.FILL_PARENT, LayoutParams.FILL_PARENT,
                        viewLoc,

MapView.LayoutParams.BOTTOM_CENTER);
                mView.setLayoutParams(params);
                mapView.addView(mView);
                mView.setVisibility(View.VISIBLE);

The above is called when the button is clicked

my create_ps_layout is as such

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical" android:layout_width="fill_parent"
android:layout_height="fill_parent" android:background="@android:color/transparent">
<LinearLayout android:layout_width="fill_parent"
    android:id="@+id/linearLayout1" android:orientation="vertical"
    android:layout_height="fill_parent"
    android:background="@drawable/rounded_boarder"></LinearLayout>

 </LinearLayout>

And the drawable background is like this

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle" android:padding="10dp">
<solid android:color="@color/translucent_black" />
<corners android:bottomRightRadius="30dp"
    android:bottomLeftRadius="30dp" android:topLeftRadius="30dp"
    android:topRightRadius="30dp" />
    <stroke android:width="2dip" android:color="#FFB600"/>
</shape>

This does not work, but could you guys point me in the correct direction on how to draw a border around the mapview when the button is selected?

Answer 1

put you mapview in one RelativeLayout and set padding property of the RelativeLayout as follow:

      <RelativeLayout
            android:layout_width="fill_parent"
            android:layout_height="fill_parent"
            android:orientation="vertical" android:layout_weight="1"
            android:background="#444" android:padding="2dp">

            <com.google.android.maps.MapView
                android:id="@+id/mapView"
                android:layout_width="fill_parent"
                android:layout_height="fill_parent"
                android:apiKey="YOUR-MAP-KEY"
                android:clickable="true"/>
        </RelativeLayout>

Answer 2

Follow these steps :

1- Create image_border.xml in the drawable with the below code :

 <?xml version="1.0" encoding="utf-8"?>
 <layer-list xmlns:android="http://schemas.android.com/apk/res/android" >
 <item>
    <shape android:shape="rectangle" >
        <gradient
            android:angle="90"
            android:centerColor="#30ffffff"
            android:endColor="#30ffffff"
            android:startColor="#30ffffff" />
    </shape>
</item>
<item
    >
    <shape android:shape="rectangle" >
        <solid android:color="#30ffffff" />
    </shape>
</item>

2- create another XML image_borderless.xml in the drawable with the below code :

 <?xml version="1.0" encoding="utf-8"?>
 <layer-list xmlns:android="http://schemas.android.com/apk/res/android" >
<item>
    <shape android:shape="rectangle" >
        <gradient
            android:angle="90"
     ></gradient>
    </shape>
</item>
<item
  >
<shape android:shape="rectangle" >
   </shape>
</item>

3- in your onClick implementation add this code :

       wp1.setOnClickListener(new OnClickListener() {
   @Override
    public void onClick(View v) {


       //wp1 to add a boarder if selected 
      wp1.setBackgroundDrawable(getResources().getDrawable(
                    R.drawable.image_border));
            wp1.setPadding(8, 8, 8, 8);
      //wp3 to hide the boarder if not selected 
       wp3.setBackgroundDrawable(getResources().getDrawable(
                    R.drawable.image_borderless));

       }
    });