从外部布局到实际位置对视图进行动画处理

Question

我有下一个xml结构：

<RelativeLayout
    ...>
    <RelativeLayout
        ...
        android:centerInParent=true/>
    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:weightSum="3"
        android:orientation="vertical">

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:weightSum="2"
            android:orientation="horizontal"
            android:layout_weight="1">
            <View
                android:id="@+id/top_left"
                android:layout_width="50dp"
                android:layout_height="50dp"
                android:layout_weight="1"/>
            <View
                android:id="@+id/top_right"
                android:layout_width="50dp"
                android:layout_height="50dp"
                android:layout_weight="1"/>
         </Linearlayout>

         <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:weightSum="2"
            android:orientation="horizontal"
            android:layout_weight="1">
            <View
                android:id="@+id/middle_left"
                android:layout_width="50dp"
                android:layout_height="50dp"
                android:layout_weight="1"/>
            <View
                android:id="@+id/middle_right"
                android:layout_width="50dp"
                android:layout_height="50dp"
                android:layout_weight="1"/>
         </Linearlayout>

         <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:weightSum="2"
            android:orientation="horizontal"
            android:layout_weight="1">
            <View
                android:id="@+id/bottom_left"
                android:layout_width="50dp"
                android:layout_height="50dp"
                android:layout_weight="1"/>
            <View
                android:id="@+id/bottom_right"
                android:layout_width="50dp"
                android:layout_height="50dp"
                android:layout_weight="1"/>
         </Linearlayout>

     </Linearlayout>

 </Relativelayout>

我需要像放置图片一样放置视图（如果视图有4个正方形，则需要放置在这些正方形的中间）

加载视图后，我需要将所有视图从父级RelativeLayout中心移动到正常视图位置。

我尝试使用RelativeLayout作为父视图并为所有视图设置动画，但是视图可以更改其大小，因此我不知道每个视图的最终位置。

无论如何，用上面写的结构可以实现吗？

谢谢！

Answer 1

移动任何视图的最简单方法：

view.animate().x(toX).y(toY).start()

Answer 2

我不确定这是您要的内容，但是如果我理解正确的话，您希望视图从屏幕中心移动到布局中的正确位置。 这样做的想法是让每个视图以android:layout_centerInParent="true"属性开始，以确保它们在屏幕中间开始。 像这样（我添加了颜色，以便于查看：

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
    xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent"
    android:layout_height="match_parent">

<View
    android:id="@+id/top_left"
    android:layout_centerInParent="true"
    android:layout_width="50dp"
    android:layout_height="50dp"
    android:background="@android:color/black"/>

<View
    android:id="@+id/top_right"
    android:layout_centerInParent="true"
    android:layout_width="50dp"
    android:layout_height="50dp"
    android:background="@android:color/holo_orange_dark"/>


<View
    android:id="@+id/middle_left"
    android:layout_centerInParent="true"
    android:layout_width="50dp"
    android:layout_height="50dp"
    android:background="@android:color/holo_blue_dark"/>

<View
    android:id="@+id/middle_right"
    android:layout_centerInParent="true"
    android:layout_width="50dp"
    android:layout_height="50dp"
    android:background="@android:color/holo_green_dark"/>

<Button
    android:id="@+id/button"
    android:gravity="bottom"
    android:layout_alignParentBottom="true"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:text="Start animation"/>

</RelativeLayout>

然后，在代码中，您必须更改视图相对于彼此的位置。 像这样：

View tl = findViewById(R.id.top_left);
View tr = findViewById(R.id.top_right);
View ml = findViewById(R.id.middle_left);
View mr = findViewById(R.id.middle_right);

TransitionManager.beginDelayedTransition((ViewGroup) tl.getParent());
RelativeLayout.LayoutParams layoutParams1 = (RelativeLayout.LayoutParams) tl.getLayoutParams();
// Remove this property.
layoutParams1.removeRule(RelativeLayout.CENTER_IN_PARENT);
// Position View in correct location.
layoutParams1.addRule(RelativeLayout.ALIGN_PARENT_TOP);
layoutParams1.addRule(RelativeLayout.ALIGN_PARENT_LEFT);
tl.setLayoutParams(layoutParams1);

TransitionManager.beginDelayedTransition((ViewGroup) tr.getParent());
RelativeLayout.LayoutParams layoutParams2 = (RelativeLayout.LayoutParams) tr.getLayoutParams();
layoutParams2.removeRule(RelativeLayout.CENTER_IN_PARENT);
layoutParams2.addRule(RelativeLayout.RIGHT_OF, R.id.top_left);
tr.setLayoutParams(layoutParams2);

TransitionManager.beginDelayedTransition((ViewGroup) ml.getParent());
RelativeLayout.LayoutParams layoutParams3 = (RelativeLayout.LayoutParams) ml.getLayoutParams();
layoutParams3.removeRule(RelativeLayout.CENTER_IN_PARENT);
layoutParams3.addRule(RelativeLayout.BELOW, R.id.top_left);
ml.setLayoutParams(layoutParams3);

TransitionManager.beginDelayedTransition((ViewGroup) mr.getParent());
RelativeLayout.LayoutParams layoutParams4 = (RelativeLayout.LayoutParams) mr.getLayoutParams();
layoutParams4.removeRule(RelativeLayout.CENTER_IN_PARENT);
layoutParams4.addRule(RelativeLayout.BELOW, R.id.top_right);
layoutParams4.addRule(RelativeLayout.RIGHT_OF, R.id.middle_left);
mr.setLayoutParams(layoutParams4);

Answer 3

我解决了这个问题，并添加了所有视图的父母：

android:clipChildren="false"
android:clipToPadding="false"