在BottomSheetFragment

时间:2018-11-26 07:35:05

标签: android android-constraintlayout android-transitions constraintset

单击后,我想对BottomSheetFragment上的布局更改进行动画处理。我实现了ConstraintSet.applyTo和TransitionManager.beginDelayedTransition,将初始场景更改为最终场景。但是当发生过渡时,似乎动画正在重复。样本输出在底部。

BottomSheetFragment.java

ConstraintSet constraintSet;
boolean isSelected = false;

@BindView(R.id.container_root) ConstraintLayout layoutRoot;
@BindView(R.id.ic_leave_date)  ImageView ivLeaveDate;
@BindView(R.id.ic_date_filed)  ImageView ivDateFiled;

@Override
public void onViewCreated(@NonNull View view, @Nullable Bundle savedInstanceState) {
    super.onViewCreated(view, savedInstanceState);
    LayoutTransition transition = new LayoutTransition();
    transition.setAnimateParentHierarchy(false);
    layoutRoot.setLayoutTransition(transition);
}

@OnClick(R.id.layout1)
public void openLeaveDate(){
    TransitionDrawable bgTransition = (TransitionDrawable) layoutLeaveDate.getBackground();
    TransitionDrawable ivTransition = (TransitionDrawable) ivLeaveDate.getBackground();

    if(isSelected){
        isSelected = false;
        bgTransition.reverseTransition(300);
        ivTransition.resetTransition();
        constraintSet = new ConstraintSet();
        constraintSet.clone(getActivity(), R.layout.bottom_sheet_filter_leave);

        TransitionManager.beginDelayedTransition(layoutRoot);
        constraintSet.applyTo(layoutRoot);
    }else{
        isSelected = true;
        bgTransition.startTransition(300);
        ivTransition.startTransition(300);
        constraintSet = new ConstraintSet();

        constraintSet.clone(getActivity(), R.layout.layout_bottom_date_filed);
        TransitionManager.beginDelayedTransition(layoutRoot);
        constraintSet.applyTo(layoutRoot);
    }
}

bottom_sheet_filter_leave.xml

<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.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:id="@+id/container_root"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    app:layout_behavior="android.support.design.widget.BottomSheetBehavior">


    <android.support.constraint.ConstraintLayout
       android:id="@+id/layout_leave_date"
       android:layout_width="match_parent"
       android:layout_height="54dp"
       android:background="@transition/bg_transition"
       android:clickable="true"
       android:focusable="true"
       android:paddingStart="24dp">

       <ImageView
           android:id="@+id/ic_leave_date"
           android:layout_width="24dp"
           android:layout_height="match_parent"
           android:src="@transition/ic_leave_date_transition"/>

       <TextView
           android:id="@+id/label_leave_date"
           style="@style/TextAppearance.Content.Bold.Black"
           android:layout_width="wrap_content"
           android:layout_height="wrap_content"
           android:layout_marginStart="24dp"
           android:text="@string/leave_date"
           app:layout_constraintBottom_toTopOf="@+id/guide_leave_date"
           app:layout_constraintStart_toEndOf="@+id/ic_leave_date"/>

       <TextView
           android:layout_width="wrap_content"
           android:layout_height="wrap_content"
           android:layout_marginStart="24dp"
           android:text="All"
           app:layout_constraintStart_toEndOf="@+id/ic_leave_date"
           app:layout_constraintTop_toBottomOf="@+id/guide_leave_date"/>

       <android.support.constraint.Guideline
           android:id="@+id/guide_leave_date"
           android:layout_width="match_parent"
           android:layout_height="1dp"
           android:orientation="horizontal"
           app:layout_constraintGuide_percent="0.5"/>
    </android.support.constraint.ConstraintLayout>


    <android.support.constraint.ConstraintLayout
       android:id="@+id/layout1"
       android:layout_width="match_parent"
       android:layout_height="54dp"
       android:background="@transition/bg_transition"
       android:paddingEnd="24dp"
       android:paddingStart="24dp"
       android:visibility="visible"
       app:layout_constraintTop_toBottomOf="@+id/layout_leave_date">

       <ImageView
           android:id="@+id/ic_date_filed"
           android:layout_width="24dp"
           android:layout_height="24dp"
           android:background="@transition/ic_date_filed_transition"
           app:layout_constraintTop_toTopOf="parent"
           app:layout_constraintBottom_toBottomOf="parent"/>

       <TextView
           android:id="@+id/label_date_filed"
           style="@style/TextAppearance.Content.Bold.Black"
           android:layout_width="wrap_content"
           android:layout_height="wrap_content"
           android:layout_marginStart="24dp"
           android:text="@string/date_filled"
           app:layout_constraintBottom_toTopOf="@+id/guide_date_filed"
           app:layout_constraintStart_toEndOf="@+id/ic_date_filed"/>

       <TextView
           android:layout_width="wrap_content"
           android:layout_height="wrap_content"
           android:layout_marginStart="24dp"
           android:text="All"
           app:layout_constraintStart_toEndOf="@+id/ic_date_filed"
           app:layout_constraintTop_toBottomOf="@+id/guide_date_filed"/>

       <android.support.constraint.Guideline
           android:id="@+id/guide_date_filed"
           android:layout_width="match_parent"
           android:layout_height="1dp"
           android:orientation="horizontal"
           app:layout_constraintGuide_percent="0.5"/>
    </android.support.constraint.ConstraintLayout>



    <android.support.constraint.ConstraintLayout
       android:id="@+id/layout_all_date_filed"
       android:layout_width="match_parent"
       android:layout_height="54dp"
       android:clickable="true"
       android:focusable="true"
       android:paddingEnd="0dp"
       android:paddingStart="12dp"
       android:visibility="gone"
       app:layout_constraintTop_toBottomOf="@+id/layout1">

       <RadioButton
           android:id="@+id/rb_all_date_filed"
           android:layout_width="wrap_content"
           android:layout_height="wrap_content"
           app:layout_constraintBottom_toBottomOf="parent"
           app:layout_constraintTop_toTopOf="parent"/>

       <TextView
           android:layout_width="wrap_content"
           android:layout_height="wrap_content"
           android:layout_marginStart="12dp"
           android:text="@string/all"
           app:layout_constraintBottom_toBottomOf="parent"
           app:layout_constraintStart_toEndOf="@id/rb_all_date_filed"
           app:layout_constraintTop_toTopOf="parent"/>

    </android.support.constraint.ConstraintLayout>

    <android.support.constraint.ConstraintLayout
       android:id="@+id/layout_input_date_filed"
       android:layout_width="match_parent"
       android:layout_height="54dp"
       android:clickable="true"
       android:focusable="true"
       android:paddingEnd="0dp"
       android:paddingStart="12dp"
       android:visibility="gone"
       app:layout_constraintTop_toBottomOf="@+id/layout_all_date_filed">

       <RadioButton
           android:id="@+id/rb_input_date_filed"
           android:layout_width="wrap_content"
           android:layout_height="0dp"
           app:layout_constraintBottom_toBottomOf="parent"
           app:layout_constraintTop_toTopOf="parent"/>

       <EditText
           android:id="@+id/txt_date_filed_start"
             style="@style/ThemeOverlay.MaterialComponents.TextInputEditText.OutlinedBox.Dense"
           android:layout_width="wrap_content"
           android:layout_height="0dp"
           android:layout_marginStart="12dp"
           android:drawableEnd="@drawable/ic_calendar_orange"
           android:hint="@string/mm_dd_yy"
           android:singleLine="true"
           android:textSize="13sp"
           app:layout_constraintBottom_toBottomOf="parent"
           app:layout_constraintStart_toEndOf="@+id/rb_input_date_filed"
           app:layout_constraintTop_toTopOf="parent" />

       <View
           android:id="@+id/view_divider_date_filed"
           android:layout_width="10dp"
           android:layout_height="1dp"
           android:layout_marginStart="15dp"
           android:background="@color/gray"
           app:layout_constraintBottom_toBottomOf="parent"
           app:layout_constraintStart_toEndOf="@+id/txt_date_filed_start"
           app:layout_constraintTop_toTopOf="parent"/>

       <EditText
           android:id="@+id/txt_date_filed_end"
        style="@style/ThemeOverlay.MaterialComponents.TextInputEditText.OutlinedBox.Dense"
           android:layout_width="wrap_content"
           android:layout_height="0dp"
           android:layout_marginStart="15dp"
           android:hint="@string/mm_dd_yy"
           android:singleLine="true"
           android:drawableEnd="@drawable/ic_calendar_orange"
           android:textSize="13sp"
           app:layout_constraintBottom_toBottomOf="parent"
           app:layout_constraintStart_toEndOf="@+id/view_divider_date_filed"
           app:layout_constraintTop_toTopOf="parent" />

      </android.support.constraint.ConstraintLayout>

layout_bottom_date_filed.xml

<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.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="wrap_content"
    app:layout_behavior="android.support.design.widget.BottomSheetBehavior">


    <android.support.constraint.ConstraintLayout
       android:id="@+id/layout_leave_date"
       android:layout_width="match_parent"
       android:layout_height="54dp"
       android:background="@transition/bg_transition"
       android:clickable="true"
       android:focusable="true"
       android:visibility="gone"
       android:paddingStart="24dp">

       <ImageView
           android:id="@+id/ic_leave_date"
           android:layout_width="24dp"
           android:layout_height="match_parent"
           android:src="@transition/ic_leave_date_transition"/>

       <TextView
           android:id="@+id/label_leave_date"
           style="@style/TextAppearance.Content.Bold.Black"
           android:layout_width="wrap_content"
           android:layout_height="wrap_content"
           android:layout_marginStart="24dp"
           android:text="@string/leave_date"
           app:layout_constraintBottom_toTopOf="@+id/guide_leave_date"
           app:layout_constraintStart_toEndOf="@+id/ic_leave_date"/>

       <TextView
           android:layout_width="wrap_content"
           android:layout_height="wrap_content"
           android:layout_marginStart="24dp"
           android:text="All"
           app:layout_constraintStart_toEndOf="@+id/ic_leave_date"
           app:layout_constraintTop_toBottomOf="@+id/guide_leave_date"/>

       <android.support.constraint.Guideline
           android:id="@+id/guide_leave_date"
           android:layout_width="match_parent"
           android:layout_height="1dp"
           android:orientation="horizontal"
           app:layout_constraintGuide_percent="0.5"/>
    </android.support.constraint.ConstraintLayout>


    <android.support.constraint.ConstraintLayout
       android:id="@+id/layout1"
       android:layout_width="match_parent"
       android:layout_height="54dp"
       android:background="@transition/bg_transition"
       android:paddingEnd="24dp"
       android:paddingStart="24dp"
       android:visibility="visible"
       app:layout_constraintTop_toBottomOf="@+id/layout_leave_date">

       <ImageView
           android:id="@+id/ic_date_filed"
           android:layout_width="24dp"
           android:layout_height="24dp"
           android:background="@transition/ic_date_filed_transition"
           app:layout_constraintTop_toTopOf="parent"
           app:layout_constraintBottom_toBottomOf="parent"/>

       <TextView
           android:id="@+id/label_date_filed"
           style="@style/TextAppearance.Content.Bold.Black"
           android:layout_width="wrap_content"
           android:layout_height="wrap_content"
           android:layout_marginStart="24dp"
           android:text="@string/date_filled"
           app:layout_constraintBottom_toTopOf="@+id/guide_date_filed"
           app:layout_constraintStart_toEndOf="@+id/ic_date_filed"/>

       <TextView
           android:layout_width="wrap_content"
           android:layout_height="wrap_content"
           android:layout_marginStart="24dp"
           android:text="All"
           app:layout_constraintStart_toEndOf="@+id/ic_date_filed"
           app:layout_constraintTop_toBottomOf="@+id/guide_date_filed"/>

       <android.support.constraint.Guideline
           android:id="@+id/guide_date_filed"
           android:layout_width="match_parent"
           android:layout_height="1dp"
           android:orientation="horizontal"
           app:layout_constraintGuide_percent="0.5"/>
    </android.support.constraint.ConstraintLayout>



    <android.support.constraint.ConstraintLayout
       android:id="@+id/layout_all_date_filed"
       android:layout_width="match_parent"
       android:layout_height="54dp"
       android:clickable="true"
       android:focusable="true"
       android:paddingEnd="0dp"
       android:paddingStart="12dp"
       app:layout_constraintTop_toBottomOf="@+id/layout1">

       <RadioButton
           android:id="@+id/rb_all_date_filed"
           android:layout_width="wrap_content"
           android:layout_height="wrap_content"
           app:layout_constraintBottom_toBottomOf="parent"
           app:layout_constraintTop_toTopOf="parent"/>

       <TextView
           android:layout_width="wrap_content"
           android:layout_height="wrap_content"
           android:layout_marginStart="12dp"
           android:text="@string/all"
           app:layout_constraintBottom_toBottomOf="parent"
           app:layout_constraintStart_toEndOf="@id/rb_all_date_filed"
           app:layout_constraintTop_toTopOf="parent"/>

    </android.support.constraint.ConstraintLayout>

    <android.support.constraint.ConstraintLayout
       android:id="@+id/layout_input_date_filed"
       android:layout_width="match_parent"
       android:layout_height="54dp"
       android:clickable="true"
       android:focusable="true"
       android:paddingEnd="0dp"
       android:paddingStart="12dp"
       app:layout_constraintTop_toBottomOf="@+id/layout_all_date_filed">

       <RadioButton
           android:id="@+id/rb_input_date_filed"
           android:layout_width="wrap_content"
           android:layout_height="0dp"
           app:layout_constraintBottom_toBottomOf="parent"
           app:layout_constraintTop_toTopOf="parent"/>

       <EditText
           android:id="@+id/txt_date_filed_start"
             style="@style/ThemeOverlay.MaterialComponents.TextInputEditText.OutlinedBox.Dense"
           android:layout_width="wrap_content"
           android:layout_height="0dp"
           android:layout_marginStart="12dp"
           android:drawableEnd="@drawable/ic_calendar_orange"
           android:hint="@string/mm_dd_yy"
           android:singleLine="true"
           android:textSize="13sp"
           app:layout_constraintBottom_toBottomOf="parent"
           app:layout_constraintStart_toEndOf="@+id/rb_input_date_filed"
           app:layout_constraintTop_toTopOf="parent" />

       <View
           android:id="@+id/view_divider_date_filed"
           android:layout_width="10dp"
           android:layout_height="1dp"
           android:layout_marginStart="15dp"
           android:background="@color/gray"
           app:layout_constraintBottom_toBottomOf="parent"
           app:layout_constraintStart_toEndOf="@+id/txt_date_filed_start"
           app:layout_constraintTop_toTopOf="parent"/>

       <EditText
           android:id="@+id/txt_date_filed_end"
        style="@style/ThemeOverlay.MaterialComponents.TextInputEditText.OutlinedBox.Dense"
           android:layout_width="wrap_content"
           android:layout_height="0dp"
           android:layout_marginStart="15dp"
           android:hint="@string/mm_dd_yy"
           android:singleLine="true"
           android:drawableEnd="@drawable/ic_calendar_orange"
           android:textSize="13sp"
           app:layout_constraintBottom_toBottomOf="parent"
           app:layout_constraintStart_toEndOf="@+id/view_divider_date_filed"
           app:layout_constraintTop_toTopOf="parent" />

      </android.support.constraint.ConstraintLayout>

是这样的:

enter image description here

更新

我尝试将此设置应用于其他片段(不是BottomSheetFragment),动画似乎正常工作。也许与BottomSheetFragment有关?

1 个答案:

答案 0 :(得分:0)

我通过删除OnViewCreated()上的这些行来解决它:

LayoutTransition transition = new LayoutTransition();
transition.setAnimateParentHierarchy(false);
layoutRoot.setLayoutTransition(transition);

enter image description here