检测AppBarLayout与NestedScrollView滚动效果及动画异常问题

嘿，我来帮你搞定这个CollapsingToolbarLayout的动画问题！你描述的场景里，向上滚动时工具栏先折叠、随后NestedScrollView滑到后方，现在要给工具栏里的图片加「上滑左移、下滑复位」的动画，但出现了触发异常的情况——大概率是动画触发时机没和工具栏的折叠进度绑定，或者和NestedScrollView的滚动监听冲突了。

下面是一套靠谱的解决方案：

核心思路 #

通过监听AppBarLayout的折叠偏移量，实时计算折叠进度，然后根据进度控制图片的横向位移，确保动画只在工具栏折叠/展开的阶段生效，避免和NestedScrollView的滚动混淆。

具体实现步骤 #

1. 布局准备 #

确保你的CollapsingToolbarLayout里的ImageView有明确的id，比如：

<androidx.coordinatorlayout.widget.CoordinatorLayout ...>
    <com.google.android.material.appbar.AppBarLayout
        android:id="@+id/app_bar_layout"
        ...>
        <com.google.android.material.appbar.CollapsingToolbarLayout
            ...>
            <ImageView
                android:id="@+id/toolbar_image"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:scaleType="centerCrop"
                android:src="@drawable/your_toolbar_image"/>
            <!-- 其他Toolbar内容 -->
        </com.google.android.material.appbar.CollapsingToolbarLayout>
    </com.google.android.material.appbar.AppBarLayout>

    <androidx.core.widget.NestedScrollView
        app:layout_behavior="@string/appbar_scrolling_view_behavior"
        ...>
        <!-- 滚动内容 -->
    </androidx.core.widget.NestedScrollView>
</androidx.coordinatorlayout.widget.CoordinatorLayout>

2. 监听折叠进度并执行动画 #

在你的Activity或Fragment中，添加AppBarLayout的偏移监听，实时控制图片位移：

// 初始化控件
val appBarLayout = findViewById<AppBarLayout>(R.id.app_bar_layout)
val toolbarImage = findViewById<ImageView>(R.id.toolbar_image)
// 定义图片左滑的最大距离（比如100dp，可根据需求调整）
val maxSlideDistance = resources.getDimension(R.dimen.toolbar_image_slide_distance)

// 创建偏移监听
val offsetListener = AppBarLayout.OnOffsetChangedListener { appBar, verticalOffset ->
    // 计算折叠进度：0=完全展开，1=完全折叠
    val scrollRange = appBar.totalScrollRange
    val collapseProgress = Math.abs(verticalOffset).toFloat() / scrollRange.toFloat()
    
    // 根据进度设置图片横向位移：完全折叠时左滑maxSlideDistance，展开时复位到0
    toolbarImage.translationX = -maxSlideDistance * collapseProgress
}

// 添加监听
appBarLayout.addOnOffsetChangedListener(offsetListener)

3. 避免内存泄漏 #

如果是在Fragment中使用，记得在销毁视图时移除监听：

override fun onDestroyView() {
    super.onDestroyView()
    appBarLayout.removeOnOffsetChangedListener(offsetListener)
}

常见问题修复 #

如果还是出现「有时向上滚动动画异常」的情况，检查这几点：

• 确认AppBarLayout的layout_scrollFlags设置正确，应该是scroll|exitUntilCollapsed，确保工具栏能正常折叠
• 不要同时给NestedScrollView添加滚动监听来控制这个动画，否则会和AppBar的监听冲突
• 如果需要更平滑的过渡效果，可以用ValueAnimator包裹translationX的变化，但实时计算进度的方式更贴合滚动的手感

内容的提问来源于stack exchange，提问作者Anky An