I have an inner constraint layout that is hosting an icon, text and button to open another activity.
This is the XML
<androidx.constraintlayout.widget.ConstraintLayout
android:id="#+id/manageMyAccount"
android:layout_width="0dp"
android:layout_height="40dp"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent">
<ImageView
android:id="#+id/imageView4"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="8dp"
android:contentDescription="TODO"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:srcCompat="#drawable/ic_search_black_24dp" />
<TextView
android:id="#+id/textView1"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginStart="8dp"
android:text="#string/settings_manage_my_account"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toStartOf="#+id/imageButton"
app:layout_constraintStart_toEndOf="#+id/imageView4"
app:layout_constraintTop_toTopOf="parent"
tools:text="Manage My Account" />
<ImageButton
android:id="#+id/imageButton"
android:layout_width="43dp"
android:layout_height="34dp"
android:background="#android:color/transparent"
android:scaleType="fitCenter"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintVertical_bias="1.0"
app:srcCompat="#drawable/arrowforward" />
</androidx.constraintlayout.widget.ConstraintLayout>
I need about 40 instances like this with different text and Icons, other than make it a list(which I can't as I have 2 types of those layouts. how can I effectively copy and pate this without creating name conflict? and the other mess that comes with it.
Related
I am trying to achieve the below in my xml but currently when I my textView does not wrap the text as exepcted but instead pushes the the text down and the imageButton far. I am wondering how can I achieve this having in mind the texts can be bigger and need to wrap and fit in nicely without pushing the button away? below is my code sample
<androidx.constraintlayout.widget.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="wrap_content">
<ImageView
android:id="#+id/hospitalButton"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="48dp"
app:image="#drawable/hospital_btn"
app:layout_constraintEnd_toStartOf="#+id/guidelineCenterButton"
app:layout_constraintHorizontal_bias="0.5"
app:startsChecked="true" />
<View
android:id="#+id/buttonDivider"
android:layout_width="match_parent"
android:layout_height="1dp"
android:layout_marginStart="32dp"
android:layout_marginTop="42dp"
android:background="#color/white_"
app:layout_constraintBottom_toTopOf="#+id/hospitalGroup"
app:layout_constraintTop_toBottomOf="#id/hospitalButton" />
<androidx.constraintlayout.widget.ConstraintLayout
android:id="#+id/hospitalGroup"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginStart="32dp"
android:layout_marginTop="12dp"
app:layout_constraintTop_toBottomOf="#id/buttonDivider">
<TextView
android:id="#+id/idTextView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginEnd="30dp"
android:text="#string/id_text"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toStartOf="#id/midTextView"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
tools:text="Get ID" />
<TextView
android:id="#+id/midTextView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginEnd="30dp"
android:text="#string/mid_text"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toStartOf="#id/submitButton"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
/>
<ImageButton
android:id="#+id/submitButton"
android:layout_width="48dp"
android:layout_height="48dp"
android:layout_marginEnd="32dp"
android:background="#drawable/submitbackground"
android:src="#drawable/submit_icon"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<com.airbnb.lottie.LottieAnimationView
android:id="#+id/animation"
android:layout_width="30dp"
android:layout_height="30dp"
android:layout_marginEnd="16dp"
android:elevation="3dp"
android:scaleType="centerInside"
app:layout_constraintBottom_toBottomOf="#+id/submitButton"
app:layout_constraintEnd_toEndOf="#+id/submitButton"
app:layout_constraintStart_toStartOf="#+id/submitButton"
app:layout_constraintTop_toTopOf="#+id/submitButton"
app:lottie_autoPlay="true"
app:lottie_loop="true"
app:lottie_rawRes="#raw/spinner" />
</androidx.constraintlayout.widget.ConstraintLayout>
<View
android:id="#+id/submitGroupDivider"
android:layout_width="match_parent"
android:layout_height="1dp"
android:layout_marginStart="32dp"
android:layout_marginTop="12dp"
android:background="#color/white"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#id/hospitalGroup" />
</androidx.constraintlayout.widget.ConstraintLayout>
From your description it's not clear what you wanted to do but here is the solution you can apply to make your view as a picture you uploaded.
Just apply height & width of midTextView to 0dp
Note: don't know what your idTextView will do it's not clear as per your layout structure.
<TextView
android:id="#+id/idTextView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginEnd="30dp"
android:text="#string/id_text"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
tools:text="Get ID" />
<TextView
android:id="#+id/midTextView"
android:layout_width="0dp"
android:layout_height="0dp"
android:gravity="center_vertical"
android:layout_marginEnd="30dp"
android:text="#string/mid_text"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toStartOf="#id/submitButton"
app:layout_constraintStart_toEndOf="#id/idTextView"
app:layout_constraintTop_toTopOf="parent"
/>
I am facing problem with the scaling of "images", "text fields", "buttons", basically all the elements I have used in my layout.
If you see below, This is is a 5.5 inch resolution display and my application is looking perfect, but when I change screen resolution, my elements start overlapping. This is how it starts looking...
Elements starts overlapping eachother, can anyone help me with this issue? I have been struggling for 4 days now.
Below is the layout XML...
ALSO I WAS DRAGGING THE SMALL CENTERED BUBBLES TO MATCH IT TO THE SCREEN SEND SO THAT I COULD BUILD, OTHERWISE I WAS GETTING BUILD ERROR, SO I DRAGGED THOSE BUBBLES TO EDGE OF THE SCREEN TO MAKE IT FIX
<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.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=".MainActivity"
android:background="#drawable/appbackgroundall">
<Switch
android:id="#+id/smartlever"
android:layout_width="116dp"
android:layout_height="42dp"
android:checked="false"
android:hapticFeedbackEnabled="true"
android:scaleX="2"
android:scaleY="2"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.294"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintVertical_bias="0.499"/>
<TextView
android:id="#+id/smartButtonText"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:fontFamily="#font/sansationregular"
android:scaleX="2"
android:scaleY="2"
android:text="Tap to alter smart mode"
android:textColor="#color/colorAccent"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintVertical_bias="0.433" />
<ImageView
android:id="#+id/allbackcologo"
android:layout_width="66dp"
android:layout_height="62dp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.498"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintVertical_bias="0.976"
app:srcCompat="#drawable/companylogo" />
<ImageView
android:id="#+id/spaceman"
android:layout_width="205dp"
android:layout_height="253dp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.868"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintVertical_bias="0.15"
app:srcCompat="#drawable/spaceman" />
<ImageView
android:id="#+id/pingedlogo"
android:layout_width="139dp"
android:layout_height="52dp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.058"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintVertical_bias="0.023"
app:srcCompat="#drawable/pingedlogo" />
<Button
android:id="#+id/developerbutton"
style="#style/Widget.MaterialComponents.Button.TextButton"
android:hapticFeedbackEnabled="true"
android:layout_width="64dp"
android:layout_height="61dp"
android:fontFamily="monospace"
android:scaleX="2"
android:scaleY="2"
android:text=""
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.495"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintVertical_bias="0.976" />
<ImageView
android:id="#+id/settingButton"
android:layout_width="61dp"
android:layout_height="59dp"
android:rotation="175"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.923"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintVertical_bias="0.023"
app:srcCompat="#drawable/settingbutton" />
<Button
android:id="#+id/settingB"
style="#style/Widget.MaterialComponents.Button.TextButton"
android:layout_width="60dp"
android:layout_height="59dp"
android:fontFamily="monospace"
android:scaleX="2"
android:scaleY="2"
app:layout_constraintBottom_toBottomOf="#+id/settingButton"
app:layout_constraintEnd_toEndOf="#+id/settingButton"
app:layout_constraintHorizontal_bias="0.0"
app:layout_constraintStart_toStartOf="#+id/settingButton"
app:layout_constraintTop_toTopOf="#+id/settingButton"
app:layout_constraintVertical_bias="0.0" />
<ImageView
android:id="#+id/imageView5"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.093"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintVertical_bias="0.784"
app:srcCompat="#drawable/alientwo" />
</androidx.constraintlayout.widget.ConstraintLayout>
Try to use minWidth and maxWidth,
example :
<ImageView
android:id="#+id/imageView5"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:maxHeight="50dp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.093"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintVertical_bias="0.784"
app:srcCompat="#drawable/alientwo" />
I have a problem with the line that appears under each card as shown in this picture. Is there any way to remove it, or is it not possible?
Also, how can I present each card with a different color for example (purple and yellow)?
This is my code
<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.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=".benReqView">
<Button
android:id="#+id/button15"
android:layout_width="32dp"
android:layout_height="32dp"
android:background="#drawable/chat2"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.6"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintVertical_bias="0.977" />
<Button
android:id="#+id/benReqback"
android:layout_width="25dp"
android:layout_height="22dp"
android:layout_marginStart="8dp"
android:layout_marginLeft="8dp"
android:layout_marginTop="16dp"
android:background="#drawable/leftarrow"
app:layout_constraintBottom_toTopOf="#+id/signupDon"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.021"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintVertical_bias="0.073" />
<TextView
android:id="#+id/benReqEmpty"
android:layout_width="150dp"
android:layout_height="23dp"
android:layout_marginStart="20dp"
android:layout_marginTop="2dp"
android:layout_marginEnd="20dp"
android:text=""
android:textSize="14sp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.497"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintVertical_bias="0.086" />
<ListView
android:id="#+id/benReqListView"
android:layout_width="401dp"
android:layout_height="539dp"
android:layout_marginBottom="2dp"
android:background="#fafafa"
app:layout_constraintBottom_toTopOf="#+id/imageView8"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent">
</ListView>
<TextView
android:id="#+id/textView23"
android:layout_width="136dp"
android:layout_height="24dp"
android:fontFamily="#font/tajawalmedium2"
android:text="حالة الطلبات"
android:textAlignment="center"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintVertical_bias="0.022" />
<ImageView
android:id="#+id/imageView8"
android:layout_width="414dp"
android:layout_height="60dp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.0"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintVertical_bias="1.0"
app:srcCompat="#drawable/footer" />
<Button
android:id="#+id/benReqToprofile"
android:layout_width="32dp"
android:layout_height="32dp"
android:background="#drawable/userr"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.82"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintVertical_bias="0.977" />
<Button
android:id="#+id/benReqToHomeicon"
android:layout_width="37dp"
android:layout_height="37dp"
android:background="#drawable/home"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.17"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintVertical_bias="0.988" />
<Button
android:id="#+id/benReq"
android:layout_width="39dp"
android:layout_height="40dp"
android:background="#drawable/request"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.38"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintVertical_bias="0.981" />
</androidx.constraintlayout.widget.ConstraintLayout>
I suspect that the line you're talking about is the ListView's background appearing between your cards.
Try removing this line: android:background="#fafafa"
By the way, I suggest you to use a RecyclerView instead of ListView
You can remove the ListView's dividers by setting the divider's height to 0dp. Add the following lines to your ListView:
android:dividerHeight="0dp"
android:divider="#null"
I'm trying to create a layout for my recycler view. I thought the best would be using a constraint layout for the activity. It renders correctly in the preview window but gets distorted while running the application. I tried using constraint layout before but I got the same problem please help. I posted both the code and image file of the layout
this is after running the application
<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.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"
android:background="#drawable/levelback">
<ImageView
android:id="#+id/userface"
android:layout_width="76dp"
android:layout_height="76dp"
android:contentDescription="#string/player2"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.0"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintVertical_bias="0.004"
app:srcCompat="#drawable/ic_angry" />
<TextView
android:id="#+id/username"
android:layout_width="wrap_content"
android:layout_height="27dp"
android:layout_marginEnd="212dp"
android:text="#string/player2"
android:textColor="#android:color/background_light"
android:textSize="25sp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintVertical_bias="0.014" />
<TextView
android:id="#+id/usedesc"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="descryption"
android:textColor="#android:color/darker_gray"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.324"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintVertical_bias="0.06" />
</androidx.constraintlayout.widget.ConstraintLayout>
There you go:
<ImageView
android:id="#+id/userface"
android:layout_width="76dp"
android:layout_height="76dp"
android:layout_marginStart="8dp"
android:layout_marginTop="8dp"
android:contentDescription="#string/player2"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:srcCompat="#drawable/ic_angry" />
<TextView
android:id="#+id/username"
android:layout_width="wrap_content"
android:layout_height="27dp"
android:layout_marginStart="8dp"
android:layout_marginTop="8dp"
android:text="player2"
android:textColor="#android:color/background_light"
android:textSize="25sp"
app:layout_constraintStart_toEndOf="#+id/userface"
app:layout_constraintTop_toTopOf="parent" />
<TextView
android:id="#+id/usedesc"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="8dp"
android:layout_marginTop="8dp"
android:text="descryption"
android:textColor="#android:color/darker_gray"
app:layout_constraintStart_toEndOf="#+id/userface"
app:layout_constraintTop_toBottomOf="#id/username" />
Put it inside ConstraintLayout.
Change your Strings and manipulate with margins if you need to.
I am using the drag and drop functionality in the layout editor to try and get 4 image buttons aligned in a kite shape. This is the layout I am trying to achieve, currently using ImageButton but I will change to the circular image view to suit the layout later.
Can anyone help me to achieve this. Please find my XML below:
<android.support.constraint.ConstraintLayout
android:id="#+id/ongoing_call_layout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:padding="#dimen/activity_padding"
android:layout_below="#id/contact_number_tv"
android:layout_above="#id/calculator_layout">
<ImageButton
android:id="#+id/home_imgBtn"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="120dp"
android:src="#android:drawable/btn_star"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<ImageButton
android:id="#+id/not_billable_imgBtn"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="104dp"
android:src="#android:drawable/btn_star"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<ImageButton
android:id="#+id/billable_imgBtn"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#android:drawable/btn_star"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="1.0"
app:layout_constraintStart_toEndOf="#+id/not_billable_imgBtn"
tools:layout_editor_absoluteY="105dp" />
<ImageButton
android:id="#+id/decide_later_imgBtn"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginEnd="120dp"
android:src="#android:drawable/btn_star"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent" />
</android.support.constraint.ConstraintLayout>
Try this buddy, and make your own adjustments.
<android.support.constraint.ConstraintLayout
android:id="#+id/ongoing_call_layout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:padding="#dimen/activity_padding"
android:layout_below="#id/contact_number_tv"
android:layout_above="#id/calculator_layout">
<ImageButton
android:id="#+id/home_imgBtn"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="8dp"
android:layout_marginEnd="8dp"
android:layout_marginStart="8dp"
android:layout_marginTop="8dp"
android:src="#android:drawable/btn_star"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.32"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<ImageButton
android:id="#+id/not_billable_imgBtn"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginEnd="8dp"
android:layout_marginStart="8dp"
android:layout_marginTop="24dp"
android:src="#android:drawable/btn_star"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<ImageButton
android:id="#+id/billable_imgBtn"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="8dp"
android:layout_marginStart="8dp"
android:layout_marginTop="8dp"
android:src="#android:drawable/btn_star"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.66"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<ImageButton
android:id="#+id/decide_later_imgBtn"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginEnd="8dp"
android:layout_marginStart="8dp"
android:layout_marginTop="60dp"
android:layout_marginBottom="24dp"
android:src="#android:drawable/btn_star"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/not_billable_imgBtn" />
</android.support.constraint.ConstraintLayout>
See the example image
But perhaps your real problem is that the constrainLayout is not your root element, and you should set a fixed height instead of android:layout_height="wrap_content"