Блог

Главная - Вопросы по программированию - recyclerview придерживайтесь позиции с анимацией увеличения/уменьшения изображения во время прокрутки

recyclerview придерживайтесь позиции с анимацией увеличения/уменьшения изображения во время прокрутки

#android #android-recyclerview #android-animation #android-scrollview #android-coordinatorlayout

Вопрос:

Когда мы прокручиваем представление, recyclerview остается в определенном положении, и изображение должно уменьшаться с анимацией. Попробовал также использовать макет координатора и панель инструментов, но не добился успеха. Любая помощь или предложение были бы весьма заметны.

Как вы можете видеть в GIF, как это происходит.

введите описание изображения здесь

Комментарии:

1. добавьте код реализации..

Ответ №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_width="match_parent"
        android:layout_height="match_parent"
        android:background="@color/back_screen_color_list"
        >
    
        <LinearLayout
            android:id="@ id/layout_drawer_down"
            android:layout_width="wrap_content"
            android:layout_height="@dimen/filter_search_layout_height"
            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_width="@dimen/list_header_arrow_w_h"
                android:layout_height="@dimen/list_header_arrow_w_h"
                app:srcCompat="@drawable/ic_arrow_down_new"
                app:tint="@color/image_grey" />
        </LinearLayout>
    
    
        <androidx.constraintlayout.motion.widget.MotionLayout
            android:id="@ id/motionLayout"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            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_width="@dimen/big_img_width_height"
                android:layout_height="@dimen/big_img_width_height"
                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_width="140dp"
                    android:layout_height="140dp"
                    android:layout_centerInParent="true"
    
                    />
    
    
            </RelativeLayout>
    
            <ImageView
                android:id="@ id/img_change_group_img"
                android:layout_width="40dp"
                android:layout_height="40dp"
                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_width="match_parent"
                android:layout_height="wrap_content"
                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_width="match_parent"
                    android:layout_height="wrap_content"
                    android:layout_marginTop="@dimen/overlay_img_done_margin_top">
    
                    <de.meinverein.app.view.BoldFontTextView
                        android:id="@ id/txt_title"
                        android:layout_width="match_parent"
                        android:layout_height="wrap_content"
                        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_width="wrap_content"
                        android:layout_height="wrap_content"
                        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_width="wrap_content"
                            android:layout_height="wrap_content"
                            app:srcCompat="@drawable/ic_overview_edit"
                            app:tint="@color/refs_btn" />
                    </LinearLayout>
                </RelativeLayout>
    
                <RelativeLayout
                    android:id="@ id/linear_participant"
                    android:layout_width="match_parent"
                    android:layout_height="@dimen/sort_item_row_height"
                    android:layout_below="@ id/layout_title"
                    android:layout_marginTop="@dimen/margin_30dp">
    
                    <!-- <RelativeLayout
                         android:layout_width="match_parent"
                         android:layout_height="wrap_content"
                         android:gravity="center_vertical"
                         android:orientation="horizontal">-->
    
                    <ImageView
                        android:id="@ id/img_participant"
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content"
                        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_width="wrap_content"
                        android:layout_height="wrap_content"
                        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_width="wrap_content"
                        android:layout_height="wrap_content"
                        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_width="wrap_content"
                            android:layout_height="wrap_content"
                            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_width="match_parent"
                android:layout_height="300dp"
                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_width="match_parent"
                android:layout_height="100dp"
                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_width="match_parent"
                android:layout_height="100dp"
                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_width="match_parent"
            android:layout_height="@dimen/line_progress_bar_height"
            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_width="@dimen/big_img_width_height"
            android:layout_height="@dimen/big_img_width_height"
            motion:layout_constraintEnd_toEndOf="parent"
            motion:layout_constraintStart_toStartOf="parent"
             />
        <Constraint
            android:id="@ id/img_change_group_img"
            android:layout_width="40dp"
            android:layout_height="40dp"
            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_width="match_parent"
            android:layout_height="wrap_content"
            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_width="match_parent"
            android:layout_height="0dp"
            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_width="55dp"
            android:layout_height="55dp"
            motion:layout_constraintEnd_toEndOf="parent"
            motion:layout_constraintStart_toStartOf="parent" />

        <Constraint
            android:id="@ id/img_change_group_img"
            android:layout_width="20dp"
            android:layout_height="20dp"
            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_width="match_parent"
            android:layout_height="wrap_content"
            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_width="match_parent"
            android:layout_height="100dp"
            android:visibility="visible"
            motion:layout_constraintStart_toStartOf="parent"
            motion:layout_constraintEnd_toEndOf="parent"
            motion:layout_constraintTop_toTopOf="@ id/recyc_view_participants"
            />

    </ConstraintSet>
</MotionScene>
Метки: