Amr Bakri
Amr Bakri

Reputation: 11

How to force buttons to stick to the top and bottom of parent

I am using constraintlayout as shown below in the code. as the below posted image indicates, I would like to add to 2 strips of buttons at the top and at the bottom. as the image shows, the upper and the lower strips of buttons are not firmly adhere to the top and to the bottom respectively however the there is a spacing separates the buttons from the top and the bottom

How do I force both of the top buttons and the lower buttons to stick to top and the bottoms of the parent respectively?

customClass

  <?xml version="1.0" encoding="utf-8"?>
  <android.support.constraint.ConstraintLayout
    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:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".MainActivity">

  <Button
        android:id="@+id/topBtn_1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="topBtn1"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintRight_toLeftOf="@id/topBtn_2"
        app:layout_constraintBottom_toTopOf="@id/BottomBtn_1"
 />

 <Button
        android:id="@+id/topBtn_2"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="topBtn2"
        app:layout_constraintLeft_toRightOf="@id/topBtn_1"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintRight_toLeftOf="@id/topBtn_3"
        app:layout_constraintBottom_toTopOf="@id/BottomBtn_2"/>
<Button
        android:id="@+id/topBtn_3"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="topBtn3"
        app:layout_constraintLeft_toRightOf="@id/topBtn_2"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintRight_toRightOf="parent"
        app:layout_constraintBottom_toTopOf="@id/BottomBtn_3"/>

  <Button
        android:id="@+id/BottomBtn_1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="BottomBtn1"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintRight_toLeftOf="@id/BottomBtn_2"
        app:layout_constraintBottom_toBottomOf="parent"/>

<Button
        android:id="@+id/BottomBtn_2"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="BottomBtn2"
        app:layout_constraintLeft_toRightOf="@id/BottomBtn_1"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintRight_toLeftOf="@id/BottomBtn_3"
        app:layout_constraintBottom_toBottomOf="parent"/>
       <Button
        android:id="@+id/BottomBtn_3"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="BottomBtn3"
        app:layout_constraintLeft_toRightOf="@id/BottomBtn_2"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintRight_toRightOf="parent"
        app:layout_constraintBottom_toBottomOf="parent"/>

        </android.support.constraint.ConstraintLayout>

Upvotes: 0

Views: 923

Answers (1)

sanoJ
sanoJ

Reputation: 3128

If you need to keep the three buttons top and three buttons at the bottom as given below, you need to remove the links between the top and bottom buttons as given in the code below. Hope this will fix your issue.

enter image description here

<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout
    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:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".MainActivity">

    <Button
        android:id="@+id/topBtn_1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="topBtn1"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintRight_toLeftOf="@id/topBtn_2"/>

    <Button
        android:id="@+id/topBtn_2"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="topBtn2"
        app:layout_constraintLeft_toRightOf="@id/topBtn_1"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintRight_toLeftOf="@id/topBtn_3"/>

    <Button
        android:id="@+id/topBtn_3"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="topBtn3"
        app:layout_constraintLeft_toRightOf="@id/topBtn_2"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintRight_toRightOf="parent"/>

    <Button
        android:id="@+id/BottomBtn_1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="BottomBtn1"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toLeftOf="@id/BottomBtn_2"
        app:layout_constraintBottom_toBottomOf="parent"/>

    <Button
        android:id="@+id/BottomBtn_2"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="BottomBtn2"
        app:layout_constraintLeft_toRightOf="@id/BottomBtn_1"
        app:layout_constraintRight_toLeftOf="@id/BottomBtn_3"
        app:layout_constraintBottom_toBottomOf="parent"/>

    <Button
        android:id="@+id/BottomBtn_3"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="BottomBtn3"
        app:layout_constraintLeft_toRightOf="@id/BottomBtn_2"
        app:layout_constraintRight_toRightOf="parent"
        app:layout_constraintBottom_toBottomOf="parent"/>

</android.support.constraint.ConstraintLayout>

Upvotes: 1

Related Questions