Android: вкладка «Анимация макета ограничений» - PullRequest
Новая
       35

Android: вкладка «Анимация макета ограничений»

0 голосов
/ 25 мая 2018

Я создал пользовательскую вкладку с ConstraintLayout, я решил использовать ConstraintSet и TransitionManager для анимации выбора вкладки.

Это анимация, которая мне нужна.enter image description here

Но когда я реализовал анимацию, у меня возникли проблемы.

Вот мой код:

Определение макета XML 

<android.support.constraint.ConstraintLayout
        android:id="@+id/card_constraint_canvas"
        android:layout_width="match_parent"
        android:layout_height="match_parent">

    <!-- View on which I want to apply constraint for animation -->

    <View
        android:id="@+id/tab_selection"
        android:layout_width="0dp"
        android:layout_height="4dp"
        android:background="@color/colorSoftBlue"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintEnd_toStartOf="@+id/divider"
        app:layout_constraintBottom_toBottomOf="parent"/>


    <!-- Centered grey divider bar, view which is my anchor point -->

    <View
        android:id="@+id/divider"
        android:layout_width="1dp"
        android:layout_height="match_parent"
        android:background="@color/colorDividerGrey"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent" />

</android.support.constraint.ConstraintLayout>

Java-код 

@BindView(R.id.tab_selection) View tabSelection;
@BindView(R.id.card_constraint_canvas) ConstraintLayout cardConstraintCanvas;

... 

applyConstraintSet.clone(cardConstraintCanvas); // Working

TransitionManager.beginDelayedTransition(cardConstraintCanvas); // Working
applyConstraintSet.clear(R.id.tab_selection); // Working
applyConstraintSet.connect(R.id.tab_selection, ConstraintSet.LEFT, R.id.divider, ConstraintSet.RIGHT); // Working
applyConstraintSet.connect(R.id.tab_selection, ConstraintSet.RIGHT, R.id.card_constraint_canvas, ConstraintSet.RIGHT); // Working
applyConstraintSet.connect(R.id.tab_selection, ConstraintSet.BOTTOM, R.id.card_constraint_canvas, ConstraintSet.BOTTOM); // Working

// Not working, the animation behaves strange, the tab_selection view disappears, I put 0 as width because I defined in the xml like that (0dp) but not working
// applyConstraintSet.constrainWidth(R.id.tab_selection, 0); 

// Working, but I want my tab_selection view width spread at divider's start edge and parent's end edge after the animation, not a constant dimension
applyConstraintSet.constrainWidth(R.id.tab_selection, 10); 
applyConstraintSet.constrainHeight(R.id.tab_selection, 10); // Working

applyConstraintSet.applyTo(cardConstraintCanvas); // Working

Я предполагаю, что проблема в constraintWidth.Я также пытаюсь использовать этот метод для удаления только якоря и поддержания ширины и высоты. 

void clear (int viewId, int anchor)

Но я думаю, что это не сработает, как я думал.

Есть мысли?

Спасибо за помощь:)

1 Ответ

0 голосов
/ 25 мая 2018

Если вы удалите строку 

applyConstraintSet.clear(R.id.tab_selection);

и измените ConstraintSet.LEFT и ConstraintSet.RIGHT на ConstraintSet.START и ConstraintSet.END соответственно, чтобы соответствовать именам атрибутов, используемых в XML, тогда эта анимациябудет работать как положено.

Я не уверен, почему метод clear вызывает нежелательное поведение.

...