0

How do you create a circular google map? So far I have a LinearLayout with 3 frame layouts inside it. So a Top Frame, Map Frame, Bottom Frame. I can change the height and width of the Map. But I can't add curvature or set a radius, nor does android:shape= "oval" work. My Map.Java Extends AppCompatActivity. Here is my activity_map.xml

 <?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:map="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
          android:id="@+id/map"
          android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:fitsSystemWindows="true"
tools:context="edu.wayne.memories.Map"
>

<android.support.design.widget.AppBarLayout
    android:id="@+id/app_bar"
    android:layout_width="match_parent"
    android:layout_height="9dp"
    android:fitsSystemWindows="true"
    android:theme="@style/AppTheme.AppBarOverlay">

    <android.support.v7.widget.Toolbar
        android:id="@+id/toolbar"
        android:layout_width="match_parent"
        android:layout_height="0dp"
        map:layout_collapseMode="pin"
        map:popupTheme="@style/AppTheme.PopupOverlay" />

</android.support.design.widget.AppBarLayout>

<FrameLayout
    android:layout_width="match_parent"
    android:layout_height="0dp"
    android:layout_weight="0.4"
    >
    <Button
        android:id="@+id/favbtn"
        android:layout_width="173dp"
        android:layout_height="wrap_content"
        android:layout_marginTop="40dip"
        android:background="@color/btn_logut_bg"
        android:text="@string/userProfile"
        android:textAllCaps="false"
        android:textColor="@color/white"
        android:textSize="15dp"
        android:layout_gravity="top" />
</FrameLayout>

<FrameLayout
    android:layout_width="match_parent"
    android:layout_height="0dp"
    android:layout_weight="0.7"
    >
    <include layout="@layout/content_map"
        />

</FrameLayout>

<FrameLayout
    android:layout_width="match_parent"
    android:layout_height="0dp"
    android:layout_weight="0.4"

    >

    <Button
        android:id="@+id/profile"
        android:layout_width="173dp"
        android:layout_height="wrap_content"
        android:layout_marginTop="40dip"
        android:background="@color/btn_logut_bg"
        android:text="@string/favbtn"
        android:textAllCaps="false"
        android:textColor="@color/white"
        android:textSize="15dp"
        android:layout_gravity="top" />


</FrameLayout>

My content_map.xml

<fragment xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:map="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:id="@+id/map"
android:name="com.google.android.gms.maps.MapFragment"
      android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context="edu.wayne.memories.Map"
/>

How I want the circular map to look and what I have right now: enter image description here

enter image description here

rampency
  • 65
  • 1
  • 8
  • 1
    Take a look at http://stackoverflow.com/questions/35647057/android-google-maps-inside-circleview/35648839 – antonio Mar 03 '16 at 07:12

1 Answers1

0

You can check my answer here. Maybe it's a trick, create image bg has transparent circle, the color around must be the same color of your background.

Community
  • 1
  • 1
RoShan Shan
  • 2,924
  • 1
  • 18
  • 38