Mastodon
/
pachli-android
mirror of https://github.com/pachli/pachli-android.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

feat: Remove preview card placeholder icon (#839) 

Previous code displayed a large placeholder icon if there was no preview
image for a preview card.

This reduces the amount of space available for the actual preview text
(i.e., title and description) and did not convey additional information
in the limited space available on the timeline.

So remove it.

While I'm here simplify the PreviewCard layout and migrate to
ConstraintLayout.
This commit is contained in:
Nik Clayton 2024-07-28 16:24:20 +02:00 committed by GitHub
parent 48cd938618
commit 6b5f816b28
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
3 changed files with 68 additions and 62 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

17
app/src/main/java/app/pachli/view/PreviewCardView.kt
View File

@ -21,6 +21,7 @@ import android.content.Context
import android.graphics.drawable.Drawable
import android.util.AttributeSet
import android.view.LayoutInflater
import android.view.View
import android.view.ViewGroup
import android.widget.ImageView
import android.widget.LinearLayout
@ -132,7 +133,9 @@ class PreviewCardView @JvmOverloads constructor(
previewCardWrapper.setOnClickListener { listener.onClick(card, Target.CARD) }
cardImage.setOnClickListener { listener.onClick(card, Target.IMAGE) }
byline.setOnClickListener { listener.onClick(card, Target.BYLINE) }
byline.referencedIds.forEach { id ->
root.findViewById<View>(id).setOnClickListener { listener.onClick(card, Target.BYLINE) }
}
cardLink.text = card.url
@ -143,6 +146,7 @@ class PreviewCardView @JvmOverloads constructor(
// 2. Card has a blurhash, use that as the image, or
// 3. Use R.drawable.card_image_placeholder
if (statusDisplayOptions.mediaPreviewEnabled && (!sensitive || statusDisplayOptions.showSensitiveMedia) && !card.image.isNullOrBlank()) {
cardImage.show()
cardImage.shapeAppearanceModel = if (card.width > card.height) {
setTopBottomLayout()
} else {
@ -162,6 +166,7 @@ class PreviewCardView @JvmOverloads constructor(
builder.into(cardImage)
}
} else if (statusDisplayOptions.useBlurhash && !card.blurhash.isNullOrBlank()) {
cardImage.show()
cardImage.shapeAppearanceModel = setLeftRightLayout().build()
cardImage.scaleType = ImageView.ScaleType.CENTER_CROP
@ -170,12 +175,7 @@ class PreviewCardView @JvmOverloads constructor(
.dontTransform()
.into(cardImage)
} else {
cardImage.shapeAppearanceModel = setLeftRightLayout().build()
cardImage.scaleType = ImageView.ScaleType.CENTER
Glide.with(cardImage.context)
.load(R.drawable.card_image_placeholder)
.into(cardImage)
cardImage.hide()
}
card.authors?.firstOrNull()?.account?.let { account ->
@ -191,12 +191,10 @@ class PreviewCardView @JvmOverloads constructor(
/** Adjusts the layout parameters to place the image above the information views */
private fun setTopBottomLayout() = with(binding) {
val cardImageShape = ShapeAppearanceModel.Builder()
previewCardWrapper.orientation = VERTICAL
cardImage.layoutParams.height =
cardImage.resources.getDimensionPixelSize(DR.dimen.card_image_vertical_height)
cardImage.layoutParams.width = ViewGroup.LayoutParams.MATCH_PARENT
cardInfo.layoutParams.height = ViewGroup.LayoutParams.MATCH_PARENT
cardInfo.layoutParams.width = ViewGroup.LayoutParams.WRAP_CONTENT
cardImageShape.setTopLeftCorner(CornerFamily.ROUNDED, cardCornerRadius)
cardImageShape.setTopRightCorner(CornerFamily.ROUNDED, cardCornerRadius)
return@with cardImageShape
@ -205,7 +203,6 @@ class PreviewCardView @JvmOverloads constructor(
/** Adjusts the layout parameters to place the image on the left, the information on the right */
private fun setLeftRightLayout() = with(binding) {
val cardImageShape = ShapeAppearanceModel.Builder()
previewCardWrapper.orientation = HORIZONTAL
cardImage.layoutParams.height = ViewGroup.LayoutParams.MATCH_PARENT
cardImage.layoutParams.width =
cardImage.resources.getDimensionPixelSize(DR.dimen.card_image_horizontal_width)

12
app/src/main/res/drawable/card_image_placeholder.xml
View File

@ -1,12 +0,0 @@
<?xml version="1.0" encoding="utf-8"?>
<vector xmlns:android="http://schemas.android.com/apk/res/android"
android:width="48dp"
android:height="48dp"
android:viewportWidth="24"
android:viewportHeight="24"
android:tint="?android:textColorLink"
>
<path
android:fillColor="#fff"
android:pathData="M6,2A2,2 0 0,0 4,4V20A2,2 0 0,0 6,22H18A2,2 0 0,0 20,20V8L14,2H6M6,4H13V9H18V20H6V4M8,12V14H16V12H8M8,16V18H13V16H8Z" />
</vector>

101
app/src/main/res/layout/preview_card.xml
View File

@ -16,16 +16,17 @@
-->
<merge xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools">
xmlns:tools="http://schemas.android.com/tools"
xmlns:app="http://schemas.android.com/apk/res-auto">
<LinearLayout
<androidx.constraintlayout.widget.ConstraintLayout
android:id="@+id/preview_card_wrapper"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="@drawable/card_frame"
android:clipChildren="true"
android:foreground="?attr/selectableItemBackground"
android:minHeight="80dp"
android:minHeight="48dp"
android:orientation="vertical">
<com.google.android.material.imageview.ShapeableImageView
@ -34,13 +35,17 @@
android:layout_height="300dp"
android:layout_margin="1dp"
android:importantForAccessibility="no"
android:scaleType="center" />
android:scaleType="center"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
tools:srcCompat="@tools:sample/backgrounds/scenic" />
<LinearLayout
<androidx.constraintlayout.widget.ConstraintLayout
android:id="@+id/card_info"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
app:layout_constraintTop_toBottomOf="@id/card_image"
app:layout_constraintStart_toStartOf="parent"
android:paddingLeft="6dp"
android:paddingTop="6dp"
android:paddingRight="6dp"
@ -48,18 +53,22 @@
<TextView
android:id="@+id/card_title"
android:layout_width="wrap_content"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:ellipsize="end"
android:fontFamily="sans-serif-medium"
android:maxLines="2"
android:textColor="?android:textColorSecondary"
android:textSize="?attr/status_text_medium"
tools:ignore="SelectableText" />
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
tools:ignore="SelectableText"
tools:text="@tools:sample/lorem" />
<TextView
android:id="@+id/card_description"
android:layout_width="wrap_content"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginTop="4dp"
android:ellipsize="end"
@ -67,49 +76,61 @@
android:maxLines="3"
android:textColor="?android:textColorSecondary"
android:textSize="?attr/status_text_medium"
tools:ignore="SelectableText" />
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@id/card_title"
tools:ignore="SelectableText"
tools:text="@tools:sample/lorem" />
<TextView
android:id="@+id/card_link"
android:layout_width="wrap_content"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginTop="4dp"
android:ellipsize="end"
android:lines="1"
android:textColor="?android:attr/textColorLink"
android:textSize="?attr/status_text_small"
tools:ignore="SelectableText" />
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@id/card_description"
tools:ignore="SelectableText"
tools:text="@tools:sample/lorem" />
<LinearLayout
android:id="@+id/byline"
<com.google.android.material.divider.MaterialDivider
android:id="@+id/byline_divider"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:minHeight="48dp"
android:gravity="bottom"
android:orientation="vertical">
android:layout_marginTop="6dp"
app:layout_constraintTop_toBottomOf="@id/card_link"
app:layout_constraintStart_toStartOf="parent" />
<com.google.android.material.divider.MaterialDivider
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="6dp" />
<TextView
android:id="@+id/author_info"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:background="?selectableItemBackground"
android:drawablePadding="10dp"
android:ellipsize="end"
android:gravity="start|center"
android:lines="1"
android:paddingStart="2dp"
android:paddingTop="6dp"
android:paddingEnd="2dp"
android:paddingBottom="2dp"
android:textSize="?attr/status_text_medium"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@id/byline_divider"
tools:ignore="SelectableText"
tools:text="@tools:sample/lorem" />
<TextView
android:id="@+id/author_info"
android:layout_width="wrap_content"
android:layout_height="0dp"
android:layout_weight="1"
android:layout_marginTop="6dp"
android:textColor="?android:textColorTertiary"
android:textSize="?attr/status_text_medium"
android:ellipsize="end"
android:drawablePadding="10dp"
android:gravity="center"
android:lines="1"
android:paddingStart="2dp"
android:paddingEnd="2dp"
android:paddingBottom="2dp"
tools:ignore="SelectableText" />
</LinearLayout>
</LinearLayout>
</LinearLayout>
<androidx.constraintlayout.widget.Group
android:id="@+id/byline"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:visibility="visible"
app:constraint_referenced_ids="byline_divider,author_info" />
</androidx.constraintlayout.widget.ConstraintLayout>
</androidx.constraintlayout.widget.ConstraintLayout>
</merge>