Optimize: start removing some constraint layout from timeline

This commit is contained in:
ganfra 2019-10-02 19:30:01 +02:00
parent 650a151b18
commit ff7856c535
5 changed files with 164 additions and 173 deletions

View File

@ -17,8 +17,11 @@ package im.vector.riotx.features.home.room.detail.timeline.item
import android.view.View import android.view.View
import android.view.ViewStub import android.view.ViewStub
import android.widget.RelativeLayout
import androidx.annotation.IdRes import androidx.annotation.IdRes
import androidx.constraintlayout.widget.Guideline import androidx.constraintlayout.widget.Guideline
import androidx.core.view.marginStart
import androidx.core.view.updateLayoutParams
import com.airbnb.epoxy.EpoxyAttribute import com.airbnb.epoxy.EpoxyAttribute
import im.vector.riotx.R import im.vector.riotx.R
import im.vector.riotx.core.epoxy.VectorEpoxyHolder import im.vector.riotx.core.epoxy.VectorEpoxyHolder
@ -44,7 +47,9 @@ abstract class BaseEventItem<H : BaseEventItem.BaseHolder> : VectorEpoxyModel<H>
override fun bind(holder: H) { override fun bind(holder: H) {
super.bind(holder) super.bind(holder)
holder.leftGuideline.setGuidelineBegin(leftGuideline) holder.leftGuideline.updateLayoutParams<RelativeLayout.LayoutParams> {
this.marginStart = leftGuideline
}
holder.checkableBackground.isChecked = highlighted holder.checkableBackground.isChecked = highlighted
} }
@ -55,7 +60,7 @@ abstract class BaseEventItem<H : BaseEventItem.BaseHolder> : VectorEpoxyModel<H>
abstract fun getEventIds(): List<String> abstract fun getEventIds(): List<String>
abstract class BaseHolder(@IdRes val stubId: Int) : VectorEpoxyHolder() { abstract class BaseHolder(@IdRes val stubId: Int) : VectorEpoxyHolder() {
val leftGuideline by bind<Guideline>(R.id.messageStartGuideline) val leftGuideline by bind<View>(R.id.messageStartGuideline)
val checkableBackground by bind<CheckableView>(R.id.messageSelectedBackground) val checkableBackground by bind<CheckableView>(R.id.messageSelectedBackground)
val readReceiptsView by bind<ReadReceiptsView>(R.id.readReceiptsView) val readReceiptsView by bind<ReadReceiptsView>(R.id.readReceiptsView)
val readMarkerView by bind<ReadMarkerView>(R.id.readMarkerView) val readMarkerView by bind<ReadMarkerView>(R.id.readMarkerView)

View File

@ -1,6 +1,5 @@
<?xml version="1.0" encoding="utf-8"?> <?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android" <RelativeLayout 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" xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent" android:layout_width="match_parent"
android:layout_height="wrap_content" android:layout_height="wrap_content"
@ -9,139 +8,137 @@
<im.vector.riotx.core.platform.CheckableView <im.vector.riotx.core.platform.CheckableView
android:id="@+id/messageSelectedBackground" android:id="@+id/messageSelectedBackground"
android:layout_width="0dp" android:layout_width="match_parent"
android:layout_height="0dp" android:layout_height="match_parent"
android:background="?riotx_highlighted_message_background" android:layout_alignParentTop="true"
app:layout_constraintBottom_toBottomOf="parent" android:layout_alignBottom="@+id/readMarkerView"
app:layout_constraintEnd_toEndOf="parent" android:background="?riotx_highlighted_message_background" />
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<ImageView <ImageView
android:id="@+id/messageAvatarImageView" android:id="@+id/messageAvatarImageView"
android:layout_width="44dp" android:layout_width="44dp"
android:layout_height="44dp" android:layout_height="44dp"
android:layout_marginStart="8dp" android:layout_marginStart="8dp"
android:layout_marginLeft="8dp"
android:layout_marginTop="4dp" android:layout_marginTop="4dp"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
tools:src="@tools:sample/avatars" /> tools:src="@tools:sample/avatars" />
<androidx.constraintlayout.widget.Guideline
android:id="@+id/messageStartGuideline"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical"
tools:layout_constraintGuide_begin="52dp" />
<TextView <TextView
android:id="@+id/messageMemberNameView" android:id="@+id/messageMemberNameView"
android:layout_width="wrap_content" android:layout_width="wrap_content"
android:layout_height="wrap_content" android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_marginStart="8dp" android:layout_marginStart="8dp"
android:layout_marginLeft="8dp" android:layout_marginLeft="8dp"
android:layout_marginTop="4dp" android:layout_marginTop="4dp"
android:layout_marginEnd="4dp" android:layout_marginEnd="4dp"
android:layout_marginRight="8dp" android:layout_marginRight="8dp"
android:layout_toStartOf="@+id/messageTimeView"
android:layout_toEndOf="@+id/messageStartGuideline"
android:ellipsize="end" android:ellipsize="end"
android:maxLines="1" android:maxLines="1"
android:textColor="?riotx_text_primary" android:textColor="?riotx_text_primary"
android:textSize="15sp" android:textSize="15sp"
android:textStyle="bold" android:textStyle="bold"
app:layout_constrainedWidth="true"
app:layout_constraintEnd_toStartOf="@+id/messageTimeView"
app:layout_constraintHorizontal_bias="0"
app:layout_constraintHorizontal_chainStyle="spread_inside"
app:layout_constraintStart_toEndOf="@id/messageStartGuideline"
app:layout_constraintTop_toTopOf="parent"
tools:text="@sample/matrix.json/data/displayName" /> tools:text="@sample/matrix.json/data/displayName" />
<TextView <TextView
android:id="@+id/messageTimeView" android:id="@+id/messageTimeView"
android:layout_width="wrap_content" android:layout_width="wrap_content"
android:layout_height="wrap_content" android:layout_height="wrap_content"
android:layout_alignParentEnd="true"
android:layout_alignBaseline="@+id/messageMemberNameView"
android:layout_marginStart="8dp" android:layout_marginStart="8dp"
android:layout_marginLeft="8dp" android:layout_marginLeft="8dp"
android:layout_marginEnd="8dp" android:layout_marginEnd="8dp"
android:layout_marginRight="8dp" android:layout_marginRight="8dp"
android:textColor="?riotx_text_secondary" android:textColor="?riotx_text_secondary"
android:textSize="12sp" android:textSize="12sp"
app:layout_constraintBaseline_toBaselineOf="@id/messageMemberNameView"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toEndOf="@id/messageMemberNameView"
tools:text="@tools:sample/date/hhmm" /> tools:text="@tools:sample/date/hhmm" />
<View
android:id="@+id/messageStartGuideline"
android:layout_width="0dp"
android:layout_height="0dp"
tools:layout_marginStart="52dp"
android:orientation="vertical" />
<FrameLayout
android:id="@+id/viewStubContainer"
android:addStatesFromChildren="true"
android:layout_width="match_parent"
android:layout_toEndOf="@id/messageStartGuideline"
android:layout_below="@id/messageMemberNameView"
android:layout_height="wrap_content">
<ViewStub <ViewStub
android:id="@+id/messageContentTextStub" android:id="@+id/messageContentTextStub"
style="@style/TimelineContentStubLayoutParams" android:layout_height="wrap_content"
style="@style/TimelineContentStubBaseParams"
android:inflatedId="@id/messageTextView" android:inflatedId="@id/messageTextView"
android:layout="@layout/item_timeline_event_text_message_stub" android:layout="@layout/item_timeline_event_text_message_stub"
tools:ignore="MissingConstraints"
tools:visibility="visible" /> tools:visibility="visible" />
<ViewStub <ViewStub
android:id="@+id/messageContentMediaStub" android:id="@+id/messageContentMediaStub"
style="@style/TimelineContentStubLayoutParams" android:layout_height="wrap_content"
style="@style/TimelineContentStubBaseParams"
android:inflatedId="@+id/messageContentMedia" android:inflatedId="@+id/messageContentMedia"
android:layout="@layout/item_timeline_event_media_message_stub" android:layout="@layout/item_timeline_event_media_message_stub" />
tools:ignore="MissingConstraints" />
<ViewStub <ViewStub
android:id="@+id/messageContentFileStub" android:id="@+id/messageContentFileStub"
style="@style/TimelineContentStubLayoutParams" android:layout_height="wrap_content"
android:layout="@layout/item_timeline_event_file_stub" style="@style/TimelineContentStubBaseParams"
tools:ignore="MissingConstraints" /> android:layout="@layout/item_timeline_event_file_stub" />
<ViewStub <ViewStub
android:id="@+id/messageContentRedactedStub" android:id="@+id/messageContentRedactedStub"
style="@style/TimelineContentStubLayoutParams" style="@style/TimelineContentStubBaseParams"
android:layout_height="20dp" android:layout_height="20dp"
android:layout_marginEnd="56dp" android:layout_marginEnd="56dp"
android:layout_marginRight="56dp" android:layout="@layout/item_timeline_event_redacted_stub" />
android:layout="@layout/item_timeline_event_redacted_stub"
tools:ignore="MissingConstraints" />
</FrameLayout>
<!-- TODO: For now we show 8 reactions maximum, this will need rework when needed--> <LinearLayout
<ViewStub android:id="@+id/informationBottom"
android:id="@+id/messageBottomInfo" android:layout_width="match_parent"
android:layout_width="0dp"
android:layout_height="wrap_content" android:layout_height="wrap_content"
android:layout_marginBottom="4dp" android:layout_below="@+id/viewStubContainer"
android:inflatedId="@+id/messageBottomInfo" android:layout_toEndOf="@+id/messageStartGuideline"
android:layout="@layout/item_timeline_event_bottom_reactions_stub" android:orientation="vertical">
android:visibility="gone"
app:layout_constraintBottom_toTopOf="@+id/readReceiptsView"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toEndOf="@id/messageStartGuideline"
app:layout_constraintVertical_chainStyle="packed"
tools:visibility="visible">
</ViewStub> <!-- TODO: For now we show 8 reactions maximum, this will need rework when needed-->
<im.vector.riotx.core.ui.views.ReadReceiptsView <ViewStub
android:id="@+id/readReceiptsView" android:id="@+id/messageBottomInfo"
android:layout_width="wrap_content" android:layout_width="match_parent"
android:layout_height="wrap_content" android:layout_height="wrap_content"
android:layout_marginEnd="8dp" android:layout_marginBottom="4dp"
android:layout_marginBottom="4dp" android:inflatedId="@+id/messageBottomInfo"
app:layout_constraintBottom_toTopOf="@+id/readMarkerView" android:layout="@layout/item_timeline_event_bottom_reactions_stub"
app:layout_constraintEnd_toEndOf="parent" /> android:visibility="gone"
tools:visibility="visible"/>
<im.vector.riotx.core.ui.views.ReadReceiptsView
android:id="@+id/readReceiptsView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="end"
android:layout_marginEnd="8dp"
android:layout_marginBottom="4dp" />
</LinearLayout>
<im.vector.riotx.core.ui.views.ReadMarkerView <im.vector.riotx.core.ui.views.ReadMarkerView
android:id="@+id/readMarkerView" android:id="@+id/readMarkerView"
android:layout_width="0dp" android:layout_width="match_parent"
android:layout_below="@+id/informationBottom"
android:layout_height="2dp" android:layout_height="2dp"
android:background="?attr/vctr_unread_marker_line_color"
android:layout_marginBottom="2dp"
android:visibility="invisible"
android:layout_marginEnd="8dp"
android:layout_marginStart="8dp" android:layout_marginStart="8dp"
app:layout_constraintBottom_toBottomOf="parent" android:layout_marginEnd="8dp"
app:layout_constraintEnd_toEndOf="parent" android:layout_marginBottom="2dp"
app:layout_constraintStart_toStartOf="parent" /> android:background="?attr/vctr_unread_marker_line_color"
android:visibility="invisible" />
</androidx.constraintlayout.widget.ConstraintLayout> </RelativeLayout>

View File

@ -1,6 +1,5 @@
<?xml version="1.0" encoding="utf-8"?> <?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android" <RelativeLayout 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" xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent" android:layout_width="match_parent"
android:layout_height="wrap_content" android:layout_height="wrap_content"
@ -9,70 +8,77 @@
<im.vector.riotx.core.platform.CheckableView <im.vector.riotx.core.platform.CheckableView
android:id="@+id/messageSelectedBackground" android:id="@+id/messageSelectedBackground"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_alignParentTop="true"
android:layout_alignBottom="@+id/informationBottom"
android:background="?riotx_highlighted_message_background" />
<View
android:id="@+id/messageStartGuideline"
android:layout_width="0dp" android:layout_width="0dp"
android:layout_height="0dp" android:layout_height="0dp"
android:background="?riotx_highlighted_message_background" android:layout_marginStart="52dp"
app:layout_constraintBottom_toBottomOf="parent" android:orientation="vertical" />
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<androidx.constraintlayout.widget.Guideline <FrameLayout
android:id="@+id/messageStartGuideline" android:id="@+id/viewStubContainer"
android:layout_width="wrap_content" android:layout_width="match_parent"
android:layout_height="wrap_content" android:layout_toEndOf="@id/messageStartGuideline"
android:orientation="vertical" android:layout_alignParentTop="true"
tools:layout_constraintGuide_begin="52dp" /> android:layout_height="wrap_content">
<ViewStub <ViewStub
android:id="@+id/messageContentNoticeStub" android:id="@+id/messageContentNoticeStub"
style="@style/TimelineContentStubNoInfoLayoutParams" style="@style/TimelineContentStubBaseParams"
android:layout="@layout/item_timeline_event_notice_stub" android:layout="@layout/item_timeline_event_notice_stub"
tools:ignore="MissingConstraints"
tools:visibility="visible" /> tools:visibility="visible" />
<ViewStub <ViewStub
android:id="@+id/messageContentDefaultStub" android:id="@+id/messageContentDefaultStub"
style="@style/TimelineContentStubNoInfoLayoutParams" style="@style/TimelineContentStubBaseParams"
android:inflatedId="@+id/stateMessageView" android:inflatedId="@+id/stateMessageView"
android:layout="@layout/item_timeline_event_default_stub" android:layout="@layout/item_timeline_event_default_stub" />
tools:ignore="MissingConstraints" />
<ViewStub <ViewStub
android:id="@+id/messageContentBlankStub" android:id="@+id/messageContentBlankStub"
style="@style/TimelineContentStubNoInfoLayoutParams" style="@style/TimelineContentStubBaseParams"
android:layout_width="0dp" android:layout_width="0dp"
android:layout_height="0dp" android:layout_height="0dp"
android:layout="@layout/item_timeline_event_blank_stub" android:layout="@layout/item_timeline_event_blank_stub" />
tools:ignore="MissingConstraints" />
<ViewStub <ViewStub
android:id="@+id/messageContentMergedheaderStub" android:id="@+id/messageContentMergedheaderStub"
style="@style/TimelineContentStubNoInfoLayoutParams" style="@style/TimelineContentStubBaseParams"
android:layout="@layout/item_timeline_event_merged_header_stub" android:layout="@layout/item_timeline_event_merged_header_stub" />
tools:ignore="MissingConstraints" />
<im.vector.riotx.core.ui.views.ReadReceiptsView </FrameLayout>
android:id="@+id/readReceiptsView"
android:layout_width="wrap_content" <LinearLayout
android:id="@+id/informationBottom"
android:layout_width="match_parent"
android:layout_height="wrap_content" android:layout_height="wrap_content"
android:layout_marginEnd="8dp" android:layout_below="@id/viewStubContainer"
android:layout_marginBottom="4dp" android:orientation="vertical">
app:layout_constraintBottom_toTopOf="@+id/readMarkerView"
app:layout_constraintEnd_toEndOf="parent" />
<im.vector.riotx.core.ui.views.ReadMarkerView <im.vector.riotx.core.ui.views.ReadReceiptsView
android:id="@+id/readMarkerView" android:id="@+id/readReceiptsView"
android:layout_width="0dp" android:layout_width="wrap_content"
android:layout_height="2dp" android:layout_height="wrap_content"
android:layout_marginStart="8dp" android:layout_gravity="end"
android:layout_marginEnd="8dp" android:layout_marginEnd="8dp"
android:layout_marginBottom="2dp" android:layout_marginBottom="4dp" />
android:background="?attr/vctr_unread_marker_line_color"
android:visibility="invisible"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent" />
<im.vector.riotx.core.ui.views.ReadMarkerView
android:id="@+id/readMarkerView"
android:layout_width="match_parent"
android:layout_height="2dp"
android:layout_marginStart="8dp"
android:layout_marginEnd="8dp"
android:layout_marginBottom="2dp"
android:background="?attr/vctr_unread_marker_line_color"
android:visibility="invisible" />
</androidx.constraintlayout.widget.ConstraintLayout> </LinearLayout>
</RelativeLayout>

View File

@ -1,61 +1,58 @@
<?xml version="1.0" encoding="utf-8"?> <?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android" <LinearLayout 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" xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent" android:layout_width="match_parent"
android:layout_height="wrap_content"> android:layout_height="wrap_content"
android:orientation="vertical">
<include <RelativeLayout
android:id="@+id/itemMergedAvatarListView" android:layout_width="match_parent"
layout="@layout/vector_message_merge_avatar_list" android:layout_height="wrap_content">
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="8dp"
android:layout_marginEnd="16dp"
android:layout_marginRight="16dp"
app:layout_constraintEnd_toStartOf="@+id/itemMergedExpandTextView"
app:layout_constraintHorizontal_bias="0.0"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<TextView <include
android:id="@+id/itemMergedExpandTextView" android:id="@+id/itemMergedAvatarListView"
android:layout_width="0dp" layout="@layout/vector_message_merge_avatar_list"
android:layout_height="wrap_content" android:layout_width="wrap_content"
android:paddingRight="8dp" android:layout_height="wrap_content"
android:layout_marginTop="2dp" android:layout_marginTop="8dp"
android:paddingLeft="8dp" android:layout_alignParentStart="true"
android:paddingTop="4dp" android:layout_toLeftOf="@+id/itemMergedExpandTextView"
android:paddingBottom="4dp" android:layout_marginEnd="16dp" />
android:text="@string/merged_events_expand"
android:textColor="?attr/colorAccent" <TextView
android:textSize="14sp" android:id="@+id/itemMergedExpandTextView"
android:textStyle="italic" android:layout_width="wrap_content"
app:layout_constraintEnd_toEndOf="parent" android:layout_height="wrap_content"
app:layout_constraintTop_toTopOf="parent" /> android:layout_marginTop="2dp"
android:paddingLeft="8dp"
android:paddingTop="4dp"
android:paddingRight="8dp"
android:paddingBottom="4dp"
android:layout_alignParentEnd="true"
android:text="@string/merged_events_expand"
android:textColor="?attr/colorAccent"
android:textSize="14sp"
android:textStyle="italic" />
</RelativeLayout>
<View <View
android:id="@+id/itemMergedSeparatorView" android:id="@+id/itemMergedSeparatorView"
android:layout_width="0dp" android:layout_width="match_parent"
android:layout_height="1dp" android:layout_height="1dp"
android:layout_marginTop="4dp" android:layout_marginTop="4dp"
android:background="?attr/riotx_header_panel_background" android:background="?attr/riotx_header_panel_background"/>
app:layout_constraintEnd_toEndOf="@id/itemMergedExpandTextView"
app:layout_constraintStart_toStartOf="@id/itemMergedAvatarListView"
app:layout_constraintTop_toBottomOf="@id/itemMergedExpandTextView" />
<TextView <TextView
android:id="@+id/itemMergedSummaryTextView" android:id="@+id/itemMergedSummaryTextView"
android:layout_width="0dp" android:layout_width="wrap_content"
android:layout_height="wrap_content" android:layout_height="wrap_content"
android:layout_marginTop="4dp" android:layout_marginTop="4dp"
android:textColor="?riotx_text_secondary" android:textColor="?riotx_text_secondary"
android:textIsSelectable="false" android:textIsSelectable="false"
android:textSize="14sp" android:textSize="14sp"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="@id/itemMergedAvatarListView"
app:layout_constraintTop_toBottomOf="@id/itemMergedSeparatorView"
tools:text="3 membership changes" /> tools:text="3 membership changes" />
</androidx.constraintlayout.widget.ConstraintLayout> </LinearLayout>

View File

@ -282,7 +282,7 @@
<style name="TimelineContentStubBaseParams"> <style name="TimelineContentStubBaseParams">
<item name="android:layout_width">0dp</item> <item name="android:layout_width">match_parent</item>
<item name="android:layout_height">wrap_content</item> <item name="android:layout_height">wrap_content</item>
<item name="android:layout_marginStart">8dp</item> <item name="android:layout_marginStart">8dp</item>
<item name="android:layout_marginLeft">8dp</item> <item name="android:layout_marginLeft">8dp</item>
@ -290,20 +290,6 @@
<item name="android:layout_marginRight">8dp</item> <item name="android:layout_marginRight">8dp</item>
<item name="android:layout_marginBottom">4dp</item> <item name="android:layout_marginBottom">4dp</item>
<item name="android:layout_marginTop">4dp</item> <item name="android:layout_marginTop">4dp</item>
<item name="layout_constraintBottom_toBottomOf">parent</item>
<item name="layout_constraintEnd_toEndOf">parent</item>
<item name="layout_constraintStart_toEndOf">@id/messageStartGuideline</item>
</style>
<style name="TimelineContentStubNoInfoLayoutParams" parent="TimelineContentStubBaseParams">
<item name="layout_constraintTop_toTopOf">parent</item>
<item name="layout_constraintBottom_toTopOf">@id/readReceiptsView</item>
</style>
<style name="TimelineContentStubLayoutParams" parent="TimelineContentStubBaseParams">
<item name="layout_constraintTop_toBottomOf">@id/messageMemberNameView</item>
<item name="layout_constraintBottom_toTopOf">@id/messageBottomInfo</item>
</style> </style>
<style name="VectorLabel"> <style name="VectorLabel">