Started contacts list header

app/src/main/java/org/linphone/ui/contacts/adapter/ConversationsListAdapter.kt

@@ -35,12 +35,29 @@ class ContactsListAdapter(
         selectedAdapterPosition = -1
     }
 
+    fun showHeaderForPosition(position: Int): Boolean {
+        if (position >= itemCount) return false
+
+        val contact = getItem(position)
+        val firstLetter = contact.name.value?.get(0).toString()
+        val previousPosition = position - 1
+
+        return if (previousPosition >= 0) {
+            val previousItemFirstLetter = getItem(previousPosition).name.value?.get(0).toString()
+            !firstLetter.equals(previousItemFirstLetter, ignoreCase = true)
+        } else {
+            true
+        }
+    }
+
     inner class ViewHolder(
         val binding: ContactListCellBinding
     ) : RecyclerView.ViewHolder(binding.root) {
         fun bind(contactModel: ContactModel) {
             with(binding) {
                 model = contactModel
+                firstLetter = contactModel.name.value?.get(0).toString()
+                showFirstLetter = showHeaderForPosition(bindingAdapterPosition)
 
                 lifecycleOwner = viewLifecycleOwner
 

app/src/main/res/layout/contact_list_cell.xml

@@ -9,6 +9,12 @@
         <variable
             name="model"
             type="org.linphone.ui.contacts.model.ContactModel" />
+        <variable
+            name="first_letter"
+            type="String" />
+        <variable
+            name="show_first_letter"
+            type="Boolean" />
     </data>
 
     <androidx.constraintlayout.widget.ConstraintLayout
@@ -18,11 +24,25 @@
         android:layout_marginBottom="5dp"
         android:background="@drawable/cell_background">
 
+        <androidx.appcompat.widget.AppCompatTextView
+            android:id="@+id/header"
+            android:layout_width="wrap_content"
+            android:layout_height="wrap_content"
+            android:text="@{first_letter, default=`A`}"
+            android:visibility="@{show_first_letter ? View.VISIBLE : View.INVISIBLE, default=invisible}"
+            android:textColor="@color/gray_10"
+            android:textSize="20sp"
+            android:textStyle="bold"
+            android:layout_marginStart="16dp"
+            app:layout_constraintStart_toStartOf="parent"
+            app:layout_constraintTop_toTopOf="parent"
+            app:layout_constraintBottom_toBottomOf="parent"/>
+
         <io.getstream.avatarview.AvatarView
             android:id="@+id/avatar"
             android:layout_width="36dp"
             android:layout_height="36dp"
-            android:layout_marginStart="10dp"
+            android:layout_marginStart="12dp"
             android:layout_marginTop="5dp"
             android:layout_marginBottom="5dp"
             android:adjustViewBounds="true"
@@ -39,7 +59,7 @@
             app:avatarViewIndicatorBorderSizeCriteria="8"
             app:avatarViewIndicatorPosition="bottomRight"
             app:layout_constraintBottom_toBottomOf="parent"
-            app:layout_constraintStart_toStartOf="parent"
+            app:layout_constraintStart_toEndOf="@id/header"
             app:layout_constraintTop_toTopOf="parent" />
 
         <androidx.appcompat.widget.AppCompatTextView

app/src/main/res/values/colors.xml

@@ -19,5 +19,6 @@
     <color name="gray_7">#F9F9F9</color>
     <color name="gray_8">#364860</color>
     <color name="gray_9">#4E6074</color>
+    <color name="gray_10">#9AABB5</color>
     <color name="separator">#E5E5EA</color>
 </resources>