1 year ago

#358646

test-img

DoctorWho

Android - Layout not follow image resize

I start immediately from the problem:

  • When I try to apply a new size to the image the layout below does not fit with the new size of the occupied screen.

For implementation reasons I'm trying to get the parallax effect, with content at the bottom of the screen that can scroll, an image above that adjusts in height to half its height. To do this I thought of modifying the height of the image based on how much I am scrolling the part below. So I made the following class that by listening to the scroll events readjusts the image and this SHOULD also readjust the part below.

My class is:

    private class ScrollPositionObserver(
    val nestedScrollView: NestedScrollView,
    val imageView: ImageView
) : OnScrollChangedListener {
    private val mImageViewHeight: Int = 250
    override fun onScrollChanged() {
        val scrollY = nestedScrollView.scrollY.coerceAtLeast(0).coerceAtMost(mImageViewHeight)
        imageView.translationY = -(scrollY / 2).toFloat()
    }

}

to connect the listener:

    val mScrollView = view.findViewById(R.id.scrollView) as NestedScrollView
    val mPhotoIV = view.findViewById(R.id.contactPic) as ImageView

    mScrollView.viewTreeObserver.addOnScrollChangedListener(
        ScrollPositionObserver(
            mScrollView,
            mPhotoIV
        )
    )

and my xml:

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">

<ImageView
    android:id="@+id/contactPic"
    android:layout_width="match_parent"
    android:layout_height="250dp"
    android:scaleType="centerCrop"
    android:src="@drawable/placeholder_image_squared" />

<androidx.core.widget.NestedScrollView
    android:id="@+id/scrollView"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:fillViewport="true">

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="vertical">

        <ImageView
            android:layout_width="match_parent"
            android:layout_height="250dp"
            android:scaleType="centerCrop"
            android:src="@drawable/placeholder_image_squared" />

        <ImageView
            android:layout_width="match_parent"
            android:layout_height="250dp"
            android:scaleType="centerCrop"
            android:src="@drawable/placeholder_image_squared" />

        <ImageView
            android:layout_width="match_parent"
            android:layout_height="250dp"
            android:scaleType="centerCrop"
            android:src="@drawable/placeholder_image_squared" />
    </LinearLayout>
</androidx.core.widget.NestedScrollView>

Result: I can change the image size but my scrollView not change it's size. enter image description here

here what I would achieve:

enter image description here

P.S. I would not like to use the coordinator layout. Know a different way to do it?

android

parallax

0 Answers

Your Answer

Accepted video resources