Align view bottom to text baseline

Question

In ConstraintLayout, is there a way to align the bottom of a View (e.g. ImageView) to the baseline of a TextView? I'm expecting there to be a constraint like app:layout_constraintBottom_toBaselineOf, but nothing like that exists.

Note: I've tried app:layout_constraintBaseline_toBaselineOf, but it looks like that only works when defined on a TextView.

Answer 1

This might be too late but I hope still helpful for someone who reads the post.

In this specific example, if you want to align an ImageView to a TextView's baseline, the default alignment setting for an ImageView is applied to the "top", not sure why.. Most likely you want to apply it to the bottom of the ImageView which can be achieved by setting android:baselineAlignBottom="true" attribute. More info here: https://developer.android.com/reference/android/widget/ImageView.html#attr_android:baselineAlignBottom

So the full code for ConstraintLayout will look like this:

<android.support.constraint.ConstraintLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content">
  <TextView
      android:id="@+id/textView"
      android:layout_width="wrap_content"
      android:layout_height="wrap_content" />
  <android.support.v7.widget.AppCompatImageView
      android:id="@+id/imageView"
      android:layout_width="96dp"
      android:layout_height="96dp"
      android:baselineAlignBottom="true"
      app:layout_constraintBaseline_toBaselineOf="@id/textView"
      app:layout_constraintStart_toEndOf="@id/textView"
      app:srcCompat="@drawable/drawable1"
      android:contentDescription="@null"/>
</android.support.constraint.ConstraintLayout>

I'm using an AppCompatImageView in my project but I'm pretty sure a regular ImageView will work the same way.

The same behavior can also be achieved by a RelativeLayout by also adding a layout_alignBaseline="@id/textView" to the ImageView.

In case this doesn't work for some reason, e.g. you have a custom view or something, you might also consider doing it in runtime.

There is a method in a TextView, called getLastBaselineToBottomHeight. It returns the distance between the last text baseline and the bottom of this TextView. You can apply that value to your View's bottom margin which should give you the same effect. Although the method was only introduced in Android P, you can simply implement it the same way (according to the source code). Just an example that worked for me:

MarginLayoutParams params = (MarginLayoutParams) rootView.findViewById(R.id.imageView).getLayoutParams();
params.bottomMargin = textView.getPaddingBottom() + textView.getPaint().getFontMetricsInt().descent;

I hope that helps. Good luck!