From def6758aaab2ac643a29a67a8bb35a134e1d530d Mon Sep 17 00:00:00 2001
From: Benoit Marty <benoit@matrix.org>
Date: Tue, 20 Oct 2020 15:47:41 +0200
Subject: [PATCH] UI tweak

---
 .../features/form/FormEditableAvatarItem.kt   |  4 +-
 ....xml => header_panel_round_background.xml} |  9 ++---
 .../main/res/layout/item_editable_avatar.xml  | 39 +++++++++++--------
 3 files changed, 29 insertions(+), 23 deletions(-)
 rename vector/src/main/res/drawable/{bg_accent.xml => header_panel_round_background.xml} (51%)

diff --git a/vector/src/main/java/im/vector/app/features/form/FormEditableAvatarItem.kt b/vector/src/main/java/im/vector/app/features/form/FormEditableAvatarItem.kt
index d1871bd354..9849f22f87 100644
--- a/vector/src/main/java/im/vector/app/features/form/FormEditableAvatarItem.kt
+++ b/vector/src/main/java/im/vector/app/features/form/FormEditableAvatarItem.kt
@@ -50,17 +50,17 @@ abstract class FormEditableAvatarItem : EpoxyModelWithHolder<FormEditableAvatarI
 
     override fun bind(holder: Holder) {
         super.bind(holder)
-        holder.image.onClick(clickListener?.takeIf { enabled })
+        holder.imageContainer.onClick(clickListener?.takeIf { enabled })
         GlideApp.with(holder.image)
                 .load(imageUri)
                 .apply(RequestOptions.circleCropTransform())
-                .placeholder(R.drawable.bg_accent)
                 .into(holder.image)
         holder.delete.isVisible = imageUri != null
         holder.delete.onClick(deleteListener?.takeIf { enabled })
     }
 
     class Holder : VectorEpoxyHolder() {
+        val imageContainer by bind<View>(R.id.itemEditableAvatarImageContainer)
         val image by bind<ImageView>(R.id.itemEditableAvatarImage)
         val delete by bind<View>(R.id.itemEditableAvatarDelete)
     }
diff --git a/vector/src/main/res/drawable/bg_accent.xml b/vector/src/main/res/drawable/header_panel_round_background.xml
similarity index 51%
rename from vector/src/main/res/drawable/bg_accent.xml
rename to vector/src/main/res/drawable/header_panel_round_background.xml
index 1b64246d14..b12b88cbd0 100644
--- a/vector/src/main/res/drawable/bg_accent.xml
+++ b/vector/src/main/res/drawable/header_panel_round_background.xml
@@ -1,6 +1,5 @@
 <?xml version="1.0" encoding="utf-8"?>
-<shape xmlns:android="http://schemas.android.com/apk/res/android">
-
-    <solid android:color="?colorAccent" />
-
-</shape>
\ No newline at end of file
+<shape xmlns:android="http://schemas.android.com/apk/res/android"
+    android:shape="oval">
+    <solid android:color="?riotx_header_panel_background" />
+</shape>
diff --git a/vector/src/main/res/layout/item_editable_avatar.xml b/vector/src/main/res/layout/item_editable_avatar.xml
index 65da90b267..3b560dd65f 100644
--- a/vector/src/main/res/layout/item_editable_avatar.xml
+++ b/vector/src/main/res/layout/item_editable_avatar.xml
@@ -8,15 +8,32 @@
     android:background="?riotx_background"
     android:padding="16dp">
 
-    <ImageView
-        android:id="@+id/itemEditableAvatarImage"
+    <!-- I cannot do what I want using layer-list, do it manually here-->
+    <FrameLayout
+        android:id="@+id/itemEditableAvatarImageContainer"
         android:layout_width="128dp"
         android:layout_height="128dp"
+        android:background="@drawable/header_panel_round_background"
         app:layout_constraintBottom_toBottomOf="parent"
         app:layout_constraintEnd_toEndOf="parent"
         app:layout_constraintStart_toStartOf="parent"
-        app:layout_constraintTop_toTopOf="parent"
-        tools:src="@tools:sample/avatars" />
+        app:layout_constraintTop_toTopOf="parent">
+
+        <ImageView
+            android:layout_width="48dp"
+            android:layout_height="48dp"
+            android:layout_gravity="center"
+            android:src="@drawable/ic_add_image" />
+
+        <ImageView
+            android:id="@+id/itemEditableAvatarImage"
+            android:layout_width="128dp"
+            android:layout_height="128dp"
+            android:scaleType="center"
+            tools:alpha="0.3"
+            tools:src="@tools:sample/avatars" />
+
+    </FrameLayout>
 
     <ImageView
         android:id="@+id/itemEditableAvatarDelete"
@@ -26,20 +43,10 @@
         android:scaleType="center"
         android:src="@drawable/ic_delete"
         android:visibility="gone"
-        app:layout_constraintEnd_toEndOf="@+id/itemEditableAvatarImage"
-        app:layout_constraintTop_toTopOf="@+id/itemEditableAvatarImage"
+        app:layout_constraintEnd_toEndOf="@+id/itemEditableAvatarImageContainer"
+        app:layout_constraintTop_toTopOf="@+id/itemEditableAvatarImageContainer"
         app:tint="@color/riotx_destructive_accent"
         tools:ignore="MissingPrefix"
         tools:visibility="visible" />
 
-    <ImageView
-        android:id="@+id/itemEditableAvatarPicto"
-        android:layout_width="32dp"
-        android:layout_height="32dp"
-        android:background="@drawable/circle"
-        android:scaleType="center"
-        android:src="@drawable/ic_add_image"
-        app:layout_constraintBottom_toBottomOf="@+id/itemEditableAvatarImage"
-        app:layout_constraintEnd_toEndOf="@+id/itemEditableAvatarImage" />
-
 </androidx.constraintlayout.widget.ConstraintLayout>