recyclerview 在滚动时坚持使用图像放大/缩小动画的位置
Posted
技术标签:
【中文标题】recyclerview 在滚动时坚持使用图像放大/缩小动画的位置【英文标题】:recyclerview stick to a position with image zoom in/out animation while scrolling 【发布时间】:2021-12-01 21:18:25 【问题描述】:当我们滚动视图时,recyclerview 会固定在一个位置,并且图像应该随着动画而缩小。也尝试了协调器布局和工具栏,但没有成功。任何帮助或建议都会非常感激。
正如您在 GIF 中看到的那样,进展如何。
【问题讨论】:
添加实现代码.. 【参考方案1】: Finally get the solution with the help of MotionLayout. Here is my solution
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout 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:id="@+id/root_view"
android:layout_
android:layout_
android:background="@color/back_screen_color_list"
>
<LinearLayout
android:id="@+id/layout_drawer_down"
android:layout_
android:layout_
android:layout_centerHorizontal="true"
android:layout_marginTop="@dimen/list_header_arrow_margin_top"
android:gravity="center">
<ImageView
android:id="@+id/iv_drawer_down"
android:layout_
android:layout_
app:srcCompat="@drawable/ic_arrow_down_new"
app:tint="@color/image_grey" />
</LinearLayout>
<androidx.constraintlayout.motion.widget.MotionLayout
android:id="@+id/motionLayout"
android:layout_
android:layout_
app:layoutDescription="@xml/chat_detail_anim"
android:layout_below="@+id/layout_drawer_down"
android:paddingLeft="@dimen/list_detail_margin_left_right"
android:paddingRight="@dimen/list_detail_margin_left_right"
android:layout_marginTop="@dimen/margin_start_item">
<RelativeLayout
android:id="@+id/layout_group_image"
android:layout_
android:layout_
android:background="@drawable/circle_dash_border_primary"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
tools:ignore="MissingConstraints">
<de.meinverein.app.view.CircleImageView
android:id="@+id/img_group"
android:layout_
android:layout_
android:layout_centerInParent="true"
/>
</RelativeLayout>
<ImageView
android:id="@+id/img_change_group_img"
android:layout_
android:layout_
app:layout_constraintEnd_toEndOf="@+id/layout_group_image"
app:layout_constraintStart_toStartOf="@+id/layout_group_image"
app:layout_constraintBottom_toBottomOf="@+id/layout_group_image"
app:layout_constraintTop_toTopOf="@+id/layout_group_image"
android:scaleType="centerCrop"
android:visibility="visible"
app:srcCompat="@drawable/ic_two_users_1" />
<RelativeLayout
android:id="@+id/layout_parent"
android:layout_
android:layout_
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@+id/layout_group_image">
<RelativeLayout
android:id="@+id/layout_title"
android:layout_
android:layout_
android:layout_marginTop="@dimen/overlay_img_done_margin_top">
<de.meinverein.app.view.BoldFontTextView
android:id="@+id/txt_title"
android:layout_
android:layout_
android:layout_alignParentLeft="true"
android:layout_centerVertical="true"
android:layout_toStartOf="@+id/linear_title_edit"
android:layout_toLeftOf="@+id/linear_title_edit"
android:ellipsize="end"
android:letterSpacing="0.018"
android:lineHeight="@dimen/line_height_17sp"
android:lines="1"
android:maxLines="1"
android:text="Vereinstreffen"
android:textColor="@color/normal_text_color"
android:textSize="@dimen/title_text_28pt" />
<LinearLayout
android:id="@+id/linear_title_edit"
android:layout_
android:layout_
android:layout_alignParentRight="true"
android:layout_centerVertical="true"
android:layout_marginLeft="@dimen/margin_15dp"
android:gravity="center"
android:padding="@dimen/padding_10dp">
<ImageView
android:id="@+id/img_title_edit"
android:layout_
android:layout_
app:srcCompat="@drawable/ic_overview_edit"
app:tint="@color/refs_btn" />
</LinearLayout>
</RelativeLayout>
<RelativeLayout
android:id="@+id/linear_participant"
android:layout_
android:layout_
android:layout_below="@+id/layout_title"
android:layout_marginTop="@dimen/margin_30dp">
<!-- <RelativeLayout
android:layout_
android:layout_
android:gravity="center_vertical"
android:orientation="horizontal">-->
<ImageView
android:id="@+id/img_participant"
android:layout_
android:layout_
android:layout_alignParentLeft="true"
android:layout_centerVertical="true"
app:srcCompat="@drawable/tab_user"
app:tint="@color/refs_btn" />
<de.meinverein.app.view.BoldFontTextView
android:id="@+id/partipant_with_count"
android:layout_
android:layout_
android:layout_centerVertical="true"
android:layout_marginLeft="12dp"
android:layout_toRightOf="@+id/img_participant"
android:text="@string/participants"
android:textColor="@color/black_full"
android:textSize="@dimen/sort_row_txt_size" />
<LinearLayout
android:id="@+id/layout_add_member"
android:layout_
android:layout_
android:layout_alignParentRight="true"
android:layout_centerVertical="true"
android:layout_marginLeft="@dimen/margin_15dp"
android:gravity="center"
android:padding="@dimen/padding_10dp">
<ImageView
android:id="@+id/img_participant_edit"
android:layout_
android:layout_
app:srcCompat="@drawable/ic_overview_add"
app:tint="@color/refs_btn" />
</LinearLayout>
</RelativeLayout>
</RelativeLayout>
<androidx.recyclerview.widget.RecyclerView
android:id="@+id/recyc_view_participants"
android:layout_
android:layout_
android:layout_marginTop="15dp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.0"
app:layout_constraintStart_toStartOf="parent"
app:layoutManager="androidx.recyclerview.widget.LinearLayoutManager"
app:layout_constraintTop_toBottomOf="@+id/layout_parent"
app:layout_constraintVertical_bias="0.0"
android:background="@color/back_screen_color_list"
/>
<View
android:id="@+id/view_bottom"
android:layout_
android:layout_
android:elevation="2dp"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintBottom_toBottomOf="parent"
android:background="@drawable/list_bottom_shadow" />
<View
android:id="@+id/view_top"
android:layout_
android:layout_
android:layout_marginTop="15dp"
app:layout_constraintStart_toStartOf="parent"
android:background="@drawable/list_top_shadow"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintTop_toTopOf="@+id/recyc_view_participants"
/>
</androidx.constraintlayout.motion.widget.MotionLayout>
<include
layout="@layout/line_progress_bar"
android:layout_
android:layout_
android:layout_alignParentBottom="true" />
</RelativeLayout>
Chat Detail anim class
<?xml version="1.0" encoding="utf-8"?>
<MotionScene xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:motion="http://schemas.android.com/apk/res-auto">
<Transition
motion:constraintSetEnd="@+id/end"
motion:constraintSetStart="@+id/start"
motion:duration="100"
motion:motionInterpolator="linear">
<OnSwipe
motion:dragDirection="dragUp"
motion:touchAnchorId="@+id/recyc_view_participants"
motion:touchAnchorSide="bottom" />
</Transition>
<ConstraintSet android:id="@+id/start">
<Constraint
android:id="@+id/layout_group_image"
android:layout_
android:layout_
motion:layout_constraintEnd_toEndOf="parent"
motion:layout_constraintStart_toStartOf="parent"
/>
<Constraint
android:id="@+id/img_change_group_img"
android:layout_
android:layout_
motion:visibilityMode="normal"
motion:layout_constraintEnd_toEndOf="@+id/layout_group_image"
motion:layout_constraintStart_toStartOf="@+id/layout_group_image"
motion:layout_constraintBottom_toBottomOf="@+id/layout_group_image"
motion:layout_constraintTop_toTopOf="@+id/layout_group_image"
motion:layout_constraintVertical_bias="0.42" />
<Constraint
android:id="@+id/layout_parent"
android:layout_
android:layout_
motion:layout_constraintEnd_toEndOf="parent"
motion:layout_constraintStart_toStartOf="parent"
motion:layout_constraintTop_toBottomOf="@+id/layout_group_image" />
<Constraint
android:id="@+id/view_top"
android:layout_
android:layout_
android:visibility="gone"
motion:layout_constraintStart_toStartOf="parent"
motion:layout_constraintEnd_toEndOf="parent"
motion:layout_constraintTop_toTopOf="@+id/recyc_view_participants"
/>
</ConstraintSet>
<ConstraintSet android:id="@+id/end">
<Constraint
android:id="@+id/layout_group_image"
android:layout_
android:layout_
motion:layout_constraintEnd_toEndOf="parent"
motion:layout_constraintStart_toStartOf="parent" />
<Constraint
android:id="@+id/img_change_group_img"
android:layout_
android:layout_
motion:visibilityMode="normal"
motion:layout_constraintEnd_toEndOf="@+id/layout_group_image"
motion:layout_constraintStart_toStartOf="@+id/layout_group_image"
motion:layout_constraintBottom_toBottomOf="@+id/layout_group_image"
motion:layout_constraintTop_toTopOf="@+id/layout_group_image"
motion:layout_constraintVertical_bias="0.42" />
<Constraint
android:id="@+id/layout_parent"
android:layout_
android:layout_
motion:layout_constraintEnd_toEndOf="parent"
motion:layout_constraintStart_toStartOf="parent"
motion:layout_constraintTop_toBottomOf="@+id/layout_group_image" />
<Constraint
android:id="@+id/view_top"
android:layout_
android:layout_
android:visibility="visible"
motion:layout_constraintStart_toStartOf="parent"
motion:layout_constraintEnd_toEndOf="parent"
motion:layout_constraintTop_toTopOf="@+id/recyc_view_participants"
/>
</ConstraintSet>
</MotionScene>
【讨论】:
以上是关于recyclerview 在滚动时坚持使用图像放大/缩小动画的位置的主要内容,如果未能解决你的问题,请参考以下文章
Glide 是不是对每个图像请求进行排队?滚动时Recyclerview加载非常慢