使用XML中的"animateLayoutChanges"属性来实现布局动画

Question

我有一个LinearLayout，我在父LinearLayout中应用了android:animateLayoutChanges="true"。当用户点击切换按钮时，LinearLayout会“折叠”（我通过编程将视图的可见性设置为LinearLayout.GONE），再次点击它时，通过编程将可见性设置回LinearLayout.VISIBLE来展开。

折叠和展开的动画效果是正确的。

然而，在折叠动画完成之前，任何位于可折叠/可展开LinearLayout下方的项目都会弹回到顶部。这些弹回的项目不在具有animateLayoutChanges设置为true的父级中，我认为没有办法将它们放入其中。

以下是我的布局层次结构（我没有提及属性以使其简短）：

<!-- Top most LinearLayout-->
<LinearLayout>

    <!-- LinearLayout containing android:animateLayoutChanges="true"-->
    <LinearLayout>

        <!-- RelativeLayout containing button to toggle LinearLayout visibility below-->
        <RelativeLayout>
        </RelativeLayout>

        <!-- LinearLayout that has its visibility toggled -->
        <LinearLayout>
        </LinearLayout>

    </LinearLayout>

</LinearLayout>

整个布局是通过编程方式插入到另一个 LinearLayout 中（如下所示）：

<LinearLayout
    android:id="@+id/form_container"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:orientation="vertical" >

    <!-- This is where the previous XML layout containing the toggle-able LinearLayout
         is inserted programmatically. -->

    <!-- This button snaps back up to the top before the animation is complete. -->
    <Button />

</LinearLayout>

我意识到，如果我在具有 animateLayoutChanges 属性的 LinearLayout 上添加弹出 Button，问题就会得到解决。但是，由于几个原因，这不是一个可行的选择。

那么还有其他的解决方法吗？

- u3l

Answer 1

不要使用animateLayoutChanges，尝试在您的onClick方法中添加TransitionManager.beginDelayedTransition(transitionsContainer);，其中transitionsContainer是应该被动画化的视图的父级。

例如，您的父布局是

<LinearLayout android:id="@+id/transitions_container">

    <!--add your widgets here-->

</LinearLayout>

在代码中

final ViewGroup transitionsContainer = (ViewGroup) view.findViewById(R.id.transitions_container);

button.setOnClickListener(new View.OnClickListener() {
    @Override
    public void onClick(View v) {
        TransitionManager.beginDelayedTransition(transitionsContainer);
        // do your staff with changing children of transitionsContainer           
    }
});

请查看https://medium.com/@andkulikov/animate-all-the-things-transitions-in-android-914af5477d50以获取详细信息。

- Olga Sokol

Answer 2

对于线性布局，请尝试手动启用“更改”过渡效果，参考以下内容适用于帧布局的方法，也可以尝试应用到您的线性布局中。 https://stackoverflow.com/a/51116293/2719243

- Vahab Ghadiri

Answer 3

只是一个想法... 如果您从嵌入式布局中删除'animateLayoutChanges'，并将其添加到父布局(第二个XML)中会怎样？我怀疑这会使一切都动画化。由于您正在以编程方式嵌入布局，您可能需要在代码中将该属性设置为true。

以下是以编程方式执行此操作的方法Stack-overflow

另一个选择是在按钮上以编程方式使用.animate属性

myButton.animate().translationY(floatYposition).setDuration(300); //300 milliseconds

- Fayez