Improve detailed status looks (#4260)

#4205 did change how the counters for the detailed posts behave and for
a good reason I believe.

However I find the changed order very confusing and not aesthetically
pleasing.

I have tried a few options, including reserving space for it but it was
confusing (when counters are not displayed there would be a danging
separator or if we show separator together with it it would be confusing
as well).

I propose we simply show the counters independent on the counts. I know
we try to de-emphasize the counters but I believe this is fine to do in
detailed view.

One disadvantage is that we need translators to update the translations.

Additionally I've done two spacing changes: I removed a separator
between the counters and the buttons, removed padding around the
counters and increased the space between the counters and the buttons
instead. I believe it's better to use space than separators. This also
makes the space above/below the media/counters separator balanced.

In the second commit I've also made the metadata/counters separators
thinner, I think it looks better.

here's the combined version:


![proposal_final](https://github.com/tuskyapp/Tusky/assets/3099142/ea9d4c0c-fe6a-4f2e-8427-673b2a833e6b)
This commit is contained in:
Willow 2024-02-23 10:25:05 +01:00 committed by GitHub
commit 22ec78c75a
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
4 changed files with 167 additions and 201 deletions

View file

@ -57,8 +57,8 @@ public class StatusDetailedViewHolder extends StatusBaseViewHolder {
if (visibilityIcon != null) {
ImageSpan visibilityIconSpan = new ImageSpan(
visibilityIcon,
Build.VERSION.SDK_INT >= Build.VERSION_CODES.Q ? DynamicDrawableSpan.ALIGN_CENTER : DynamicDrawableSpan.ALIGN_BASELINE
visibilityIcon,
Build.VERSION.SDK_INT >= Build.VERSION_CODES.Q ? DynamicDrawableSpan.ALIGN_CENTER : DynamicDrawableSpan.ALIGN_BASELINE
);
sb.setSpan(visibilityIconSpan, 0, visibilityString.length(), Spanned.SPAN_EXCLUSIVE_EXCLUSIVE);
}
@ -67,7 +67,6 @@ public class StatusDetailedViewHolder extends StatusBaseViewHolder {
Date createdAt = status.getCreatedAt();
if (createdAt != null) {
sb.append(" ");
sb.append(dateFormat.format(createdAt));
}
@ -105,7 +104,6 @@ public class StatusDetailedViewHolder extends StatusBaseViewHolder {
Status.Application app = status.getApplication();
if (app != null) {
sb.append(metadataJoiner);
if (app.getWebsite() != null) {
@ -121,25 +119,8 @@ public class StatusDetailedViewHolder extends StatusBaseViewHolder {
}
private void setReblogAndFavCount(int reblogCount, int favCount, StatusActionListener listener) {
if (reblogCount > 0) {
reblogs.setText(getReblogsText(reblogs.getContext(), reblogCount));
reblogs.setVisibility(View.VISIBLE);
} else {
reblogs.setVisibility(View.GONE);
}
if (favCount > 0) {
favourites.setText(getFavsText(favourites.getContext(), favCount));
favourites.setVisibility(View.VISIBLE);
} else {
favourites.setVisibility(View.GONE);
}
if (reblogs.getVisibility() == View.GONE && favourites.getVisibility() == View.GONE) {
infoDivider.setVisibility(View.GONE);
} else {
infoDivider.setVisibility(View.VISIBLE);
}
reblogs.setText(getReblogsText(reblogs.getContext(), reblogCount));
favourites.setText(getFavsText(favourites.getContext(), favCount));
reblogs.setOnClickListener(v -> {
int position = getBindingAdapterPosition();
@ -162,8 +143,8 @@ public class StatusDetailedViewHolder extends StatusBaseViewHolder {
@Nullable Object payloads) {
// We never collapse statuses in the detail view
StatusViewData.Concrete uncollapsedStatus = (status.isCollapsible() && status.isCollapsed()) ?
status.copyWithCollapsed(false) :
status;
status.copyWithCollapsed(false) :
status;
super.setupWithStatus(uncollapsedStatus, listener, statusDisplayOptions, payloads);
setupCard(uncollapsedStatus, status.isExpanded(), CardViewMode.FULL_WIDTH, statusDisplayOptions, listener); // Always show card for detailed status
@ -172,7 +153,7 @@ public class StatusDetailedViewHolder extends StatusBaseViewHolder {
if (!statusDisplayOptions.hideStats()) {
setReblogAndFavCount(actionable.getReblogsCount(),
actionable.getFavouritesCount(), listener);
actionable.getFavouritesCount(), listener);
} else {
hideQuantitativeStats();
}
@ -204,7 +185,7 @@ public class StatusDetailedViewHolder extends StatusBaseViewHolder {
}
final Drawable visibilityDrawable = AppCompatResources.getDrawable(
this.metaInfo.getContext(), visibilityIcon
this.metaInfo.getContext(), visibilityIcon
);
if (visibilityDrawable == null) {
return null;
@ -212,10 +193,10 @@ public class StatusDetailedViewHolder extends StatusBaseViewHolder {
final int size = (int) this.metaInfo.getTextSize();
visibilityDrawable.setBounds(
0,
0,
size,
size
0,
0,
size,
size
);
visibilityDrawable.setTint(this.metaInfo.getCurrentTextColor());