Makes dual avatars larger and fixes alignment

wordpress-mobile · Feb 7, 2024 · 7d29468 · 7d29468
1 parent 7a63be5
commit 7d29468
Show file tree

Hide file tree

Showing 5 changed files with 26 additions and 17 deletions.
diff --git a/WordPress/src/main/res/layout/notifications_list_double_avatar.xml b/WordPress/src/main/res/layout/notifications_list_double_avatar.xml
@@ -2,23 +2,23 @@
 <FrameLayout 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="@dimen/activity_log_icon_size"
-    android:layout_height="@dimen/activity_log_icon_size"
-    android:layout_marginStart="@dimen/notifications_avatar_margin_start"
+    android:layout_width="@dimen/notifications_multiple_icon_width"
+    android:layout_height="@dimen/notifications_multiple_icon_height"
+    android:layout_marginStart="@dimen/notifications_multiple_avatar_margin_start"
     app:layout_constraintStart_toStartOf="parent"
     app:layout_constraintTop_toTopOf="parent"
     tools:ignore="MergeRootFrame">
 
     <ImageView
         android:id="@+id/two_avatars_1"
-        style="@style/Notifications.Avatar.OvalSurfaceBackground"
+        style="@style/NotificationsAvatarDouble"
         android:layout_gravity="center_vertical|start"
         android:contentDescription="@null"
         tools:src="@drawable/bg_oval_placeholder_user_32dp" />
 
     <ImageView
         android:id="@+id/two_avatars_2"
-        style="@style/Notifications.Avatar.OvalSurfaceBackground"
+        style="@style/NotificationsAvatarDouble"
         android:layout_gravity="center_vertical|end"
         android:contentDescription="@null"
         tools:src="@drawable/bg_oval_placeholder_user_32dp" />

diff --git a/WordPress/src/main/res/layout/notifications_list_item.xml b/WordPress/src/main/res/layout/notifications_list_item.xml
@@ -43,8 +43,8 @@
 
         <ImageView
             android:id="@+id/note_avatar"
-            android:layout_width="@dimen/activity_log_icon_size"
-            android:layout_height="@dimen/activity_log_icon_size"
+            android:layout_width="@dimen/notifications_icon_size"
+            android:layout_height="@dimen/notifications_icon_size"
             android:layout_marginStart="@dimen/notifications_avatar_margin_start"
             android:contentDescription="@null"
             app:layout_constraintStart_toStartOf="parent"

diff --git a/WordPress/src/main/res/layout/notifications_list_triple_avatar.xml b/WordPress/src/main/res/layout/notifications_list_triple_avatar.xml
@@ -2,30 +2,30 @@
 <FrameLayout 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="@dimen/activity_log_icon_size"
-    android:layout_height="@dimen/activity_log_icon_size"
-    android:layout_marginStart="@dimen/notifications_avatar_margin_start"
+    android:layout_width="@dimen/notifications_multiple_icon_width"
+    android:layout_height="@dimen/notifications_multiple_icon_height"
+    android:layout_marginStart="@dimen/notifications_multiple_avatar_margin_start"
     app:layout_constraintStart_toStartOf="parent"
     app:layout_constraintTop_toTopOf="parent"
     tools:ignore="MergeRootFrame">
 
     <ImageView
         android:id="@+id/three_avatars_1"
-        style="@style/ReaderImageView.Avatar.ExtraSmall.OvalSurfaceBackground"
+        style="@style/NotificationsAvatarTriple"
         android:layout_gravity="bottom|start"
         android:contentDescription="@null"
         tools:src="@drawable/bg_oval_placeholder_user_32dp" />
 
     <ImageView
         android:id="@+id/three_avatars_2"
-        style="@style/ReaderImageView.Avatar.ExtraSmall.OvalSurfaceBackground"
+        style="@style/NotificationsAvatarTriple"
         android:layout_gravity="top|center_horizontal"
         android:contentDescription="@null"
         tools:src="@drawable/bg_oval_placeholder_user_32dp" />
 
     <ImageView
         android:id="@+id/three_avatars_3"
-        style="@style/ReaderImageView.Avatar.ExtraSmall.OvalSurfaceBackground"
+        style="@style/NotificationsAvatarTriple"
         android:layout_gravity="bottom|end"
         android:contentDescription="@null"
         tools:src="@drawable/bg_oval_placeholder_user_32dp" />

diff --git a/WordPress/src/main/res/values/dimens.xml b/WordPress/src/main/res/values/dimens.xml
@@ -271,7 +271,8 @@
     <dimen name="notifications_adjusted_font_margin">10dp</dimen>
     <dimen name="notifications_content_margin">0dp</dimen>
     <dimen name="notifications_avatar_sz">48dp</dimen>
-    <dimen name="notifications_avatar_margin_start">18dp</dimen>
+    <dimen name="notifications_avatar_margin_start">20dp</dimen>
+    <dimen name="notifications_multiple_avatar_margin_start">17dp</dimen>
     <dimen name="notifications_text_indent_sz">22dp</dimen>
     <dimen name="notification_comment_padded_frame_bg_offset">14dp</dimen>  <!-- results in 6dp border -->
     <dimen name="notification_comment_frame_bg_border_width">6dp</dimen>
@@ -283,6 +284,9 @@
     <dimen name="notifications_header_margin_top_position_0">16dp</dimen>
     <dimen name="notifications_header_margin_top_position_n">4dp</dimen>
     <dimen name="notifications_popup_radius">4dp</dimen>
+    <dimen name="notifications_icon_size">40dp</dimen>
+    <dimen name="notifications_multiple_icon_height">44dp</dimen>
+    <dimen name="notifications_multiple_icon_width">48dp</dimen>
 
     <dimen name="progress_bar_height">3dp</dimen>
     <dimen name="activity_progress_bar_height">5dp</dimen>

diff --git a/WordPress/src/main/res/values/styles.xml b/WordPress/src/main/res/values/styles.xml
@@ -638,14 +638,19 @@
         <item name="android:textColor">?attr/wpColorTextSecondary</item>
     </style>
 
-    <style name="Notifications.Avatar.OvalSurfaceBackground" parent="ReaderImageView">
-        <item name="android:layout_width">@dimen/avatar_sz_extra_medium_with_padding</item>
-        <item name="android:layout_height">@dimen/avatar_sz_extra_medium_with_padding</item>
+    <style name="NotificationsAvatarDouble">
+        <item name="android:layout_width">@dimen/avatar_sz_small</item>
+        <item name="android:layout_height">@dimen/avatar_sz_small</item>
         <item name="android:padding">@dimen/avatar_background_padding</item>
         <item name="android:background">@drawable/bg_oval_surface</item>
         <item name="android:foreground">@drawable/post_detail_avatar_internal_border</item>
     </style>
 
+    <style name="NotificationsAvatarTriple" parent="NotificationsAvatarDouble">
+        <item name="android:layout_width">@dimen/avatar_sz_extra_medium_with_padding</item>
+        <item name="android:layout_height">@dimen/avatar_sz_extra_medium_with_padding</item>
+    </style>
+
     <style name="MyProfileRow">
         <item name="android:background">?android:attr/selectableItemBackground</item>
         <item name="android:layout_width">match_parent</item>