Merge pull request #2263 from vector-im/feature/fga/fix_composer_constraint

Fix composer: update constraints layout and fix some glitches

CHANGES.md

@@ -35,6 +35,7 @@ Bugfix 🐛:
  - Don't set presence when handling a push notification or polling (#2156)
  - Be robust against `StrandHogg` task injection
  - Clear alerts if user sign out
+ - Fix rows are hidden in Textinput (#2234)
 
 Translations 🗣:
  - Move store data to `/fastlane/metadata/android` (#812)

vector/build.gradle

@@ -313,8 +313,7 @@ dependencies {
     implementation 'androidx.appcompat:appcompat:1.2.0'
     implementation "androidx.fragment:fragment:$fragment_version"
     implementation "androidx.fragment:fragment-ktx:$fragment_version"
-    // Keep at 2.0.0-beta4 at the moment, as updating is breaking some UI
-    implementation 'androidx.constraintlayout:constraintlayout:2.0.0-beta4'
+    implementation 'androidx.constraintlayout:constraintlayout:2.0.2'
     implementation "androidx.sharetarget:sharetarget:1.0.0"
     implementation 'androidx.core:core-ktx:1.3.2'
 

vector/src/main/java/im/vector/app/features/home/room/detail/composer/TextComposerView.kt

@@ -28,9 +28,11 @@ import androidx.constraintlayout.widget.ConstraintLayout
 import androidx.constraintlayout.widget.ConstraintSet
 import androidx.core.text.toSpannable
 import androidx.core.view.isVisible
-import androidx.transition.AutoTransition
+import androidx.transition.ChangeBounds
+import androidx.transition.Fade
 import androidx.transition.Transition
 import androidx.transition.TransitionManager
+import androidx.transition.TransitionSet
 import butterknife.BindView
 import butterknife.ButterKnife
 import im.vector.app.R
@@ -113,29 +115,7 @@ class TextComposerView @JvmOverloads constructor(context: Context, attrs: Attrib
             return
         }
         currentConstraintSetId = R.layout.constraint_set_composer_layout_compact
-        if (animate) {
-            val transition = AutoTransition()
-            transition.duration = animationDuration
-            transition.addListener(object : Transition.TransitionListener {
-                override fun onTransitionEnd(transition: Transition) {
-                    transitionComplete?.invoke()
-                }
-
-                override fun onTransitionResume(transition: Transition) {}
-
-                override fun onTransitionPause(transition: Transition) {}
-
-                override fun onTransitionCancel(transition: Transition) {}
-
-                override fun onTransitionStart(transition: Transition) {}
-            }
-            )
-            TransitionManager.beginDelayedTransition((parent as? ViewGroup ?: this), transition)
-        }
-        ConstraintSet().also {
-            it.clone(context, currentConstraintSetId)
-            it.applyTo(this)
-        }
+        applyNewConstraintSet(animate, transitionComplete)
     }
 
     fun expand(animate: Boolean = true, transitionComplete: (() -> Unit)? = null) {
@@ -144,10 +124,28 @@ class TextComposerView @JvmOverloads constructor(context: Context, attrs: Attrib
             return
         }
         currentConstraintSetId = R.layout.constraint_set_composer_layout_expanded
+        applyNewConstraintSet(animate, transitionComplete)
+    }
+
+    private fun applyNewConstraintSet(animate: Boolean, transitionComplete: (() -> Unit)?) {
         if (animate) {
-            val transition = AutoTransition()
-            transition.duration = animationDuration
-            transition.addListener(object : Transition.TransitionListener {
+            configureAndBeginTransition(transitionComplete)
+        }
+        ConstraintSet().also {
+            it.clone(context, currentConstraintSetId)
+            // in case shield is hidden, we will have glitch without this
+            it.getConstraint(R.id.composer_shield).propertySet.visibility = composerShieldImageView.visibility
+            it.applyTo(this)
+        }
+    }
+
+    private fun configureAndBeginTransition(transitionComplete: (() -> Unit)? = null) {
+        val transition = TransitionSet().apply {
+            ordering = TransitionSet.ORDERING_SEQUENTIAL
+            addTransition(ChangeBounds())
+            addTransition(Fade(Fade.IN))
+            duration = animationDuration
+            addListener(object : Transition.TransitionListener {
                 override fun onTransitionEnd(transition: Transition) {
                     transitionComplete?.invoke()
                 }
@@ -159,14 +157,9 @@ class TextComposerView @JvmOverloads constructor(context: Context, attrs: Attrib
                 override fun onTransitionCancel(transition: Transition) {}
 
                 override fun onTransitionStart(transition: Transition) {}
-            }
-            )
-            TransitionManager.beginDelayedTransition((parent as? ViewGroup ?: this), transition)
-        }
-        ConstraintSet().also {
-            it.clone(context, currentConstraintSetId)
-            it.applyTo(this)
+            })
         }
+        TransitionManager.beginDelayedTransition((parent as? ViewGroup ?: this), transition)
     }
 
     fun setRoomEncrypted(isEncrypted: Boolean, roomEncryptionTrustLevel: RoomEncryptionTrustLevel?) {

vector/src/main/res/layout/constraint_set_composer_layout_expanded.xml

@@ -62,7 +62,7 @@
     <TextView
         android:id="@+id/composer_related_message_preview"
         android:layout_width="0dp"
-        android:layout_height="match_parent"
+        android:layout_height="wrap_content"
         android:ellipsize="end"
         android:maxLines="2"
         android:textColor="?vctr_message_text_color"
@@ -113,8 +113,6 @@
         app:layout_constraintBottom_toBottomOf="parent"
         app:layout_constraintEnd_toStartOf="@+id/composer_shield"
         app:layout_constraintStart_toStartOf="parent"
-        app:layout_constraintTop_toTopOf="parent"
-        app:layout_constraintVertical_bias="1"
         tools:src="@tools:sample/avatars" />
 
 
@@ -126,9 +124,7 @@
         app:layout_constraintEnd_toStartOf="@+id/composerEditText"
         app:layout_constraintBottom_toBottomOf="@id/composer_avatar_view"
         app:layout_constraintStart_toEndOf="@+id/composer_avatar_view"
-        tools:src="@drawable/ic_shield_black"
-        tools:visibility="visible"
-        />
+        tools:src="@drawable/ic_shield_black" />
 
 
 
@@ -162,7 +158,6 @@
         app:tint="?attr/colorAccent"
         app:layout_constraintBottom_toBottomOf="parent"
         app:layout_constraintEnd_toEndOf="parent"
-        app:layout_constraintStart_toEndOf="@id/composerEditText"
         app:layout_constraintTop_toBottomOf="@id/composer_preview_barrier"
         app:layout_constraintVertical_bias="1"
         tools:ignore="MissingPrefix" />
@@ -176,8 +171,8 @@
         android:nextFocusUp="@id/composerEditText"
         app:layout_constraintBottom_toBottomOf="parent"
         app:layout_constraintEnd_toStartOf="@+id/sendButton"
-        app:layout_constraintStart_toEndOf="@id/composer_avatar_view"
+        app:layout_constraintStart_toEndOf="@id/composer_shield"
         app:layout_constraintTop_toBottomOf="@id/composer_preview_barrier"
-        tools:text="@tools:sample/lorem" />
+        tools:text="@tools:sample/lorem/random" />
 
 </androidx.constraintlayout.widget.ConstraintLayout>