MotionLayout没有动画 [英] MotionLayout no animation
问题描述
我正在尝试通过MotionLayout创建折叠的视图动画。我想使视图在向下滚动时折叠,并且直到完全向上滚动才显示。我的动画现在无法播放(视频)。此外,直到第一次单击,我的回收者视图才可见。我究竟做错了什么?谢谢
I am trying to create a collapsing view animation via MotionLayout. I want to make the view collapse when scrolling down and does not appear until the full scrolling up. My animation doesn't work now (video). Also my recycler view is not visible until the first click. What am I doing wrong? Thank
MainActivity布局:
MainActivity layout:
<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"
android:background="@color/gray_more_white"
app:layoutDescription="@xml/collapsing_toolbar"
tools:showPaths="true">
<include
android:id="@+id/include"
layout="@layout/toolbar"
android:layout_width="0dp"
android:layout_height="wrap_content"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<com.github.florent37.shapeofview.shapes.ArcView
android:id="@+id/header_view"
android:layout_width="0dp"
android:layout_height="100dp"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toBottomOf="@id/include"
app:shape_arc_cropDirection="outside"
app:shape_arc_height="20dp"
app:shape_arc_position="bottom">
<View
android:id="@+id/header"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="@color/colorPrimaryDark" />
</com.github.florent37.shapeofview.shapes.ArcView>
<androidx.swiperefreshlayout.widget.SwipeRefreshLayout
android:id="@+id/swipe_view"
android:layout_width="0dp"
android:layout_height="0dp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@id/include">
<androidx.recyclerview.widget.RecyclerView
android:id="@+id/recyclerView"
android:layout_width="match_parent"
android:layout_height="match_parent" />
</androidx.swiperefreshlayout.widget.SwipeRefreshLayout>
</androidx.constraintlayout.motion.widget.MotionLayout>
MotionScene:
MotionScene:
<MotionScene
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:motion="http://schemas.android.com/apk/res-auto">
<Transition
app:constraintSetEnd="@id/end"
app:constraintSetStart="@id/start"
app:duration="1000">
<OnSwipe
app:touchAnchorId="@id/swipe_view"
app:dragDirection="dragDown"
app:touchAnchorSide="top"
app:moveWhenScrollAtTop="true"/>
</Transition>
<ConstraintSet android:id="@+id/start">
<Constraint
android:id="@id/header_view"
android:layout_width="0dp"
android:layout_height="100dp"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toBottomOf="@id/include">
</Constraint>
</ConstraintSet>
<ConstraintSet android:id="@+id/end">
<Constraint
android:id="@id/header_view"
android:layout_width="0dp"
android:layout_height="0dp"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toBottomOf="@id/include">
</Constraint>
</ConstraintSet>
</MotionScene>
推荐答案
因此,经过多次尝试,我设法解决了这个问题错误。
So, after many attempts, I managed to fix this bug.
1)动画的触发器(在我的例子中是RecyclerView)必须与动画的目标有关。不一定直接(在我的情况下,RecyclerView和标头通过 Space
连接)
1) The trigger of the animation (in my case, RecyclerView) must necessarily be related to what the animation is directed to. And not necessarily directly (in my case RecyclerView and header are connected through Space
)
2)动画或链接它们的元素不应与动画指向的内容重叠。 (在我的情况下,空格
应该使用constraintBottom_toBottomOf = @ id / header + marginBottom而不是constraintTop_toBottomOf = @ id / header。
2) The trigger of the animation or the element linking them should not overlap what the animation is directed to. (Those, in my case, Space
should use constraintBottom_toBottomOf = "@ id / header" + marginBottom instead of constraintTop_toBottomOf = "@ id / header".
所以,这是最终的布局。
So, here is the final layout.
<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"
android:background="@color/gray_more_white"
app:layoutDescription="@xml/catalog_motion">
<com.github.florent37.shapeofview.shapes.ArcView
android:id="@+id/header"
android:layout_width="0dp"
android:layout_height="100dp"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toBottomOf="@+id/include"
app:shape_arc_cropDirection="outside"
app:shape_arc_height="20dp"
app:shape_arc_position="bottom">
<View
android:id="@+id/header_view"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="@color/colorPrimaryDark" />
</com.github.florent37.shapeofview.shapes.ArcView>
<Space
android:id="@+id/space"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="100dp"
app:layout_constraintBottom_toBottomOf="@id/header"
app:layout_constraintStart_toStartOf="@id/header"
app:layout_constraintEnd_toEndOf="@id/header"/>
<androidx.recyclerview.widget.RecyclerView
android:id="@+id/recyclerView"
android:layout_width="0dp"
android:layout_height="0dp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@+id/space" />
<include
android:id="@+id/include"
layout="@layout/toolbar"
android:layout_width="0dp"
android:layout_height="wrap_content"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"/>
这篇关于MotionLayout没有动画的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!