Optimization: try to get a more performant reactions display management

This commit is contained in:
ganfra 2019-10-03 19:15:11 +02:00
parent c763635845
commit 525da17678
5 changed files with 65 additions and 174 deletions

View File

@ -282,6 +282,7 @@ dependencies {
implementation "ru.noties.markwon:core:$markwon_version"
implementation "ru.noties.markwon:html:$markwon_version"
implementation 'me.saket:better-link-movement-method:2.2.0'
implementation 'com.google.android:flexbox:1.1.1'
// Bus
implementation 'org.greenrobot:eventbus:3.1.1'

View File

@ -122,38 +122,23 @@ abstract class AbsMessageItem<H : AbsMessageItem.Holder> : BaseEventItem<H>() {
_readMarkerCallback
)
if (!shouldShowReactionAtBottom() || attributes.informationData.orderedReactionList.isNullOrEmpty()) {
holder.reactionWrapper?.isVisible = false
val reactions = attributes.informationData.orderedReactionList
if (!shouldShowReactionAtBottom() || reactions.isNullOrEmpty()) {
holder.reactionWrapper.isVisible = false
} else {
//inflate if needed
if (holder.reactionFlowHelper == null) {
holder.reactionWrapper = holder.view.findViewById<ViewStub>(R.id.messageBottomInfo).inflate() as? ViewGroup
holder.reactionFlowHelper = holder.view.findViewById(R.id.reactionsFlowHelper)
holder.reactionWrapper.isVisible = true
holder.reactionWrapper.removeAllViews()
reactions.take(8).forEach { reaction ->
val reactionButton = ReactionButton(holder.view.context)
reactionButton.reactedListener = reactionClickListener
reactionButton.setTag(R.id.reactionsContainer, reaction.key)
reactionButton.reactionString = reaction.key
reactionButton.reactionCount = reaction.count
reactionButton.setChecked(reaction.addedByMe)
reactionButton.isEnabled = reaction.synced
holder.reactionWrapper.addView(reactionButton)
}
holder.reactionWrapper?.isVisible = true
//clear all reaction buttons (but not the Flow helper!)
holder.reactionWrapper?.children?.forEach { (it as? ReactionButton)?.isGone = true }
val idToRefInFlow = ArrayList<Int>()
attributes.informationData.orderedReactionList?.chunked(8)?.firstOrNull()?.forEachIndexed { index, reaction ->
(holder.reactionWrapper?.children?.elementAtOrNull(index) as? ReactionButton)?.let { reactionButton ->
reactionButton.isVisible = true
reactionButton.reactedListener = reactionClickListener
reactionButton.setTag(R.id.messageBottomInfo, reaction.key)
idToRefInFlow.add(reactionButton.id)
reactionButton.reactionString = reaction.key
reactionButton.reactionCount = reaction.count
reactionButton.setChecked(reaction.addedByMe)
reactionButton.isEnabled = reaction.synced
}
}
// Just setting the view as gone will break the FlowHelper (and invisible will take too much space),
// so have to update ref ids
holder.reactionFlowHelper?.referencedIds = idToRefInFlow.toIntArray()
if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.JELLY_BEAN_MR2 && !holder.view.isInLayout) {
holder.reactionFlowHelper?.requestLayout()
}
holder.reactionWrapper?.setOnLongClickListener(attributes.itemLongClickListener)
holder.reactionWrapper.setOnLongClickListener(attributes.itemLongClickListener)
}
}
@ -181,8 +166,7 @@ abstract class AbsMessageItem<H : AbsMessageItem.Holder> : BaseEventItem<H>() {
val avatarImageView by bind<ImageView>(R.id.messageAvatarImageView)
val memberNameView by bind<TextView>(R.id.messageMemberNameView)
val timeView by bind<TextView>(R.id.messageTimeView)
var reactionWrapper: ViewGroup? = null
var reactionFlowHelper: Flow? = null
val reactionWrapper by bind<ViewGroup>(R.id.reactionsContainer)
}
/**

View File

@ -0,0 +1,8 @@
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle">
<size
android:width="8dp"
android:height="8dp" />
<solid android:color="#00000000" />
</shape>

View File

@ -1,5 +1,6 @@
<?xml version="1.0" encoding="utf-8"?>
<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"
android:layout_width="match_parent"
android:layout_height="wrap_content"
@ -10,8 +11,8 @@
android:id="@+id/messageSelectedBackground"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_alignParentTop="true"
android:layout_alignBottom="@+id/readMarkerView"
android:layout_alignParentTop="true"
android:background="?riotx_highlighted_message_background" />
<ImageView
@ -45,8 +46,8 @@
android:id="@+id/messageTimeView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentEnd="true"
android:layout_alignBaseline="@+id/messageMemberNameView"
android:layout_alignParentEnd="true"
android:layout_marginStart="8dp"
android:layout_marginLeft="8dp"
android:layout_marginEnd="8dp"
@ -59,66 +60,65 @@
android:id="@+id/messageStartGuideline"
android:layout_width="0dp"
android:layout_height="0dp"
tools:layout_marginStart="52dp"
android:orientation="vertical" />
android:orientation="vertical"
tools:layout_marginStart="52dp" />
<FrameLayout
android:id="@+id/viewStubContainer"
android:addStatesFromChildren="true"
android:layout_width="match_parent"
android:layout_toEndOf="@id/messageStartGuideline"
android:layout_height="wrap_content"
android:layout_below="@id/messageMemberNameView"
android:layout_height="wrap_content">
android:layout_toEndOf="@id/messageStartGuideline"
android:addStatesFromChildren="true">
<ViewStub
android:id="@+id/messageContentTextStub"
android:layout_height="wrap_content"
style="@style/TimelineContentStubBaseParams"
android:inflatedId="@id/messageTextView"
android:layout="@layout/item_timeline_event_text_message_stub"
tools:visibility="visible" />
<ViewStub
android:id="@+id/messageContentTextStub"
style="@style/TimelineContentStubBaseParams"
android:layout_height="wrap_content"
android:inflatedId="@id/messageTextView"
android:layout="@layout/item_timeline_event_text_message_stub"
tools:visibility="visible" />
<ViewStub
android:id="@+id/messageContentMediaStub"
android:layout_height="wrap_content"
style="@style/TimelineContentStubBaseParams"
android:inflatedId="@+id/messageContentMedia"
android:layout="@layout/item_timeline_event_media_message_stub" />
<ViewStub
android:id="@+id/messageContentMediaStub"
style="@style/TimelineContentStubBaseParams"
android:layout_height="wrap_content"
android:inflatedId="@+id/messageContentMedia"
android:layout="@layout/item_timeline_event_media_message_stub" />
<ViewStub
android:id="@+id/messageContentFileStub"
android:layout_height="wrap_content"
style="@style/TimelineContentStubBaseParams"
android:layout="@layout/item_timeline_event_file_stub" />
<ViewStub
android:id="@+id/messageContentFileStub"
style="@style/TimelineContentStubBaseParams"
android:layout_height="wrap_content"
android:layout="@layout/item_timeline_event_file_stub" />
<ViewStub
android:id="@+id/messageContentRedactedStub"
style="@style/TimelineContentStubBaseParams"
android:layout_height="20dp"
android:layout_marginEnd="56dp"
android:layout="@layout/item_timeline_event_redacted_stub" />
<ViewStub
android:id="@+id/messageContentRedactedStub"
style="@style/TimelineContentStubBaseParams"
android:layout_height="20dp"
android:layout_marginEnd="56dp"
android:layout="@layout/item_timeline_event_redacted_stub" />
</FrameLayout>
<LinearLayout
android:id="@+id/informationBottom"
android:layout_width="match_parent"
android:addStatesFromChildren="true"
android:layout_height="wrap_content"
android:layout_below="@+id/viewStubContainer"
android:layout_toEndOf="@+id/messageStartGuideline"
android:orientation="vertical">
<!-- TODO: For now we show 8 reactions maximum, this will need rework when needed-->
<ViewStub
android:id="@+id/messageBottomInfo"
<com.google.android.flexbox.FlexboxLayout
android:id="@+id/reactionsContainer"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginStart="8dp"
android:layout_marginBottom="4dp"
android:inflatedId="@+id/messageBottomInfo"
android:layout="@layout/item_timeline_event_bottom_reactions_stub"
android:visibility="gone"
tools:visibility="visible"/>
app:dividerDrawable="@drawable/reaction_divider"
app:flexWrap="wrap"
app:showDivider="middle" />
<im.vector.riotx.core.ui.views.ReadReceiptsView
android:id="@+id/readReceiptsView"
@ -133,8 +133,8 @@
<im.vector.riotx.core.ui.views.ReadMarkerView
android:id="@+id/readMarkerView"
android:layout_width="match_parent"
android:layout_below="@+id/informationBottom"
android:layout_height="2dp"
android:layout_below="@+id/informationBottom"
android:layout_marginStart="8dp"
android:layout_marginEnd="8dp"
android:layout_marginBottom="2dp"

View File

@ -1,102 +0,0 @@
<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout 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:id="@+id/messageBottomInfo"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<im.vector.riotx.features.reactions.widget.ReactionButton
android:id="@+id/messageBottomReaction1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:visibility="gone"
tools:emoji="👍"
tools:ignore="MissingConstraints"
tools:reaction_count="3"
tools:visibility="visible" />
<im.vector.riotx.features.reactions.widget.ReactionButton
android:id="@+id/messageBottomReaction2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:visibility="gone"
tools:emoji="👎"
tools:ignore="MissingConstraints"
tools:reaction_count="10"
tools:visibility="visible" />
<im.vector.riotx.features.reactions.widget.ReactionButton
android:id="@+id/messageBottomReaction3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:visibility="gone"
tools:emoji="😀"
tools:ignore="MissingConstraints"
tools:visibility="visible" />
<im.vector.riotx.features.reactions.widget.ReactionButton
android:id="@+id/messageBottomReaction4"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:visibility="gone"
tools:emoji="☹️"
tools:ignore="MissingConstraints"
tools:visibility="visible" />
<im.vector.riotx.features.reactions.widget.ReactionButton
android:id="@+id/messageBottomReaction5"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:visibility="gone"
tools:emoji="😱"
tools:ignore="MissingConstraints"
tools:visibility="visible" />
<im.vector.riotx.features.reactions.widget.ReactionButton
android:id="@+id/messageBottomReaction6"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:visibility="gone"
tools:emoji="❌"
tools:ignore="MissingConstraints"
tools:visibility="visible" />
<im.vector.riotx.features.reactions.widget.ReactionButton
android:id="@+id/messageBottomReaction7"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:visibility="gone"
tools:emoji="✔️"
tools:ignore="MissingConstraints"
tools:visibility="visible" />
<im.vector.riotx.features.reactions.widget.ReactionButton
android:id="@+id/messageBottomReaction8"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:visibility="gone"
tools:emoji="♥️"
tools:ignore="MissingConstraints"
tools:visibility="visible" />
<androidx.constraintlayout.helper.widget.Flow
android:id="@+id/reactionsFlowHelper"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:padding="2dp"
app:constraint_referenced_ids="messageBottomReaction1,messageBottomReaction2,messageBottomReaction3,messageBottomReaction4,messageBottomReaction5,messageBottomReaction6,messageBottomReaction7,messageBottomReaction8"
app:flow_horizontalBias="0"
app:flow_horizontalGap="8dp"
app:flow_horizontalStyle="packed"
app:flow_verticalBias="0"
app:flow_verticalGap="4dp"
app:flow_wrapMode="chain"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
</androidx.constraintlayout.widget.ConstraintLayout>