Position buttons to bottom on constraint layout

12,208

Problem solved. I have been working with multiple fragments in my app using the FragmentTransaction replace method to put each new fragment view into my one content_frame. The problem was not with the constraint layout mentioned above, but with the container view I was using. Problem container was:

<?xml version="1.0" encoding="utf-8"?>
<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:layout_width="match_parent"
android:layout_height="match_parent"
tools:context="xxx.xxxx.weather.WeatherActivity">

<android.support.v7.widget.Toolbar
    android:id="@+id/my_toolbar"
    android:layout_width="match_parent"
    android:layout_height="?attr/actionBarSize"
    android:background="?attr/colorPrimary"
    android:elevation="4dp"
    android:theme="@style/ThemeOverlay.AppCompat.ActionBar"
    app:popupTheme="@style/ThemeOverlay.AppCompat.Light"/>

<FrameLayout
    android:id="@+id/content_frame"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    app:layout_constraintEnd_toEndOf="parent"
    app:layout_constraintStart_toStartOf="parent"
    app:layout_constraintTop_toBottomOf="@+id/my_toolbar"/>

</android.support.constraint.ConstraintLayout>

Replacing the ConstraintLayout with a RelativeLayout (and deleting the layout_constraint stuff) solved the problem. Evidently, a ConstraintLayout within another ConstraintLayout was confusing the situation. Initially, I did not think about the container view since the other fragments I was using did not seem to have any problems.

Previously I had tried changing the FrameLayout height to "match_parent", but that caused additional problems, such as other fragments not being displayed at all.

Thanks to all who took a look at this.

Share:
12,208
mtdavem
Author by

mtdavem

Updated on June 05, 2022

Comments

  • mtdavem
    mtdavem almost 2 years

    I am trying to position two buttons to the bottom of a constraint layout. In the Design view in Android Studio, everything looks OK, but when I run the app in debug, the buttons look like they are aligned with the last fields at the top of the screen. I have tried Guidelines and Barriers, but could not get the Barriers to work in my version of studio (3.0.1). If I try to alight the buttons with the top of the display, they disappear when I switch to landscape mode. Any suggestions, or should I just go with another type of layout on this issue? Thanks

    My design image

    My design image

    My code:

    <?xml version="1.0" encoding="utf-8"?>
    <android.support.constraint.ConstraintLayout
    android:id="@+id/location_detail"
    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:layout_width="match_parent"
    android:layout_height="match_parent"
    android:fitsSystemWindows="true">
    
    <android.support.constraint.Guideline
        android:id="@+id/guideline"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:orientation="horizontal"
        app:layout_constraintGuide_begin="10dp"
        app:layout_constraintHeight_min="?attr/actionBarSize"
        app:layout_constraintTop_toTopOf="parent"/>
    
    
    <TextView
        android:id="@+id/location_name_title"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:labelFor="@+id/location_name"
        android:text="@string/location_name_title"
        app:layout_constraintBaseline_toBaselineOf="@+id/location_name"
        app:layout_constraintLeft_toRightOf="parent"
        app:layout_constraintTop_toBottomOf="@+id/guideline"/>
    
    <EditText
        android:id="@+id/location_name"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_marginTop="10dp"
        android:ems="13"
        android:inputType="textPersonName"
        app:layout_constraintLeft_toRightOf="@+id/guideline2"
        app:layout_constraintTop_toBottomOf="@+id/guideline"/>
    
    <TextView
        android:id="@+id/location_region_title"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="@string/location_region_title"
        app:layout_constraintBaseline_toBaselineOf="@+id/location_region"
        app:layout_constraintLeft_toRightOf="parent"
        app:layout_constraintTop_toBottomOf="@+id/location_name_title"/>
    
    <TextView
        android:id="@+id/location_region"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginTop="8dp"
        android:text="@string/location_detail_region"
        app:layout_constraintLeft_toRightOf="@+id/guideline2"
        app:layout_constraintTop_toBottomOf="@+id/location_name"/>
    
    <TextView
        android:id="@+id/location_country_title"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="@string/location_country_title"
        app:layout_constraintBaseline_toBaselineOf="@+id/location_country"
        app:layout_constraintLeft_toRightOf="parent"
        app:layout_constraintTop_toBottomOf="@+id/location_region_title"/>
    
    <TextView
        android:id="@+id/location_country"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginTop="8dp"
        android:text="@string/location_detail_country"
        app:layout_constraintLeft_toRightOf="@+id/guideline2"
        app:layout_constraintTop_toBottomOf="@+id/location_region"/>
    
    <TextView
        android:id="@+id/location_latitude_title"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="@string/location_detail_latitude"
        app:layout_constraintBaseline_toBaselineOf="@+id/location_latitude"
        app:layout_constraintLeft_toRightOf="parent"
        app:layout_constraintTop_toBottomOf="@+id/location_country_title"/>
    
    <TextView
        android:id="@+id/location_latitude"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginTop="8dp"
        android:text="@string/location_latitude_title"
        app:layout_constraintLeft_toRightOf="@+id/guideline2"
        app:layout_constraintTop_toBottomOf="@+id/location_country"/>
    
    <TextView
        android:id="@+id/location_longitude_title"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="@string/location_longitude_title"
        app:layout_constraintBaseline_toBaselineOf="@+id/location_longitude"
        app:layout_constraintLeft_toRightOf="parent"
        app:layout_constraintTop_toBottomOf="@+id/location_latitude_title"/>
    
    <TextView
        android:id="@+id/location_longitude"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginTop="8dp"
        android:text="@string/location_detail_longitude"
        app:layout_constraintLeft_toRightOf="@+id/guideline2"
        app:layout_constraintTop_toBottomOf="@+id/location_latitude"/>
    
    <android.support.constraint.Guideline
        android:id="@+id/guideline2"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:orientation="vertical"
        app:layout_constraintGuide_percent="0.27"/>
    
    <android.support.v7.widget.AppCompatButton
        android:id="@+id/delete_location_button"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center"
        android:layout_marginEnd="8dp"
        android:layout_marginStart="8dp"
        android:onClick="saveLocation"
        android:text="@string/location_delete_button"
        app:layout_constraintEnd_toStartOf="@+id/save_location_button"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintBottom_toBottomOf="parent" />
    
    
    <android.support.v7.widget.AppCompatButton
        android:id="@+id/save_location_button"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center"
        android:layout_marginEnd="8dp"
        android:layout_marginStart="8dp"
        android:text="@string/location_save_button"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toEndOf="@+id/delete_location_button"
        app:layout_constraintBottom_toBottomOf="parent" />
    
    
    </android.support.constraint.ConstraintLayout>
    

    Screen Shot of problem

    Screen Shot of problem

    Additional info about this screen. There is a toast message that is briefly displayed. Also if you wish to edit the Location Name, a soft keyboard should appear.

    I am testing on a Nexus 7 running Android 5.1.1, but behavior is the same when I run on Nexus 6P running 8.1.0.