improve content warning button

* Use the entire content warning text + button as the hitbox for the "Show more/less" toggle

* Move the content warning toggle button to its own line and give it a little more space

* Move content warning elements into parent layout, remove now-superfluous FlowLayout

* Use marginTop/Bottom instead of Vertical, which is only in sdk 26+

* Update minimum width for content warning toggle button
This commit is contained in:
Levi Bard 2018-03-15 19:15:12 +01:00 committed by Konrad Pozniak
parent c50d0319f3
commit 043ac58254
7 changed files with 79 additions and 221 deletions

View file

@ -300,7 +300,6 @@ public class NotificationsAdapter extends RecyclerView.Adapter {
private final ViewGroup container;
private final ImageView statusAvatar;
private final ImageView notificationAvatar;
private final View contentWarningBar;
private final TextView contentWarningDescriptionTextView;
private final ToggleButton contentWarningButton;
@ -320,7 +319,6 @@ public class NotificationsAdapter extends RecyclerView.Adapter {
container = itemView.findViewById(R.id.notification_container);
statusAvatar = itemView.findViewById(R.id.notification_status_avatar);
notificationAvatar = itemView.findViewById(R.id.notification_notification_avatar);
contentWarningBar = itemView.findViewById(R.id.notification_content_warning_bar);
contentWarningDescriptionTextView = itemView.findViewById(R.id.notification_content_warning_description);
contentWarningButton = itemView.findViewById(R.id.notification_content_warning_button);
@ -336,7 +334,8 @@ public class NotificationsAdapter extends RecyclerView.Adapter {
private void showNotificationContent(boolean show) {
statusNameBar.setVisibility(show ? View.VISIBLE : View.GONE);
contentWarningBar.setVisibility(show ? View.VISIBLE : View.GONE);
contentWarningDescriptionTextView.setVisibility(show ? View.VISIBLE : View.GONE);
contentWarningButton.setVisibility(show ? View.VISIBLE : View.GONE);
statusContent.setVisibility(show ? View.VISIBLE : View.GONE);
statusAvatar.setVisibility(show ? View.VISIBLE : View.GONE);
notificationAvatar.setVisibility(show ? View.VISIBLE : View.GONE);
@ -417,7 +416,8 @@ public class NotificationsAdapter extends RecyclerView.Adapter {
if (statusViewData != null) {
boolean hasSpoiler = !TextUtils.isEmpty(statusViewData.getSpoilerText());
contentWarningBar.setVisibility(hasSpoiler ? View.VISIBLE : View.GONE);
contentWarningDescriptionTextView.setVisibility(hasSpoiler ? View.VISIBLE : View.GONE);
contentWarningButton.setVisibility(hasSpoiler ? View.VISIBLE : View.GONE);
setupContentAndSpoiler(notificationViewData, listener);
}

View file

@ -58,7 +58,6 @@ abstract class StatusBaseViewHolder extends RecyclerView.ViewHolder {
private TextView sensitiveMediaWarning;
private View sensitiveMediaShow;
private TextView mediaLabel;
private View contentWarningBar;
private TextView contentWarningDescription;
private ToggleButton contentWarningButton;
@ -90,7 +89,6 @@ abstract class StatusBaseViewHolder extends RecyclerView.ViewHolder {
sensitiveMediaWarning = itemView.findViewById(R.id.status_sensitive_media_warning);
sensitiveMediaShow = itemView.findViewById(R.id.status_sensitive_media_button);
mediaLabel = itemView.findViewById(R.id.status_media_label);
contentWarningBar = itemView.findViewById(R.id.status_content_warning_bar);
contentWarningDescription = itemView.findViewById(R.id.status_content_warning_description);
contentWarningButton = itemView.findViewById(R.id.status_content_warning_button);
}
@ -389,7 +387,8 @@ abstract class StatusBaseViewHolder extends RecyclerView.ViewHolder {
CharSequence emojiSpoiler =
CustomEmojiHelper.emojifyString(spoilerText, emojis, contentWarningDescription);
contentWarningDescription.setText(emojiSpoiler);
contentWarningBar.setVisibility(View.VISIBLE);
contentWarningDescription.setVisibility(View.VISIBLE);
contentWarningButton.setVisibility(View.VISIBLE);
contentWarningButton.setChecked(expanded);
contentWarningButton.setOnCheckedChangeListener(new CompoundButton.OnCheckedChangeListener() {
@Override
@ -413,7 +412,8 @@ abstract class StatusBaseViewHolder extends RecyclerView.ViewHolder {
}
private void hideSpoilerText() {
contentWarningBar.setVisibility(View.GONE);
contentWarningDescription.setVisibility(View.GONE);
contentWarningButton.setVisibility(View.GONE);
content.setVisibility(View.VISIBLE);
}

View file

@ -1,114 +0,0 @@
/* Copyright 2017 Andrew Dawson
*
* This file is a part of Tusky.
*
* This program is free software; you can redistribute it and/or modify it under the terms of the
* GNU General Public License as published by the Free Software Foundation; either version 3 of the
* License, or (at your option) any later version.
*
* Tusky is distributed in the hope that it will be useful, but WITHOUT ANY WARRANTY; without even
* the implied warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the GNU General
* Public License for more details.
*
* You should have received a copy of the GNU General Public License along with Tusky; if not,
* see <http://www.gnu.org/licenses>. */
package com.keylesspalace.tusky.view;
import android.content.Context;
import android.content.res.TypedArray;
import android.util.AttributeSet;
import android.view.View;
import android.view.ViewGroup;
import com.keylesspalace.tusky.R;
import com.keylesspalace.tusky.util.Assert;
public class FlowLayout extends ViewGroup {
private int paddingHorizontal; // internal padding between child views
private int paddingVertical; //
public FlowLayout(Context context, AttributeSet attrs) {
this(context, attrs, 0);
}
public FlowLayout(Context context, AttributeSet attrs, int defStyle) {
super(context, attrs, defStyle);
TypedArray a = context.getTheme()
.obtainStyledAttributes(attrs, R.styleable.FlowLayout, 0, 0);
try {
paddingHorizontal = a.getDimensionPixelSize(R.styleable.FlowLayout_paddingHorizontal, 0);
paddingVertical = a.getDimensionPixelSize(R.styleable.FlowLayout_paddingVertical, 0);
} finally {
a.recycle();
}
}
@Override
protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
Assert.expect(MeasureSpec.getMode(widthMeasureSpec) != MeasureSpec.UNSPECIFIED);
int width = MeasureSpec.getSize(widthMeasureSpec) - getPaddingLeft() - getPaddingRight();
int height = MeasureSpec.getSize(heightMeasureSpec) - getPaddingTop() - getPaddingBottom();
int count = getChildCount();
int x = getPaddingLeft();
int y = getPaddingTop();
int childHeightMeasureSpec;
if (MeasureSpec.getMode(heightMeasureSpec) == MeasureSpec.AT_MOST) {
childHeightMeasureSpec = MeasureSpec.makeMeasureSpec(height, MeasureSpec.AT_MOST);
} else {
childHeightMeasureSpec = MeasureSpec.makeMeasureSpec(0, MeasureSpec.UNSPECIFIED);
}
int rowHeight = 0;
for (int i = 0; i < count; i++) {
View child = getChildAt(i);
if (child.getVisibility() != GONE) {
int widthSpec = MeasureSpec.makeMeasureSpec(width, MeasureSpec.AT_MOST);
child.measure(widthSpec, childHeightMeasureSpec);
child.getLayoutParams();
int childWidth = child.getMeasuredWidth();
int childHeight = child.getMeasuredHeight();
if (x + childWidth > width) {
x = getPaddingLeft();
y += rowHeight;
rowHeight = childHeight + paddingVertical;
} else {
rowHeight = Math.max(rowHeight, childHeight + paddingVertical);
}
x += childWidth + paddingHorizontal;
}
}
if (MeasureSpec.getMode(heightMeasureSpec) == MeasureSpec.UNSPECIFIED) {
height = y + rowHeight;
} else if (MeasureSpec.getMode(heightMeasureSpec) == MeasureSpec.AT_MOST) {
if (y + rowHeight < height) {
height = y + rowHeight;
}
}
height += 5; // Fudge to avoid clipping bottom of last row.
setMeasuredDimension(width, height);
}
@Override
protected void onLayout(boolean changed, int l, int t, int r, int b) {
final int width = r - l;
int x = getPaddingLeft();
int y = getPaddingTop();
int rowHeight = 0;
for (int i = 0; i < getChildCount(); i++) {
View child = getChildAt(i);
if (child.getVisibility() != GONE) {
int childWidth = child.getMeasuredWidth();
int childHeight = child.getMeasuredHeight();
if (x + childWidth > width) {
x = getPaddingLeft();
y += rowHeight;
rowHeight = childHeight + paddingVertical;
} else {
rowHeight = Math.max(childHeight, rowHeight);
}
child.layout(x, y, x + childWidth, y + childHeight);
x += childWidth + paddingHorizontal;
}
}
}
}

View file

@ -87,52 +87,44 @@
android:textSize="?attr/status_text_medium"
tools:text="13:37" />
</RelativeLayout>
<com.keylesspalace.tusky.view.FlowLayout
android:id="@+id/status_content_warning_bar"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="@+id/status_name_bar"
android:layout_marginBottom="4dp"
android:layout_toEndOf="@+id/status_avatar"
android:focusable="true"
android:visibility="gone"
app:paddingHorizontal="4dp">
<TextView
android:id="@+id/status_content_warning_description"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="@id/status_display_name"
android:lineSpacingMultiplier="1.1"
android:textColor="?android:textColorPrimary"
android:visibility="gone"
android:textSize="?attr/status_text_medium" />
<ToggleButton
android:id="@+id/status_content_warning_button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="6dp"
android:layout_below="@+id/status_content_warning_description"
android:layout_centerHorizontal="true"
android:background="?attr/content_warning_button"
android:minHeight="0dp"
android:minWidth="0dp"
android:paddingBottom="3dp"
android:paddingLeft="6dp"
android:paddingRight="6dp"
android:paddingTop="3dp"
android:minWidth="150dp"
android:paddingBottom="6dp"
android:paddingLeft="16dp"
android:paddingRight="16dp"
android:paddingTop="6dp"
android:layout_marginTop="4dp"
android:layout_marginBottom="4dp"
android:textAllCaps="true"
android:textOff="@string/status_content_warning_show_more"
android:textOn="@string/status_content_warning_show_less"
android:textSize="?attr/status_text_small" />
</com.keylesspalace.tusky.view.FlowLayout>
android:visibility="gone"
android:textSize="?attr/status_text_medium" />
</RelativeLayout>
<TextView
android:id="@+id/status_content"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentEnd="true"
android:layout_below="@+id/status_content_warning_bar"
android:layout_below="@+id/status_name_bar"
android:layout_marginBottom="4dp"
android:layout_toEndOf="@+id/status_avatar"
android:focusable="true"

View file

@ -52,47 +52,41 @@
</LinearLayout>
<com.keylesspalace.tusky.view.FlowLayout
android:id="@+id/status_content_warning_bar"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="@+id/status_name_bar"
android:layout_marginBottom="4dp"
android:focusable="true"
android:visibility="gone"
app:paddingHorizontal="4dp">
<TextView
android:id="@+id/status_content_warning_description"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="@id/status_name_bar"
android:lineSpacingMultiplier="1.1"
android:textColor="?android:textColorPrimary"
tools:text="CW this is a long long long long long long long long content warning"
android:textSize="?attr/status_text_medium" />
<ToggleButton
android:id="@+id/status_content_warning_button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="@+id/status_content_warning_description"
android:layout_centerHorizontal="true"
android:background="?attr/content_warning_button"
android:minHeight="0dp"
android:minWidth="0dp"
android:paddingBottom="3dp"
android:paddingLeft="6dp"
android:paddingRight="6dp"
android:paddingTop="3dp"
android:minWidth="150dp"
android:paddingBottom="6dp"
android:paddingLeft="16dp"
android:paddingRight="16dp"
android:paddingTop="6dp"
android:layout_marginTop="4dp"
android:layout_marginBottom="4dp"
android:textAllCaps="true"
android:textOff="@string/status_content_warning_show_more"
android:textOn="@string/status_content_warning_show_less"
android:textSize="?attr/status_text_small" />
</com.keylesspalace.tusky.view.FlowLayout>
android:textSize="?attr/status_text_medium" />
<TextView
android:id="@+id/status_content"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="@+id/status_content_warning_bar"
android:layout_below="@+id/status_content_warning_button"
android:layout_marginBottom="4dp"
android:focusable="true"
android:lineSpacingMultiplier="1.1"

View file

@ -72,22 +72,12 @@
</RelativeLayout>
<com.keylesspalace.tusky.view.FlowLayout
android:id="@+id/notification_content_warning_bar"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="@+id/status_name_bar"
android:layout_marginBottom="4dp"
android:layout_toEndOf="@+id/notification_status_avatar"
android:focusable="true"
android:visibility="gone"
app:paddingHorizontal="4dp"
tools:visibility="visible">
<TextView
android:id="@+id/notification_content_warning_description"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="@id/status_name_bar"
android:layout_toEndOf="@id/notification_status_avatar"
android:lineSpacingMultiplier="1.1"
android:textColor="?android:textColorTertiary"
android:textSize="?attr/status_text_medium"
@ -98,26 +88,27 @@
android:id="@+id/notification_content_warning_button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="6dp"
android:layout_below="@+id/notification_content_warning_description"
android:layout_centerHorizontal="true"
android:background="?attr/content_warning_button"
android:minHeight="0dp"
android:minWidth="0dp"
android:paddingBottom="3dp"
android:paddingLeft="6dp"
android:paddingRight="6dp"
android:paddingTop="3dp"
android:minWidth="150dp"
android:paddingBottom="6dp"
android:paddingLeft="16dp"
android:paddingRight="16dp"
android:paddingTop="6dp"
android:layout_marginTop="4dp"
android:layout_marginBottom="4dp"
android:textAllCaps="true"
android:textOff="@string/status_content_warning_show_more"
android:textOn="@string/status_content_warning_show_less"
android:textSize="?attr/status_text_medium" />
</com.keylesspalace.tusky.view.FlowLayout>
<TextView
android:id="@+id/notification_content"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="@id/notification_content_warning_bar"
android:layout_below="@id/notification_content_warning_button"
android:layout_toEndOf="@+id/notification_status_avatar"
android:lineSpacingMultiplier="1.1"
android:paddingBottom="10dp"

View file

@ -1,11 +1,6 @@
<?xml version="1.0" encoding="utf-8"?>
<resources>
<declare-styleable name="FlowLayout">
<attr name="paddingHorizontal" format="dimension" />
<attr name="paddingVertical" format="dimension" />
</declare-styleable>
<declare-styleable name="StatusButton">
<attr name="state_marked" format="boolean" />
</declare-styleable>