Изменение размера изображения - проблема мерцания в разворачивании инструмента - PullRequest
Новая
       35

Изменение размера изображения - проблема мерцания в разворачивании инструмента

1 голос
/ 01 июля 2019

Я хочу, чтобы изображение было свернуто в макете панели инструментов, поэтому при прокрутке списка ниже изображение становится в два раза меньше, но не исчезает полностью.

Пока я достиг этого с помощью следующего кода:

XML: 

<?xml version="1.0" encoding="utf-8"?>
<layout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:app="http://schemas.android.com/apk/res-auto">

<androidx.coordinatorlayout.widget.CoordinatorLayout android:layout_width="match_parent"
                                                     android:background="#fff"
                                                     android:layout_height="match_parent">

    <com.google.android.material.appbar.AppBarLayout android:layout_width="match_parent"
                                                     android:id="@+id/appBar"
                                                     android:elevation="1dp"
                                                     android:layout_height="300dp">

        <com.google.android.material.appbar.CollapsingToolbarLayout android:layout_width="match_parent"
                                                                    app:expandedTitleGravity="bottom"
                                                                    android:minHeight="200dp"
                                                                    app:layout_scrollFlags="scroll|exitUntilCollapsed"
                                                                    android:layout_height="match_parent">


            <androidx.constraintlayout.widget.ConstraintLayout android:layout_width="match_parent"
                                                               android:layout_height="wrap_content"
                                                               app:layout_collapseMode="pin"
                                                               android:layout_gravity="bottom"
                                                               android:orientation="vertical">

                <ImageView android:layout_width="200dp"
                           app:layout_constraintTop_toTopOf="parent"
                           app:layout_constraintStart_toStartOf="parent"
                           app:layout_constraintEnd_toEndOf="parent"
                           android:layout_height="200dp"
                           android:id="@+id/image"
                           android:scaleType="centerCrop"
                           android:src="@drawable/saya_no_uta"/>

                <TextView android:id="@+id/doStuff" android:layout_width="wrap_content"
                          app:layout_constraintEnd_toEndOf="parent"
                          app:layout_constraintTop_toTopOf="parent"
                          android:textColor="#fff"
                          android:layout_height="wrap_content" android:text="Do stuff"/>

                <LinearLayout
                        android:id="@+id/content"
                        android:background="#00f"
                        android:orientation="horizontal"
                        app:layout_constraintTop_toBottomOf="@id/image"
                        android:layout_width="match_parent"
                        android:layout_height="100dp">
                </LinearLayout>


            </androidx.constraintlayout.widget.ConstraintLayout>

        </com.google.android.material.appbar.CollapsingToolbarLayout>

    </com.google.android.material.appbar.AppBarLayout>

    <androidx.core.widget.NestedScrollView android:layout_width="match_parent"
                                           app:layout_behavior="com.google.android.material.appbar.AppBarLayout$ScrollingViewBehavior"
                                           android:layout_height="match_parent">
        <TextView android:layout_width="match_parent"
                  android:text="@string/large_text"
                  android:layout_height="wrap_content"/>

    </androidx.core.widget.NestedScrollView>

</androidx.coordinatorlayout.widget.CoordinatorLayout>

Котлин: 

class CollapsingToolbarFragment : Fragment() {

companion object {
    const val TAG = "CollapsingToolbarLayout"
}

var originalHeight: Float = 0.0f
var lastVerticalOffset: Int = Int.MAX_VALUE

override fun onCreateView(inflater: LayoutInflater, container: ViewGroup?, savedInstanceState: Bundle?): View? {
    val binding = FragmentCollapsingToolbarBinding.inflate(inflater, container, false)
    originalHeight = convertDpToPixel(200.0f)
    binding.lifecycleOwner = viewLifecycleOwner
    binding.appBar.addOnOffsetChangedListener(AppBarLayout.OnOffsetChangedListener { appBarLayout, verticalOffset ->
        if (lastVerticalOffset == verticalOffset) {
            return@OnOffsetChangedListener
        }
        lastVerticalOffset = verticalOffset
        val totalScrollRange = appBarLayout.totalScrollRange
        Log.i("Hello", "total: $totalScrollRange, offset: $verticalOffset")
        val size = originalHeight.toInt() + verticalOffset
        binding.image.layoutParams.height = size
        binding.image.layoutParams.width = size
        binding.image.requestLayout()
    })
    return binding.root
}

fun convertDpToPixel(dp: Float): Float {
    return dp * (requireContext().resources.displayMetrics.densityDpi.toFloat() / DisplayMetrics.DENSITY_DEFAULT)
}

}

Работает так, как должно, но есть побочные эффекты. Когда я быстро прокручиваю вверх или вниз, на долю секунды я вижу, как мое текстовое представление с текстом «Делать что-то» поднимается над или под своим местом с небольшим отступом, что действительно раздражает. Это может быть связано с тем, что я просто вручную вызываю requestLayout () Но какими еще способами я могу изменить размер изображения в OnOffsetChangedListener ?

Или, может быть, я мог бы пойти другим путем?

1 Ответ

0 голосов
/ 08 июля 2019

В случае, если кому-то было интересно, я смог получить лучшие результаты, используя свойства scaleX, scaleY и translationY в ImageView вместо запроса макета. Я также переместил свой редактор TextView за пределы макета ограничения.

Вот так выглядит мой onOffsetChanged для другой базы кода: 

override fun onOffsetChanged(appBarLayout: AppBarLayout, verticalOffset: Int) {
    if (scrollRange == -1) {
        scrollRange = binding.appBarLayout.totalScrollRange
    }

    val delta = 1.0f - abs(verticalOffset).toFloat() / scrollRange.toFloat() * 0.5f
    binding.avatar.scaleX = 0.2f + delta * 0.8f
    binding.avatar.scaleY = 0.2f + delta * 0.8f
    binding.avatar.translationY = delta * 0.5f * abs(verticalOffset)
}
...