Place button on top right of google maps API

Question

I am unable to figure out how to place a button on the top right of the screen on Google Maps Activity I am new to Android development and am unable to find a straight forward explanation on how to do this. My main activity code looks like this:

import android.os.Bundle;
        import android.support.v7.app.AppCompatActivity;

        import com.google.android.gms.maps.CameraUpdateFactory;
        import com.google.android.gms.maps.GoogleMap;
        import com.google.android.gms.maps.OnMapReadyCallback;
        import com.google.android.gms.maps.SupportMapFragment;
        import com.google.android.gms.maps.model.LatLng;
        import com.google.android.gms.maps.model.LatLngBounds;
        import com.google.android.gms.maps.model.MarkerOptions;

public class MapsActivity extends AppCompatActivity implements OnMapReadyCallback {
    private final LatLng LOWER_WEST_BOUND = new LatLng(45.427882, 13.347119);
    private final LatLng UPPER_EAST_BOUND = new LatLng(46.904552, 16.664808);
    private final LatLng LJUBLJANA = new LatLng(46.052771, 14.503602);
    private final LatLngBounds SLOVENIJA_OUTER_BOUNDS = new LatLngBounds(LOWER_WEST_BOUND, UPPER_EAST_BOUND);

    private GoogleMap mMap;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_maps);

        // Obtain the SupportMapFragment and get notified when the map is ready to be used.
        SupportMapFragment mapFragment = (SupportMapFragment) getSupportFragmentManager()
                .findFragmentById(R.id.map);
        mapFragment.getMapAsync(this);
    }


    /**
     * Manipulates the map once available.
     * This callback is triggered when the map is ready to be used.
     * This is where we can add markers or lines, add listeners or move the camera. In this case,
     * we just add a marker near Sydney, Australia.
     * If Google Play services is not installed on the device, the user will be prompted to install
     * it inside the SupportMapFragment. This method will only be triggered once the user has
     * installed Google Play services and returned to the app.
     */
    @Override
    public void onMapReady(GoogleMap googleMap) {
        mMap = googleMap;

        mMap.setLatLngBoundsForCameraTarget(SLOVENIJA_OUTER_BOUNDS);
        mMap.addMarker(new MarkerOptions().position(LJUBLJANA).title("Marker in Ljubljana"));
        mMap.moveCamera(CameraUpdateFactory.newLatLngZoom(LJUBLJANA, 15));
    }

}

Desired app look:

https://i.stack.imgur.com/n2FXF.png

My .xml file looks like this:

<fragment xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    xmlns:map="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:id="@+id/map"
    tools:context="com.fri.studentskaprehrana.MapsActivity"
    android:name="com.google.android.gms.maps.SupportMapFragment"
    tools:layout="@layout/place_autocomplete_fragment" />

Thank you for pointing me to the duplicate, combined with the help of individuals who helped me I was able to find a solution. — Clutchy, Nov 18 '16 at 18:44

rhari · Accepted Answer · 2016-11-18T18:25:42.510

1

The location where you want to place the icon is in the action bar. To place menu items there, refer the menu docs

For the menu, try :

<menu xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto">

    <item
        android:id="@+id/action_button"
        android:icon="@drawable/buttonIcon"
        app:showAsAction="always"
        android:title="Button title" />
</menu>

edited Nov 18 '16 at 18:25

answered Nov 18 '16 at 17:59

rhari

1,367
1
11
19

I am still not sure how I would add a menu item inside my xml file. – Clutchy Nov 18 '16 at 18:07
Edited, have a look – rhari Nov 18 '16 at 18:26
app:showAsAction="always" throws an error, also where should I put this – Clutchy Nov 18 '16 at 18:37
What is the error ? Place it within the res/menu folder, create it if it does not exist – rhari Nov 18 '16 at 18:39
It works now, it was in the wrong location. Thank you very much. – Clutchy Nov 18 '16 at 19:06

iman kazemayni · Answer 2 · 2016-11-18T18:21:42.107

its very simple and easy

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:id="@+id/rr"
    >


    <fragment xmlns:android="http://schemas.android.com/apk/res/android"
        xmlns:tools="http://schemas.android.com/tools"
        android:id="@+id/map"
        android:name="com.google.android.gms.maps.SupportMapFragment"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        tools:context="com.fri.studentskaprehrana.MapsActivity" />


    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="@dimen/a100dp"
        android:orientation="horizontal"
        android:gravity="right"
        android:id="@+id/lll">


        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="Your Button"
            android:id="@+id/button" />
    </LinearLayout>

</RelativeLayout>

replace all this code with your code in xml. you can justify it if you want

edit: if you want something like menubar, you can use this design:

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    >


    <fragment xmlns:android="http://schemas.android.com/apk/res/android"
        xmlns:tools="http://schemas.android.com/tools"
        android:id="@+id/map"
        android:name="com.google.android.gms.maps.SupportMapFragment"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        tools:context="com.fri.studentskaprehrana.MapsActivity" />


    <RelativeLayout
        android:layout_width="match_parent"
        android:layout_height="60dp"
        android:background="#322929">


        <ImageView
            android:layout_width="40dp"
            android:layout_height="40dp"
            android:id="@+id/imageView40"
            android:layout_centerVertical="true"
            android:layout_alignParentRight="true"
            android:layout_alignParentEnd="true"
            android:layout_marginRight="20dp"
            android:background="#72c33c" />

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:textAppearance="?android:attr/textAppearanceMedium"
            android:text="Your text"
            android:id="@+id/textView111"
            android:layout_centerVertical="true"
            android:layout_alignParentLeft="true"
            android:layout_alignParentStart="true"
            android:layout_marginLeft="10dp"
            android:textColor="#ffffff" />
    </RelativeLayout>

</RelativeLayout>

This puts the button under the action bar, also @dimen/a100dp gives me an error. — Clutchy, Nov 18 '16 at 18:27
use 100dp instead @dimen/a100dp. you should choose between using action bar or create a base layout like my answer. and if you want to use action bar, other answer is your solution — iman kazemayni, Nov 18 '16 at 18:38

score 0 · Answer 3 · answered Nov 18 '16 at 17:59

0

It's simple.
Add the menu to the activity where you have the fragment and you will have the button there. Add a single menu item only.

answered Nov 18 '16 at 17:59

Shadab K

1,677
1
16
25

Place button on top right of google maps API

3 Answers3