TextView width bigger than FrameLayout.

[MartB]

Using nativehtml in a Framelayout inside a NestedScrollView does seem to have invalid width. Am i doing something obvious wrong or do i need to go bughunting within the library to fix the width calculation ?

Symptoms

Used Layout

<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="de.martin_boeh.kg_vertretungsplan.activities.ArticleDetailActivity">

    <android.support.design.widget.AppBarLayout>
    </android.support.design.widget.AppBarLayout>

    <android.support.v4.widget.NestedScrollView
        android:layout_width="0dp"
        android:layout_height="0dp"
        app:layout_behavior="@string/appbar_scrolling_view_behavior"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintHorizontal_bias="0.0"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toRightOf="parent"
        app:layout_constraintTop_toBottomOf="@+id/appbar"
        app:layout_constraintVertical_bias="0.0">

        <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"
            android:descendantFocusability="blocksDescendants"
            tools:context="de.martin_boeh.kg_vertretungsplan.activities.ArticleDetailActivity">

            <de.martin_boeh.kg_vertretungsplan.helper.AdjustableImageView
                android:id="@+id/thumb_img"
                android:layout_width="0dp"
                android:layout_height="wrap_content"
                android:layout_centerHorizontal="true"
                android:adjustViewBounds="true"
                android:cropToPadding="false"
                android:transitionName="teaser-expand"
                app:layout_constraintHorizontal_bias="0.0"
                app:layout_constraintLeft_toLeftOf="parent"
                app:layout_constraintRight_toRightOf="parent"
                app:layout_constraintTop_toTopOf="parent"
                tools:ignore="UnusedAttribute"
                tools:src="@drawable/seitenbreit_test" />

            <TextView
                android:id="@+id/title_text"
                android:layout_width="0dp"
                android:layout_height="wrap_content"
                android:layout_alignBottom="@+id/thumb_img"
                android:layout_alignParentLeft="true"
                android:layout_alignParentStart="true"
                android:layout_marginLeft="4dp"
                android:layout_marginRight="4dp"
                android:layout_marginTop="2dp"
                android:ellipsize="end"
                android:maxLines="3"
                android:textColor="@android:color/black"
                android:textSize="20sp"
                android:transitionName="title-expand"
                app:layout_constraintHorizontal_bias="0.0"
                app:layout_constraintLeft_toLeftOf="parent"
                app:layout_constraintRight_toRightOf="@+id/thumb_img"
                app:layout_constraintTop_toBottomOf="@+id/thumb_img"
                tools:ignore="UnusedAttribute"
                tools:text="Lorem ipsum dolor sit amet Lorem ipsum dolor sit amet" />

            <FrameLayout
                android:id="@+id/article_content"
                android:layout_width="0dp"
                android:layout_height="wrap_content"
                android:textColor="@android:color/black"
                app:layout_constraintBottom_toTopOf="@+id/downloadLinks"
                app:layout_constraintHorizontal_bias="0.0"
                app:layout_constraintLeft_toLeftOf="parent"
                app:layout_constraintRight_toRightOf="parent"
                app:layout_constraintTop_toBottomOf="@+id/title_text"
                app:layout_constraintVertical_bias="0.0"
                tools:text="Lorem ipsum bla bla bla bla bla bla" />

            <android.support.v7.widget.RecyclerView
                android:id="@+id/downloadLinks"
                android:layout_width="0dp"
                android:layout_height="wrap_content"
                android:layout_marginBottom="8dp"
                android:layout_marginEnd="4dp"
                android:layout_marginStart="4dp"
                android:clipToPadding="true"
                android:descendantFocusability="blocksDescendants"
                android:visibility="visible"
                app:layout_constraintBottom_toBottomOf="parent"
                app:layout_constraintEnd_toEndOf="parent"
                app:layout_constraintHorizontal_bias="0.0"
                app:layout_constraintStart_toStartOf="parent" />
        </android.support.constraint.ConstraintLayout>
    </android.support.v4.widget.NestedScrollView>
</android.support.constraint.ConstraintLayout>

Used code

htmlView.loadHtml(new StringReader("<style>body { font-size: 15px; } ul li{margin:0;}</style><body>" + articleData.getContentText()  + "</body>"), URI.create("someurl"));
contentView.addView(htmlView);

I can fix this behaviour with adding a "padding-right: 7px" to my html on the entire container. This is an ugly workaround tho as im not sure what underlying issue is causing it at the moment.

[stefanhaustein]

I don't see anything obviously wrong. HtmlView needs to be provided with a maximum width to work properly, but I don't think that explain this problem. Could it be some strange issue with space reserved for the scroll bar?

[MartB]

That sounds super possible now that you mention it. Will try to play with scrollbar sizes and see if it affects it.

[MartB]

Reporting back i tried changing the size of the scrollbar and it was not affecting the cut text at all. Also played around with more options and noticed no change.

Edit: If i change the constraints it just changes the position of where the text is cut so it seems to be an width calculation issue from within the library.

[stefanhaustein]

Can you try to cut this example down to a case that is straightforward to reproduce for me?

One option to debug this might be to print the element name, width, widthMode and borderBoxWidth in AndroidContainerElment.onMeasure, indented by the nesting level

[MartB]

will provide an example app on github in the next few days. Thanks for checking

[stefanhaustein]

p.s. Does the problem persist with less content? If it's related to the content, I could add the content to a test case...

[MartB]

Had not time to continue developing this app, will update you if i ever continue working on this.