empathicqubit/Signal-Android
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions 1

Update tooltip to behave better when content is at edge of screen.

Browse source
This commit is contained in:
Alex Hart 2022-12-07 14:58:01 -04:00
parent 45a1c5c369
commit 79ec76f11f
5 changed files with 57 additions and 18 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

28
app/src/main/java/org/thoughtcrime/securesms/components/TooltipPopup.java
View file

@ -18,10 +18,12 @@ import androidx.annotation.Px;
import androidx.annotation.StringRes;
import androidx.core.content.ContextCompat;
import com.google.android.material.shape.MaterialShapeDrawable;
import com.google.android.material.shape.ShapeAppearanceModel;
import org.signal.core.util.DimensionUnit;
import org.thoughtcrime.securesms.R;
import org.thoughtcrime.securesms.mms.GlideApp;
import org.thoughtcrime.securesms.util.ViewUtil;
/**
* Class for creating simple tooltips to show throughout the app. Utilizes a popup window so you
@ -42,6 +44,8 @@ public class TooltipPopup extends PopupWindow {
private final int position;
private final int startMargin;
private final MaterialShapeDrawable shapeableBubbleBackground = new MaterialShapeDrawable();
public static Builder forTarget(@NonNull View anchor) {
return new Builder(anchor);
}
@ -85,9 +89,11 @@ public class TooltipPopup extends PopupWindow {
if (backgroundTint == 0) {
bubble.getBackground().setColorFilter(ContextCompat.getColor(anchor.getContext(), R.color.tooltip_default_color), PorterDuff.Mode.MULTIPLY);
arrow.setColorFilter(ContextCompat.getColor(anchor.getContext(), R.color.tooltip_default_color), PorterDuff.Mode.SRC_IN);
shapeableBubbleBackground.setTint(ContextCompat.getColor(anchor.getContext(), R.color.tooltip_default_color));
} else {
bubble.getBackground().setColorFilter(backgroundTint, PorterDuff.Mode.MULTIPLY);
arrow.setColorFilter(backgroundTint, PorterDuff.Mode.SRC_IN);
shapeableBubbleBackground.setTint(backgroundTint);
}
if (iconGlideModel != null) {
@ -161,6 +167,26 @@ public class TooltipPopup extends PopupWindow {
xoffset -= startMargin;
}
View bubble = getContentView().findViewById(R.id.tooltip_bubble);
ShapeAppearanceModel.Builder shapeAppearanceModel = ShapeAppearanceModel.builder()
.setAllCornerSizes(DimensionUnit.DP.toPixels(18));
// If the arrow is within the last 20dp of the right hand side, use RIGHT and set corner to 9dp
onLayout(() -> {
if (arrow.getX() > getContentView().getWidth() / 2f) {
arrow.setImageResource(R.drawable.ic_tooltip_arrow_up_right);
}
float arrowEnd = arrow.getX() + arrow.getRight();
if (arrowEnd > getContentView().getRight() - DimensionUnit.DP.toPixels(20)) {
shapeableBubbleBackground.setShapeAppearanceModel(shapeAppearanceModel.setTopRightCornerSize(DimensionUnit.DP.toPixels(9f)).build());
bubble.setBackground(shapeableBubbleBackground);
} else if (arrowEnd < DimensionUnit.DP.toPixels(20)) {
shapeableBubbleBackground.setShapeAppearanceModel(shapeAppearanceModel.setTopLeftCornerSize(DimensionUnit.DP.toPixels(9f)).build());
bubble.setBackground(shapeableBubbleBackground);
}
});
showAsDropDown(anchor, xoffset, yoffset);
}

9
app/src/main/res/drawable/ic_tooltip_arrow_up.xml
View file

@ -1,9 +0,0 @@
<vector xmlns:android="http://schemas.android.com/apk/res/android"
android:width="20dp"
android:height="12dp"
android:viewportWidth="20"
android:viewportHeight="12">
<path
android:pathData="M10,3L19,12H1L10,3Z"
android:fillColor="#000000"/>
</vector>

9
app/src/main/res/drawable/ic_tooltip_arrow_up_left.xml Normal file
View file

@ -0,0 +1,9 @@
<vector xmlns:android="http://schemas.android.com/apk/res/android"
android:width="24dp"
android:height="24dp"
android:viewportWidth="24"
android:viewportHeight="24">
<path
android:pathData="M4.231,13.095C3.437,13.818 2.643,14.54 1.975,15.374L1.939,15.419C0.725,16.953 0,18.892 0,21L0,24H24V12H23.928L14.5,3L5.795,11.603C5.299,12.123 4.765,12.609 4.231,13.095Z"
android:fillColor="#000000"/>
</vector>

9
app/src/main/res/drawable/ic_tooltip_arrow_up_right.xml Normal file
View file

@ -0,0 +1,9 @@
<vector xmlns:android="http://schemas.android.com/apk/res/android"
android:width="24dp"
android:height="24dp"
android:viewportWidth="24"
android:viewportHeight="24">
<path
android:pathData="M19.769,13.095C20.563,13.818 21.357,14.54 22.025,15.374L22.061,15.419C23.275,16.953 24,18.892 24,21L24,24H0V12H0.072L9.5,3L18.205,11.603C18.701,12.123 19.235,12.609 19.769,13.095Z"
android:fillColor="#000000"/>
</vector>

20
app/src/main/res/layout/tooltip.xml
View file

@ -15,7 +15,7 @@
android:layout_height="20dp"
android:importantForAccessibility="no"
android:scaleType="fitXY"
android:visibility="invisible"
android:visibility="gone"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:srcCompat="@drawable/ic_tooltip_arrow_left"
@ -24,14 +24,14 @@
<ImageView
android:id="@+id/tooltip_arrow_top"
android:layout_width="20dp"
android:layout_height="12dp"
android:layout_width="24dp"
android:layout_height="24dp"
android:importantForAccessibility="no"
android:scaleType="fitXY"
android:visibility="invisible"
app:layout_constraintStart_toStartOf="@id/tooltip_bubble"
app:layout_constraintTop_toTopOf="parent"
app:srcCompat="@drawable/ic_tooltip_arrow_up"
app:srcCompat="@drawable/ic_tooltip_arrow_up_left"
app:tint="@color/signal_colorPrimaryContainer"
tools:visibility="visible" />
@ -39,15 +39,19 @@
android:id="@+id/tooltip_bubble"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="12dp"
android:background="@drawable/tooltip_background"
android:clipChildren="false"
android:clipToPadding="false"
android:gravity="center_vertical"
android:orientation="horizontal"
android:padding="16dp"
app:layout_constraintEnd_toStartOf="@id/tooltip_arrow_end"
app:layout_constraintStart_toEndOf="@id/tooltip_arrow_start"
app:layout_constraintTop_toBottomOf="@id/tooltip_arrow_top"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintWidth_max="320dp"
app:layout_goneMarginEnd="8dp"
app:layout_goneMarginStart="8dp"
tools:backgroundTint="@color/signal_colorPrimaryContainer">
<ImageView
@ -75,7 +79,7 @@
android:layout_height="12dp"
android:importantForAccessibility="no"
android:scaleType="fitXY"
android:visibility="invisible"
android:visibility="gone"
app:layout_constraintStart_toStartOf="@id/tooltip_bubble"
app:layout_constraintTop_toBottomOf="@id/tooltip_bubble"
app:srcCompat="@drawable/ic_tooltip_arrow_down"
@ -88,8 +92,8 @@
android:layout_height="20dp"
android:importantForAccessibility="no"
android:scaleType="fitXY"
android:visibility="invisible"
app:layout_constraintStart_toEndOf="@id/tooltip_bubble"
android:visibility="gone"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:srcCompat="@drawable/ic_tooltip_arrow_right"
app:tint="@color/signal_colorPrimaryContainer"