I have a problem with a MapFragment and I don't know how I can make it to NOT fill the screen. I need to have a MapFragment to stop at my textview. Im attaching a picture that better describe how I need it to look. Right now my MapFragment fills the screen and the textview is placed on top of the MapFragment.
I then have two buttons that is on top of my textview. This is OK.
This is how I want it to look:
Hope you can help!
here is the layout:
<?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:id="@+id/activity_main"
android:layout_alignBottom="@id/activity_main"
android:layout_width="match_parent"
android:weightSum="10"
android:keepScreenOn="true"
android:layout_height="match_parent">
<LinearLayout
android:id="@+id/linelay"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="horizontal">
<fragment android:name="com.google.android.gms.maps.SupportMapFragment"
android:id="@+id/map"
android:layout_width="match_parent"
android:layout_weight="9"
android:layout_height="wrap_content"
tools:context="com.example.MapsActivity"
tools:layout="@layout/activity_main"/>
</LinearLayout>
<ToggleButton
android:text="ToggleButton"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_alignParentBottom="true"
android:id="@+id/toggleButton" />
<Button
android:text="@string/button1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_above="@id/toggleButton"
android:layout_alignParentRight="true"
android:onClick="clearMap"
android:id="@+id/button1" />
<TextView
android:id="@+id/text1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="Hello World!"
android:layout_alignParentStart="true"
android:layout_alignParentLeft="true"
android:layout_alignParentBottom="true"
android:background="@drawable/frame" />
</RelativeLayout>
Here is one way to do it. Use a LinearLayout as the outer Layout, and use layout weights to define the height for different sections.
This is better than defining heights for either of the sections using hard-coded dp values. Using layout weights for the height will better dynamically adjust with different screen sizes.
<LinearLayout 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"
tools:context="com.danielnugent.mapapplication.MapsActivity"
android:orientation="vertical"
android:weightSum="1">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:orientation="vertical"
android:layout_weight=".8">
<fragment
android:id="@+id/map"
class="com.google.android.gms.maps.SupportMapFragment"
android:layout_width="match_parent"
android:layout_height="match_parent"/>
</LinearLayout>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:orientation="vertical"
android:layout_weight=".2">
<TextView
android:id="@+id/text"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="TextView Text Here"
android:layout_marginLeft="40dp"
android:layout_marginStart="40dp"
android:lineSpacingExtra="14sp"
android:textSize="18sp"
android:layout_above="@+id/button1"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true" />
<Button
android:id="@+id/button2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Button 1"
android:layout_marginRight="18dp"
android:layout_marginEnd="18dp"
android:layout_alignParentRight="true"
android:layout_alignParentEnd="true"
android:layout_above="@+id/button1" />
<Button
android:id="@+id/button1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Button 2"
android:layout_alignParentBottom="true"
android:layout_alignLeft="@+id/button2"
android:layout_alignStart="@+id/button2" />
</RelativeLayout>
</LinearLayout>
Result: