使用 Motion Layout 折叠基于回收视图或滚动视图移动的自定义视图

Collapsing Custom view based on recycler view or scroll view movement using Motion Layout

我正在尝试使用 Motion 布局实现动画。

议程:

在滚动回收器视图或滚动视图上,自定义视图应该折叠并仅显示所需的结束布局。

开始布局

结束布局

结束布局

activity_main_start.xml

<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout 
 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:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".MainActivity">

<RelativeLayout
    android:id="@+id/topLayout"
    android:layout_width="0dp"
    android:layout_height="wrap_content"
    app:layout_constraintEnd_toEndOf="parent"
    app:layout_constraintStart_toStartOf="parent"
    app:layout_constraintTop_toTopOf="parent">

    <TextView
        android:id="@+id/assetValue"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerHorizontal="true"
        android:fontFamily="sans-serif"
        android:text="250 Rupees"
        android:textColor="@color/colorPrimaryDark"
        android:textSize="25sp"
        android:textStyle="bold" />

    <TextView
        android:id="@+id/dummyText"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_below="@id/assetValue"
        android:layout_centerHorizontal="true"
        android:layout_marginTop="10dp"
        android:fontFamily="sans-serif"
        android:text="Total Returns"
        android:textColor="@color/colorPrimary"
        android:textSize="20sp"
        android:textStyle="bold" />

    <TextView
        android:id="@+id/invested"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_below="@id/dummyText"
        android:gravity="left"
        android:padding="10dp"
        android:text="200 Rupees"
        android:textColor="@color/colorPrimaryDark"
        android:textSize="25sp"
        android:textStyle="bold" />

    <TextView
        android:id="@+id/currentValue"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_below="@id/dummyText"
        android:layout_alignParentEnd="true"
        android:padding="10dp"
        android:text="300 Rupees"
        android:textColor="@color/colorPrimaryDark"
        android:textSize="25sp"
        android:textStyle="bold" />

</RelativeLayout>

<ScrollView
    android:id="@+id/scrollView"
    android:layout_width="0dp"
    app:layout_behavior="@string/appbar_scrolling_view_behavior"
    android:layout_height="wrap_content"
    app:layout_constraintLeft_toLeftOf="parent"
    app:layout_constraintRight_toRightOf="parent"
    app:layout_constraintTop_toBottomOf="@id/topLayout">

    <TextView
        android:id="@+id/sampleText"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:gravity="center"
        android:text="Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor  consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in rep in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum."
        android:textSize="40sp" />

</ScrollView>

</androidx.constraintlayout.widget.ConstraintLayout>

activity_main_end.xml

<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout 
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:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".MainActivity">

<RelativeLayout
    android:id="@+id/topLayout"
    android:layout_width="0dp"
    android:layout_height="wrap_content"
    app:layout_constraintEnd_toEndOf="parent"
    app:layout_constraintStart_toStartOf="parent"
    app:layout_constraintBottom_toTopOf="@id/scrollView"
    app:layout_constraintTop_toTopOf="parent">

    <TextView
        android:id="@+id/assetValue"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerHorizontal="true"
        android:fontFamily="sans-serif"
        android:text="250 Rupees"
        android:textColor="@color/colorPrimaryDark"
        android:textSize="25sp"
        android:textStyle="bold" />
</RelativeLayout>

<ScrollView
    android:id="@+id/scrollView"
    android:layout_width="0dp"
    app:layout_behavior="@string/appbar_scrolling_view_behavior"
    android:layout_height="wrap_content"
    app:layout_constraintLeft_toLeftOf="parent"
    app:layout_constraintRight_toRightOf="parent"
    app:layout_constraintTop_toBottomOf="@id/topLayout">

    <TextView
        android:id="@+id/sampleText"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:gravity="center"
        android:text="Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor  consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in rep in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum."
        android:textSize="40sp" />

</ScrollView>

</androidx.constraintlayout.widget.ConstraintLayout>

activity_main_scene.xml

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

<Transition
    app:constraintSetEnd="@layout/activity_main_end"
    app:constraintSetStart="@layout/activity_main_start">
    <OnSwipe
        app:touchAnchorSide="top"
        app:dragDirection="dragUp" />
</Transition>

 </MotionScene>

activity_main.xml

 <?xml version="1.0" encoding="utf-8"?>
 <androidx.constraintlayout.motion.widget.MotionLayout 
 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:layout_width="match_parent"
android:layout_height="match_parent"
app:layoutDescription="@xml/activity_main_scene"
tools:context=".MainActivity">

<RelativeLayout
    android:id="@+id/topLayout"
    android:layout_width="0dp"
    android:layout_height="wrap_content"
    app:layout_constraintEnd_toEndOf="parent"
    app:layout_constraintStart_toStartOf="parent"
    app:layout_constraintTop_toTopOf="parent">

    <TextView
        android:id="@+id/assetValue"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerHorizontal="true"
        android:fontFamily="sans-serif"
        android:text="250 Rupees"
        android:textColor="@color/colorPrimaryDark"
        android:textSize="25sp"
        android:textStyle="bold" />

    <TextView
        android:id="@+id/dummyText"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_below="@id/assetValue"
        android:layout_centerHorizontal="true"
        android:layout_marginTop="10dp"
        android:fontFamily="sans-serif"
        android:text="Total Returns"
        android:textColor="@color/colorPrimary"
        android:textSize="20sp"
        android:textStyle="bold" />

    <TextView
        android:id="@+id/invested"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_below="@id/dummyText"
        android:gravity="left"
        android:padding="10dp"
        android:text="200 Rupees"
        android:textColor="@color/colorPrimaryDark"
        android:textSize="25sp"
        android:textStyle="bold" />

    <TextView
        android:id="@+id/currentValue"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_below="@id/dummyText"
        android:layout_alignParentEnd="true"
        android:padding="10dp"
        android:text="300 Rupees"
        android:textColor="@color/colorPrimaryDark"
        android:textSize="25sp"
        android:textStyle="bold" />

</RelativeLayout>


<ScrollView
    android:id="@+id/scrollView"
    android:layout_width="0dp"
    app:layout_behavior="@string/appbar_scrolling_view_behavior"
    android:layout_height="wrap_content"
    app:layout_constraintLeft_toLeftOf="parent"
    app:layout_constraintRight_toRightOf="parent"
    app:layout_constraintTop_toBottomOf="@id/topLayout">

    <TextView
        android:id="@+id/sampleText"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:gravity="center"
        android:text="Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor  consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in rep in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum."
        android:textSize="40sp" />

</ScrollView>

</androidx.constraintlayout.motion.widget.MotionLayout>

虽然滚动结束布局没有在运动中执行layout.Can有人帮忙吗?

经过大量研究,我找到了我正在搜索的确切内容for.Please查看下面的文章。

https://riggaroo.dev/android-motionlayout-tutorial-collapsing-view/