首页 > 解决方案 > 带有 Guideline 的 TransitionManager 和 ConstraintLayout 不起作用

问题描述

我正在尝试使用TransitionManager ConstraintLayoutGuideline

这应该是直截了当的。从约束移动到底部父级,再到 50% 准则。查看结果的视频。它将高度降低到 1dp。

在此处输入图像描述

我的第一个布局:

<?xml version="1.0" encoding="utf-8"?><!--
  ~ (c) Facebook, Inc. and its affiliates. Confidential and proprietary.
  -->

<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/root"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:ignore="BadClassUsageInResource-FrameLayout">

    <!-- foreground image -->
    <ImageView
        android:id="@+id/foreground_image"
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:background="#ff0000"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent" />

</android.support.constraint.ConstraintLayout>

我的第二个布局:

<?xml version="1.0" encoding="utf-8"?><!--
  ~ (c) Facebook, Inc. and its affiliates. Confidential and proprietary.
  -->

<android.support.constraint.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:id="@+id/root"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <!-- foreground image -->
    <ImageView
        android:id="@+id/foreground_image"
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_margin="50dp"
        android:background="#ff0000"
        app:layout_constraintBottom_toTopOf="@+id/middle_guideline"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent" />

    <TextView
        android:id="@+id/text"
        android:layout_width="200dp"
        android:layout_height="200dp"
        android:background="#9944FF"
        android:text="skdfjhskdjfhksjd"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="@+id/middle_guideline" />

    <android.support.constraint.Guideline
        android:id="@+id/middle_guideline"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:orientation="vertical"
        app:layout_constraintGuide_percent="0.5" />

</android.support.constraint.ConstraintLayout>

点击时的过渡:

ConstraintSet constraintSet = new ConstraintSet();
constraintSet.clone(this, R.layout.second);
TransitionManager.beginDelayedTransition(mroot);
constraintSet.applyTo((ConstraintLayout) mroot);

标签: androidandroid-constraintlayoutandroid-transitions

解决方案


确保该指南存在于具有相同 id 的两个布局文件中。指南应该是水平的而不是垂直的。

您还应该从要转换到的布局中克隆ConstraintSet 。(目前尚不清楚情况是否如此。)

val constraintSet = ConstraintSet()
// Clone from the layout that we are transitioning to.
constraintSet.clone(this, R.layout.activity_main_2)
TransitionManager.beginDelayedTransition(mroot)
constraintSet.applyTo(mroot as ConstraintLayout?)

做这些事情,它应该工作。


我应该补充一点,您使用TextView的第二个布局仅用于其约束。转换后TextView不会出现在您的布局中。如果您确实希望TextView出现,则需要将其添加到第一个布局中。


推荐阅读