Android 参照视图时视图的平移动画';s宽度是约束集动画中的包裹内容

Android 参照视图时视图的平移动画';s宽度是约束集动画中的包裹内容,android,android-constraintlayout,constraintset,Android,Android Constraintlayout,Constraintset,这是xml布局的设计begin.xml: 有一个Delete按钮隐藏在顶层视图后面 通过单击“X”,我希望通过使用ConstraintSet动画,顶层视图向左移动,其左侧部分位于屏幕之外,并显示删除按钮,以获得如下内容: 问题在于Delete按钮的宽度设置为wrap\u content,但即使它具有固定的宽度,如何设置xml布局end.xml,以在最后一张图片上获得所需的设计 设置视图的位置,使其一部分位于屏幕之外,这让我感到困惑 旁注:我使用顶层视图有两个原因: 它隐藏了删除按钮 由于所

这是xml布局的设计
begin.xml


有一个
Delete
按钮隐藏在
顶层
视图后面

通过单击“X”,我希望通过使用ConstraintSet动画,
顶层
视图向左移动,其左侧部分位于屏幕之外,并显示
删除
按钮,以获得如下内容:

问题在于
Delete
按钮的宽度设置为
wrap\u content
,但即使它具有固定的宽度,如何设置xml布局
end.xml
,以在最后一张图片上获得所需的设计

设置视图的位置,使其一部分位于屏幕之外,这让我感到困惑

旁注:我使用
顶层视图有两个原因:

  • 它隐藏了删除按钮

  • 由于所有视图(X、TextView和可能存在的其他视图)都应该一起向左移动,因此我将它们的约束设置为相对于
    顶层的尺寸

  • 更新:刚刚意识到您正在通过ConstraintSet使用动画。最简单的方法是设置“删除”按钮的克隆(至少一些具有相同宽度的视图),并将其“结束”约束设置为父布局的开始。这将为您提供一个屏幕外小部件,其起始端是屏幕外的,即您希望移动其他小部件的距离。然后可以将新约束设置到该左侧并应用过渡

    以下是一个示例应用程序:

    MainActivity.java

    public class MainActivity extends AppCompatActivity {
    
        @Override
        protected void onCreate(Bundle savedInstanceState) {
            super.onCreate(savedInstanceState);
            setContentView(R.layout.activity_main);
        }
    
        public void onClick(View view) {
            ConstraintLayout layout = findViewById(R.id.layout);
            ConstraintSet cs = new ConstraintSet();
            cs.clone(layout);
            ChangeBounds transition = new ChangeBounds();
            transition.setDuration(1000);
    
            TransitionManager.beginDelayedTransition(layout, transition);
            cs.connect(R.id.some_text, ConstraintSet.START, R.id.offScreenView, ConstraintSet.START);
            cs.connect(R.id.bet_slip_remove_item, ConstraintSet.END, R.id.delete, ConstraintSet.START);
            cs.applyTo(layout);
        }
    }
    
    activity\u main.xml
    这有点简化,但它显示了一些概念

    <androidx.constraintlayout.widget.ConstraintLayout 
        android:id="@+id/layout"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        tools:context=".MainActivity">
    
        <Button
            android:id="@+id/offScreenView"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_margin="0dp"
            android:text="@string/delete"
            app:layout_constraintEnd_toStartOf="parent"
            app:layout_constraintTop_toTopOf="parent" />
    
        <Button
            android:id="@+id/delete"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_margin="0dp"
            android:text="@string/delete"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintTop_toTopOf="parent" />
    
        <TextView
            android:id="@+id/some_text"
            android:layout_width="0dp"
            android:layout_height="0dp"
            android:background="@android:color/holo_blue_light"
            android:gravity="center_vertical"
            android:paddingStart="16dp"
            android:elevation="7dp"
            android:text="@string/timeout_error"
            app:layout_constraintBottom_toBottomOf="@+id/delete"
            app:layout_constraintEnd_toEndOf="@id/bet_slip_remove_item"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintTop_toTopOf="parent" />
    
        <ImageButton
            android:id="@+id/bet_slip_remove_item"
            android:layout_width="30dp"
            android:layout_height="30dp"
            android:onClick="onClick"
            android:elevation="7dp"
            app:layout_constraintBottom_toBottomOf="@+id/delete"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintTop_toTopOf="parent"
            app:srcCompat="@drawable/close" />
    
    </androidx.constraintlayout.widget.ConstraintLayout>
    
    然后,在“x”的单击处理程序中,执行以下操作:

    slide1Animator.start();
    slide2Animator.start();
    slide3Animator.start();
    
    这会将视图移到屏幕左侧,并显示下方的删除按钮

    slide1Animator.start();
    slide2Animator.start();
    slide3Animator.start();