Kristy Welsh
Kristy Welsh

Reputation: 8340

Can't get the included view to align to the parent bottom in a layout

I'm trying to do a simple layout in android that includes another file which is a bottom navigation consisting of three buttons.

I can't get the included file to line up at the bottom. Here is my xml for the layout (the TextView shows up aligned to parent bottom, but included file doesn't):

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


<TextView
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:id="@+id/patientDOBBlock"
    tools:text="Test Navigation Text"
    android:layout_alignParentBottom="true"/>
<include
    android:id="@+id/navigation"
    android:layout_below="@+id/patientDOBBlock"
    layout="@layout/bottom_navigation"
    android:layout_height="66dp"
    android:layout_width="match_parent"
    app:layout_constraintBottom_toBottomOf="parent"
    android:layout_alignParentBottom="true"/>

</RelativeLayout>

The included file:

<merge xmlns:android="http://schemas.android.com/apk/res/android">
<android.support.constraint.ConstraintLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="@+id/task_base_buttons"
android:layout_width="match_parent"
android:layout_height="66dp"
android:layout_marginBottom="8dp"
android:layout_marginEnd="8dp"
android:layout_marginStart="8dp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent">

    <Button
        android:id="@+id/btnTaskBack"
        style="@style/NeutrifProText.Button"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginStart="8dp"
        android:layout_weight="0.2"
        android:background="@android:color/transparent"
        android:text="@string/action_back"
        android:textColor="@color/colorPrimary"
        app:layout_constraintBottom_toBottomOf="@+id/btnTaskContinue"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="@+id/btnTaskContinue" />

    <Button
        android:id="@+id/btnTaskContinue"
        style="@style/NeutrifProText.Button"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_marginBottom="8dp"
        android:layout_marginEnd="8dp"
        android:layout_marginStart="8dp"
        android:layout_weight="0.6"
        android:background="@drawable/rounded_rect_color_primary"
        android:text="@string/action_continue"
        android:textColor="@color/white"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toStartOf="@+id/btnTaskSkip"
        app:layout_constraintStart_toEndOf="@+id/btnTaskBack" />

    <Button
        android:id="@+id/btnTaskSkip"
        style="@style/NeutrifProText.Button"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginEnd="8dp"
        android:layout_weight="0.2"
        android:background="@android:color/transparent"
        android:text="@string/action_skip"
        android:textColor="@color/colorPrimary"
        app:layout_constraintBottom_toBottomOf="@+id/btnTaskContinue"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintTop_toTopOf="@+id/btnTaskContinue" />

 </android.support.constraint.ConstraintLayout>
 </merge>

Any idea why? BTW, this same included file shows up at the bottom in a fragment.

EDIT: I'm including the layout of the fragment where the layout does appear at the bottom

<android.support.constraint.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:id="@+id/task_constraint_layout"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context="com.rangerhealth.rangerprovider.view.fragment.BaseTaskFragment"
tools:layout_editor_absoluteX="0dp"
tools:layout_editor_absoluteY="25dp">

<!-- TODO: Update blank fragment layout -->

<TextView
    android:id="@+id/task_title"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_alignParentStart="true"
    android:layout_alignParentTop="true"
    android:layout_marginEnd="8dp"
    android:layout_marginStart="8dp"
    android:layout_marginTop="50dp"
    android:gravity="center"
    android:textColor="@color/black"
    android:textSize="@dimen/title_font_size"
    tools:text="Title"
    app:layout_constraintEnd_toEndOf="parent"
    app:layout_constraintStart_toStartOf="parent"
    app:layout_constraintTop_toTopOf="parent" />

<TextView
    android:id="@+id/task_subtitle"
    android:layout_width="0dp"
    android:layout_height="wrap_content"
    android:layout_below="@+id/task_title"
    android:layout_centerHorizontal="true"
    android:layout_marginEnd="8dp"
    android:layout_marginStart="8dp"
    android:layout_marginTop="17dp"
    android:gravity="center"
    tools:text="Subtitle"
    app:layout_constraintEnd_toEndOf="parent"
    app:layout_constraintHorizontal_bias="0.0"
    app:layout_constraintStart_toStartOf="parent"
    app:layout_constraintTop_toBottomOf="@+id/task_title" />

<TextView
    android:id="@+id/task_description"
    android:layout_width="match_parent"
    android:layout_height="21dp"
    android:layout_marginEnd="8dp"
    android:layout_marginStart="8dp"
    android:layout_marginTop="8dp"
    android:gravity="center_horizontal"
    tools:text="Description"
    app:layout_constraintEnd_toEndOf="parent"
    app:layout_constraintStart_toStartOf="parent"
    app:layout_constraintTop_toBottomOf="@+id/task_subtitle" />


<include layout="@layout/bottom_navigation"
    android:layout_height="match_parent"
    android:layout_width="match_parent"
    />

<RelativeLayout
    android:id="@+id/task_placeholder"
    android:layout_width="0dp"
    android:layout_height="0dp"
    android:layout_marginBottom="8dp"
    android:layout_marginEnd="8dp"
    android:layout_marginStart="8dp"
    android:layout_marginTop="8dp"
    app:layout_constraintEnd_toEndOf="parent"
    app:layout_constraintStart_toStartOf="parent"
    app:layout_constraintTop_toBottomOf="@+id/task_description"
    app:layout_constraintBottom_toTopOf="@id/task_base_buttons"
    >

</RelativeLayout>
</android.support.constraint.ConstraintLayout>

Upvotes: 2

Views: 2569

Answers (4)

Piyush Kumar
Piyush Kumar

Reputation: 50

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout 
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/activity_background"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="@android:color/white"
>
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="@+id/patientDOBBlock"
tools:text="Test Navigation Text"
android:layout_above = "@+id/navigation"/>

<include
android:id="@id/navigation"
android:layout_alignParentBottom = "true"
layout="@layout/bottom_navigation"
android:layout_height="66dp"
android:layout_width="match_parent"
/>
</RelativeLayout>

This should work perfectly

Upvotes: 0

Kristy Welsh
Kristy Welsh

Reputation: 8340

Actually, I had to add a LinearLayout, and then it all worked:

<?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_background"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="@android:color/white">


<TextView
    android:id="@+id/patientDOBBlock"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_above="@id/navigation"
    android:gravity="center"
    tools:text="Test Navigation Text" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:id="@+id/navigation">

<include
    android:id="@+id/constraintLayoutNavigation"
    layout="@layout/bottom_navigation"
    android:layout_width="match_parent"
    android:layout_height="66dp"
    android:layout_alignParentBottom="true" />
</LinearLayout>

</RelativeLayout>

Upvotes: 1

Pankaj Mundra
Pankaj Mundra

Reputation: 1599

Change your XML with the following.

<?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_background"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="@android:color/white">


    <TextView
        android:id="@+id/patientDOBBlock"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_above="@id/navigation"
        android:gravity="center"
        tools:text="Test Navigation Text" />

    <include
        android:id="@+id/navigation"
        layout="@layout/bottom_navigation"
        android:layout_width="match_parent"
        android:layout_height="66dp"
        android:layout_alignParentBottom="true" />

</RelativeLayout>

bottom_navigation.xml

<android.support.constraint.ConstraintLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="@+id/task_base_buttons"
android:layout_width="match_parent"
android:layout_height="66dp"
android:layout_marginBottom="8dp"
android:layout_marginEnd="8dp"
android:layout_marginStart="8dp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent">

    <Button
        android:id="@+id/btnTaskBack"
        style="@style/NeutrifProText.Button"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginStart="8dp"
        android:layout_weight="0.2"
        android:background="@android:color/transparent"
        android:text="@string/action_back"
        android:textColor="@color/colorPrimary"
        app:layout_constraintBottom_toBottomOf="@+id/btnTaskContinue"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="@+id/btnTaskContinue" />

    <Button
        android:id="@+id/btnTaskContinue"
        style="@style/NeutrifProText.Button"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_marginBottom="8dp"
        android:layout_marginEnd="8dp"
        android:layout_marginStart="8dp"
        android:layout_weight="0.6"
        android:background="@drawable/rounded_rect_color_primary"
        android:text="@string/action_continue"
        android:textColor="@color/white"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toStartOf="@+id/btnTaskSkip"
        app:layout_constraintStart_toEndOf="@+id/btnTaskBack" />

    <Button
        android:id="@+id/btnTaskSkip"
        style="@style/NeutrifProText.Button"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginEnd="8dp"
        android:layout_weight="0.2"
        android:background="@android:color/transparent"
        android:text="@string/action_skip"
        android:textColor="@color/colorPrimary"
        app:layout_constraintBottom_toBottomOf="@+id/btnTaskContinue"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintTop_toTopOf="@+id/btnTaskContinue" />

 </android.support.constraint.ConstraintLayout>

I hope it will work for you.

enter image description here

Upvotes: 2

Cheticamp
Cheticamp

Reputation: 62831

In the layout you have the included layout aligned to the parent bottom and below patientDOBBlock. These two directives are in conflict. I assume that you want the bottom navigation and the text view to both be aligned to the parent bottom and overlapped.

In the layout with the include remove the following line:

android:layout_below="@+id/patientDOBBlock"

That leaves the following layout:

<RelativeLayout 
    android:id="@+id/activity_background"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="@android:color/white">

    <TextView
        android:id="@+id/patientDOBBlock"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentBottom="true"
        tools:text="Test Navigation Text" />

    <include
        android:id="@+id/navigation"
        layout="@layout/bottom_navigation"
        android:layout_width="match_parent"
        android:layout_height="66dp"
        android:layout_alignParentBottom="true"
        app:layout_constraintBottom_toBottomOf="parent" />
</RelativeLayout>

In bottom_navigation.xml, remove the merge tags. From the documentation:

The tag helps eliminate redundant view groups in your view hierarchy when including one layout within another.

Since you need to keep the ConstraintLayout in the included file, you don't have redundant view groups, so you don't need the merge tag. The use of the merge tag also prevents the application of the layout parameters to the include file. See this.

You can also override all the layout parameters (any android:layout_* attributes) of the included layout's root view by specifying them in the tag.

<android.support.constraint.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:id="@+id/task_base_buttons"
    android:layout_width="match_parent"
    android:layout_height="66dp"
    android:layout_marginBottom="8dp"
    android:layout_marginEnd="8dp"
    android:layout_marginStart="8dp"
    app:layout_constraintBottom_toBottomOf="parent"
    app:layout_constraintEnd_toEndOf="parent"
    app:layout_constraintStart_toStartOf="parent">

    <Button
        android:id="@+id/btnTaskBack"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginStart="8dp"
        android:layout_weight="0.2"
        android:background="@android:color/transparent"
        android:text="action_back"
        android:textColor="@color/colorPrimary"
        app:layout_constraintBottom_toBottomOf="@+id/btnTaskContinue"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="@+id/btnTaskContinue" />

    <Button
        android:id="@+id/btnTaskContinue"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_marginBottom="8dp"
        android:layout_marginEnd="8dp"
        android:layout_marginStart="8dp"
        android:layout_weight="0.6"
        android:background="@color/colorPrimary"
        android:text="action_continue"
        android:textColor="@android:color/white"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toStartOf="@+id/btnTaskSkip"
        app:layout_constraintStart_toEndOf="@+id/btnTaskBack" />

    <Button
        android:id="@+id/btnTaskSkip"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginEnd="8dp"
        android:layout_weight="0.2"
        android:background="@android:color/transparent"
        android:text="action_skip"
        android:textColor="@color/colorPrimary"
        app:layout_constraintBottom_toBottomOf="@+id/btnTaskContinue"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintTop_toTopOf="@+id/btnTaskContinue" />

</android.support.constraint.ConstraintLayout>

Here is the result:

enter image description here

Although it is not hurting anything, the constraints specified in the ConstraintLayout will have no effect unless the parent is also a ConstraintLayout, so they can just be deleted.

Upvotes: 2

Related Questions