Improve read receipt design

This commit is contained in:
Valere 2019-08-27 15:36:44 +02:00
parent a51d96bf00
commit 166be4e289
13 changed files with 73 additions and 45 deletions

View File

@ -69,7 +69,7 @@ class DisplayReadReceiptsBottomSheet : VectorBaseBottomSheetDialogFragment() {
val dividerItemDecoration = DividerItemDecoration(epoxyRecyclerView.context,
LinearLayout.VERTICAL)
epoxyRecyclerView.addItemDecoration(dividerItemDecoration)
bottomSheetTitle.text = getString(R.string.read_receipts_list)
bottomSheetTitle.text = getString(R.string.read_at)
epoxyController.setData(displayReadReceiptArgs.readReceipts)
}

View File

@ -0,0 +1,6 @@
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle">
<corners android:radius="10dp" />
<solid android:color="@color/riotx_header_panel_border_mobile_black" />
</shape>

View File

@ -0,0 +1,6 @@
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle">
<corners android:radius="10dp" />
<solid android:color="@color/riotx_header_panel_border_mobile_dark" />
</shape>

View File

@ -0,0 +1,6 @@
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle">
<corners android:radius="10dp" />
<solid android:color="@color/riotx_header_panel_border_mobile_light" />
</shape>

View File

@ -5,38 +5,26 @@
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center_vertical"
android:minHeight="40dp"
android:orientation="horizontal"
android:paddingStart="8dp"
android:paddingEnd="8dp">
<ImageView
android:id="@+id/readReceiptAvatar"
android:layout_width="24dp"
android:layout_height="24dp"
android:layout_width="32dp"
android:layout_height="32dp"
android:layout_marginEnd="8dp"
tools:src="@tools:sample/avatars" />
<TextView
android:id="@+id/readReceiptName"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginStart="4dp"
android:layout_weight="1"
android:ellipsize="end"
android:lines="1"
android:paddingTop="8dp"
android:paddingBottom="8dp"
android:textColor="?riotx_text_primary"
android:textSize="16sp"
style="@style/BottomSheetItemTextMain"
tools:text="@sample/matrix.json/data/displayName" />
<TextView
android:id="@+id/readReceiptDate"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:lines="1"
android:textColor="?riotx_text_secondary"
android:textSize="12sp"
style="@style/BottomSheetItemTime"
tools:text="10:44" />
</LinearLayout>

View File

@ -6,6 +6,7 @@
android:gravity="center_vertical"
android:orientation="horizontal"
android:paddingStart="8dp"
android:minHeight="40dp"
android:paddingEnd="8dp">
<TextView
@ -22,25 +23,12 @@
<TextView
android:id="@+id/itemSimpleReactionInfoMemberName"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginStart="4dp"
android:paddingTop="8dp"
android:paddingBottom="8dp"
android:layout_weight="1"
android:ellipsize="end"
android:lines="1"
android:textColor="?android:textColorPrimary"
android:textSize="16sp"
style="@style/BottomSheetItemTextMain"
tools:text="@sample/matrix.json/data/displayName" />
<TextView
android:id="@+id/itemSimpleReactionInfoTime"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:lines="1"
android:textColor="?android:textColorSecondary"
android:textSize="12sp"
style="@style/BottomSheetItemTime"
tools:text="10:44" />

View File

@ -9,48 +9,55 @@
<TextView
android:id="@+id/receiptMore"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_marginEnd="8dp"
android:layout_height="18dp"
android:gravity="center"
android:textSize="12sp"
android:background="?vctr_pill_receipt"
android:paddingStart="4dp"
android:paddingEnd="4dp"
tools:text="999+" />
<ImageView
android:id="@+id/receiptAvatar5"
android:layout_width="16dp"
android:layout_height="16dp"
android:layout_width="18dp"
android:layout_height="18dp"
android:layout_marginStart="2dp"
android:adjustViewBounds="true"
android:scaleType="centerCrop"
tools:src="@tools:sample/avatars" />
<ImageView
android:id="@+id/receiptAvatar4"
android:layout_width="16dp"
android:layout_height="16dp"
android:layout_width="18dp"
android:layout_height="18dp"
android:layout_marginStart="2dp"
android:adjustViewBounds="true"
android:scaleType="centerCrop"
tools:src="@tools:sample/avatars" />
<ImageView
android:id="@+id/receiptAvatar3"
android:layout_width="16dp"
android:layout_height="16dp"
android:layout_width="18dp"
android:layout_height="18dp"
android:layout_marginStart="2dp"
android:adjustViewBounds="true"
android:scaleType="centerCrop"
tools:src="@tools:sample/avatars" />
<ImageView
android:id="@+id/receiptAvatar2"
android:layout_width="16dp"
android:layout_height="16dp"
android:layout_width="18dp"
android:layout_height="18dp"
android:layout_marginStart="2dp"
android:adjustViewBounds="true"
android:scaleType="centerCrop"
tools:src="@tools:sample/avatars" />
<ImageView
android:id="@+id/receiptAvatar1"
android:layout_width="16dp"
android:layout_height="16dp"
android:layout_width="18dp"
android:layout_height="18dp"
android:layout_marginStart="2dp"
android:adjustViewBounds="true"
android:scaleType="centerCrop"
tools:src="@tools:sample/avatars" />

View File

@ -88,6 +88,7 @@
<attr name="vctr_pill_background_room_alias" format="reference" />
<attr name="vctr_pill_text_color_user_id" format="reference" />
<attr name="vctr_pill_text_color_room_alias" format="reference" />
<attr name="vctr_pill_receipt" format="reference" />
<!-- Widget banner background -->
<attr name="vctr_widget_banner_background" format="color" />

View File

@ -2,5 +2,6 @@
<resources>
<!-- Strings not defined in Riot -->
<string name="read_at">Read at</string>
</resources>

View File

@ -319,4 +319,23 @@
<item name="android:background">@drawable/vector_label_background_light</item>
</style>
<style name="BottomSheetItemTextMain">
<item name="android:fontFamily">sans-serif-medium</item>
<item name="android:layout_width">0dp</item>
<item name="android:layout_height">wrap_content</item>
<item name="android:layout_weight">1</item>
<item name="android:ellipsize">end</item>
<item name="android:lines">1</item>
<item name="android:textColor">?riotx_text_primary</item>
<item name="android:textSize">16sp</item>
</style>
<style name="BottomSheetItemTime">
<item name="android:layout_width">wrap_content</item>
<item name="android:layout_height">wrap_content</item>
<item name="android:lines">1</item>
<item name="android:textColor">?riotx_text_secondary</item>
<item name="android:textSize">12sp</item>
</style>
</resources>

View File

@ -75,6 +75,8 @@
<item name="vctr_markdown_block_background_color">#FF4D4D4D</item>
<item name="vctr_pill_receipt">@drawable/pill_receipt_black</item>
<!-- activities background -->
<item name="android:windowBackground">@color/riot_primary_background_color_black</item>
<item name="vctr_bottom_nav_background_color">@color/primary_color_black</item>

View File

@ -163,6 +163,8 @@
<item name="vctr_pill_text_color_user_id">@android:color/white</item>
<item name="vctr_pill_text_color_room_alias">@color/riot_primary_text_color_dark</item>
<item name="vctr_pill_receipt">@drawable/pill_receipt_dark</item>
<item name="vctr_direct_chat_circle">@drawable/direct_chat_circle_dark</item>
<item name="vctr_widget_banner_background">#FF454545</item>

View File

@ -163,6 +163,8 @@
<item name="vctr_pill_text_color_user_id">@color/riot_primary_text_color_light</item>
<item name="vctr_pill_text_color_room_alias">@android:color/white</item>
<item name="vctr_pill_receipt">@drawable/pill_receipt_light</item>
<item name="vctr_direct_chat_circle">@drawable/direct_chat_circle_light</item>
<item name="vctr_widget_banner_background">#FFD3EFE1</item>