Positioning in ConstraintLayout causes HorizontalScrollView to cut off content

Question

<android.support.constraint.ConstraintLayout
        android:layout_width="0dp"
        android:layout_height="match_parent"
        android:layout_weight="14"
        android:layout_gravity="bottom"
        android:background="@drawable/object_detailed_information_bar"
        android:padding="@dimen/object_detailed_information_bar_padding">

        <ImageView
            android:layout_width="wrap_content"
            android:layout_height="0dp"
            android:id="@+id/object_type_icon_image_view"
            android:scaleType="fitXY"
            android:adjustViewBounds="true"
            android:src="@drawable/restaurant_marker_icon"
            app:layout_constraintLeft_toLeftOf="parent"
            app:layout_constraintTop_toTopOf="parent"
            app:layout_constraintBottom_toBottomOf="parent"/>

        <HorizontalScrollView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginLeft="@dimen/object_name_text_view_margin_start_or_left"
            android:layout_marginStart="@dimen/object_name_text_view_margin_start_or_left"
            app:layout_constraintTop_toTopOf="parent"
       app:layout_constraintLeft_toRightOf="@id/object_type_icon_image_view">

            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:id="@+id/object_name_text_view"
                android:scrollHorizontally="true"
                android:lines="1" />
        </HorizontalScrollView>

    </android.support.constraint.ConstraintLayout>

I positioned the TextView wrapped by ScrollHorizontalView to be the right of the ImageView using app:layout_constraintLeft_toRightOf="@id/object_type_icon_image_view". But it caused also unexcepted behaviour. Text stored in TextView can be scrolled but it's cut off by few letters. When i delete this line app:layout_constraintLeft_toRightOf="@id/object_type_icon_image_view", text it's fully shown while scrolling. Is there any way to fix that issue?

Screens:

android:text="123456789123456789123456789123456789123456789123456789"

1. Before scroll when positioned to the right of ImageView

2. After scroll when positioned to the right of ImageView - it's cut off

3. Before scroll without positioning

4. After scroll without positioning - it's ok

Answer 1

Short answer:

Change the width of your HorizontalScrollView to 0dp and constrain its right-hand edge to the parent:

android:layout_width="0dp"
app:layout_constraintRight_toRightOf="parent"

Explanation:

Right now, your HorizontalScrollView is using wrap_content for its width. This makes it attempt to be as long as the text, but the parent (the ConstraintLayout) won't allow its children to have a width larger than itself. So your HorizontalScrollView winds up being the same width as the ConstraintLayout.

However, you've positioned the HorizontalScrollView such that it has been moved slightly to the right. This means that there's part of the view that is invisible; the ConstraintLayout is clipping the HorizontalScrollView.

To fix this, you need to make sure that the HorizontalScrollView is as wide as the space between the right edge of the image and the right edge of the parent. You already have a left constraint on the HorizontalScrollView, so you need to add a right constraint. Once both sides are constrained, you can use a width of 0dp to mean "match constraints"; now the HorizontalScrollView will size itself to the available space.