Skip to content

Commit

Permalink
feat(youtube/return-youtube-dislike): style for minimum width (#284)
Browse files Browse the repository at this point in the history
  • Loading branch information
LisoUseInAIKyrios committed Jan 10, 2023
1 parent c3eff91 commit a80fab7
Show file tree
Hide file tree
Showing 4 changed files with 71 additions and 41 deletions.
Expand Up @@ -254,9 +254,11 @@ private static boolean updateDislike(AtomicReference<Object> textRef, boolean is
}
replacementSpannable = newSpannableWithDislikes(oldSpannable, voteData);
} else {
String leftSegmentedSeparatorString = ReVancedUtils.isRightToLeftTextLayout() ? "\u200F| " : "| ";
final boolean useCompactLayout = SettingsEnum.RYD_USE_COMPACT_LAYOUT.getBoolean();
// if compact layout, use a "half space" character
String middleSegmentedSeparatorString = useCompactLayout ? "\u2009\u2009" : " • ";

if (oldLikesString.contains(leftSegmentedSeparatorString)) {
if (oldLikesString.contains(middleSegmentedSeparatorString)) {
return false; // dislikes was previously added
}

Expand Down Expand Up @@ -287,58 +289,61 @@ private static boolean updateDislike(AtomicReference<Object> textRef, boolean is
} else {
Spannable likesSpan = newSpanUsingStylingOfAnotherSpan(oldSpannable, oldLikesString);

// left and middle separator
String middleSegmentedSeparatorString = " • ";
Spannable leftSeparatorSpan = newSpanUsingStylingOfAnotherSpan(oldSpannable, leftSegmentedSeparatorString);
// middle separator
Spannable middleSeparatorSpan = newSpanUsingStylingOfAnotherSpan(oldSpannable, middleSegmentedSeparatorString);
final int separatorColor = ThemeHelper.isDarkTheme()
? 0x29AAAAAA // transparent dark gray
: 0xFFD9D9D9; // light gray
addSpanStyling(leftSeparatorSpan, new ForegroundColorSpan(separatorColor));
addSpanStyling(middleSeparatorSpan, new ForegroundColorSpan(separatorColor));
CharacterStyle noAntiAliasingStyle = new CharacterStyle() {
@Override
public void updateDrawState(TextPaint tp) {
tp.setAntiAlias(false); // draw without anti-aliasing, to give a sharper edge
}
};
addSpanStyling(leftSeparatorSpan, noAntiAliasingStyle);
addSpanStyling(middleSeparatorSpan, noAntiAliasingStyle);

Spannable dislikeSpan = newSpannableWithDislikes(oldSpannable, voteData);

// Increase the size of the left separator, so it better matches the stock separator on the right.
// But when using a larger font, the entire span (including the like/dislike text) becomes shifted downward.
// To correct this, use additional spans to move the alignment back upward by a relative amount.
setSegmentedAdjustmentValues();
class RelativeVerticalOffsetSpan extends CharacterStyle {
final float relativeVerticalShiftRatio;
SpannableStringBuilder builder = new SpannableStringBuilder();

RelativeVerticalOffsetSpan(float relativeVerticalShiftRatio) {
this.relativeVerticalShiftRatio = relativeVerticalShiftRatio;
if (!useCompactLayout) {
String leftSegmentedSeparatorString = ReVancedUtils.isRightToLeftTextLayout() ? "\u200F| " : "| ";
Spannable leftSeparatorSpan = newSpanUsingStylingOfAnotherSpan(oldSpannable, leftSegmentedSeparatorString);
addSpanStyling(leftSeparatorSpan, new ForegroundColorSpan(separatorColor));
addSpanStyling(leftSeparatorSpan, noAntiAliasingStyle);

// Use a left separator with a larger font and visually match the stock right separator.
// But with a larger font, the entire span (including the like/dislike text) becomes shifted downward.
// To correct this, use additional spans to move the alignment back upward by a relative amount.
setSegmentedAdjustmentValues();
class RelativeVerticalOffsetSpan extends CharacterStyle {
final float relativeVerticalShiftRatio;

RelativeVerticalOffsetSpan(float relativeVerticalShiftRatio) {
this.relativeVerticalShiftRatio = relativeVerticalShiftRatio;
}

@Override
public void updateDrawState(TextPaint tp) {
tp.baselineShift -= (int) (relativeVerticalShiftRatio * tp.getFontMetrics().top);
}
}
// each section needs it's own Relative span, otherwise alignment is wrong
addSpanStyling(leftSeparatorSpan, new RelativeVerticalOffsetSpan(segmentedLeftSeparatorVerticalShiftRatio));

@Override
public void updateDrawState(TextPaint tp) {
tp.baselineShift -= (int) (relativeVerticalShiftRatio * tp.getFontMetrics().top);
}
}
// shift everything up, to compensate for the vertical movement caused by the font change below
// each section needs it's own Relative span, otherwise alignment is wrong
addSpanStyling(leftSeparatorSpan, new RelativeVerticalOffsetSpan(segmentedLeftSeparatorVerticalShiftRatio));
addSpanStyling(likesSpan, new RelativeVerticalOffsetSpan(segmentedVerticalShiftRatio));
addSpanStyling(middleSeparatorSpan, new RelativeVerticalOffsetSpan(segmentedVerticalShiftRatio));
addSpanStyling(dislikeSpan, new RelativeVerticalOffsetSpan(segmentedVerticalShiftRatio));

addSpanStyling(likesSpan, new RelativeVerticalOffsetSpan(segmentedVerticalShiftRatio));
addSpanStyling(middleSeparatorSpan, new RelativeVerticalOffsetSpan(segmentedVerticalShiftRatio));
addSpanStyling(dislikeSpan, new RelativeVerticalOffsetSpan(segmentedVerticalShiftRatio));
// important: must add size scaling after vertical offset (otherwise alignment gets off)
addSpanStyling(leftSeparatorSpan, new RelativeSizeSpan(segmentedLeftSeparatorFontRatio));
addSpanStyling(leftSeparatorSpan, new ScaleXSpan(segmentedLeftSeparatorHorizontalScaleRatio));
// middle separator does not need resizing

// important: must add size scaling after vertical offset (otherwise alignment gets off)
addSpanStyling(leftSeparatorSpan, new RelativeSizeSpan(segmentedLeftSeparatorFontRatio));
addSpanStyling(leftSeparatorSpan, new ScaleXSpan(segmentedLeftSeparatorHorizontalScaleRatio));
// middle separator does not need resizing
builder.append(leftSeparatorSpan);
}

// put everything together
SpannableStringBuilder builder = new SpannableStringBuilder();
builder.append(leftSeparatorSpan);
builder.append(likesSpan);
builder.append(middleSeparatorSpan);
builder.append(dislikeSpan);
Expand Down Expand Up @@ -369,9 +374,9 @@ private static void setSegmentedAdjustmentValues() {
LogHelper.printDebug(() -> "Device manufacturer: '" + deviceManufacturer + "' SDK: " + deviceSdkVersion);

//
// IMPORTANT: configurations must be with the default system font size setting.
// Important: configurations must be with the device default system font, and default font size.
//
// In generally, a single configuration will give perfect layout for all devices of the same manufacturer
// In general, a single configuration will give perfect layout for all devices of the same manufacturer.
final String configManufacturer;
final int configSdk;
switch (deviceManufacturer) {
Expand All @@ -394,15 +399,14 @@ private static void setSegmentedAdjustmentValues() {
segmentedLeftSeparatorHorizontalScaleRatio = 0.7f;
break;
case "OnePlus":
configManufacturer = "oneplus";
configManufacturer = "OnePlus";
configSdk = 33;
// tested on OnePlus 8 Pro
segmentedLeftSeparatorVerticalShiftRatio = -0.075f;
segmentedVerticalShiftRatio = -0.38f;
segmentedLeftSeparatorFontRatio = 1.87f;
segmentedLeftSeparatorHorizontalScaleRatio = 0.50f;
break;

}

LogHelper.printDebug(() -> "Using layout adjustments based on manufacturer: '" + configManufacturer + "' SDK: " + configSdk);
Expand Down
Expand Up @@ -126,6 +126,7 @@ public enum SettingsEnum {
RYD_USER_ID("ryd_userId", null, SharedPrefHelper.SharedPrefNames.RYD, ReturnType.STRING),
RYD_ENABLED("ryd_enabled", true, SharedPrefHelper.SharedPrefNames.RYD, ReturnType.BOOLEAN),
RYD_SHOW_DISLIKE_PERCENTAGE("ryd_show_dislike_percentage", false, SharedPrefHelper.SharedPrefNames.RYD, ReturnType.BOOLEAN),
RYD_USE_COMPACT_LAYOUT("ryd_use_compact_layout", false, SharedPrefHelper.SharedPrefNames.RYD, ReturnType.BOOLEAN),

// SponsorBlock settings
SB_ENABLED("sb-enabled", true, SharedPrefHelper.SharedPrefNames.SPONSOR_BLOCK, ReturnType.BOOLEAN),
Expand Down
Expand Up @@ -29,18 +29,27 @@ public class ReturnYouTubeDislikeSettingsFragment extends PreferenceFragment {
*/
private SwitchPreference percentagePreference;

/**
* If segmented like/dislike button uses smaller compact layout
*/
private SwitchPreference compactLayoutPreference;

private void updateUIState() {
final boolean rydIsEnabled = SettingsEnum.RYD_ENABLED.getBoolean();
final boolean dislikePercentageEnabled = SettingsEnum.RYD_SHOW_DISLIKE_PERCENTAGE.getBoolean();

enabledPreference.setSummary(rydIsEnabled
? str("revanced_ryd_enable_summary_on")
: str("revanced_ryd_enable_summary_off"));

percentagePreference.setSummary(dislikePercentageEnabled
percentagePreference.setSummary(SettingsEnum.RYD_SHOW_DISLIKE_PERCENTAGE.getBoolean()
? str("revanced_ryd_dislike_percentage_summary_on")
: str("revanced_ryd_dislike_percentage_summary_off"));
percentagePreference.setEnabled(rydIsEnabled);

compactLayoutPreference.setSummary(SettingsEnum.RYD_USE_COMPACT_LAYOUT.getBoolean()
? str("revanced_ryd_compact_layout_summary_on")
: str("revanced_ryd_compact_layout_summary_off"));
compactLayoutPreference.setEnabled(rydIsEnabled);
}

@Override
Expand Down Expand Up @@ -80,6 +89,19 @@ public void onCreate(Bundle savedInstanceState) {
});
preferenceScreen.addPreference(percentagePreference);

compactLayoutPreference = new SwitchPreference(context);
compactLayoutPreference.setKey(SettingsEnum.RYD_USE_COMPACT_LAYOUT.getPath());
compactLayoutPreference.setDefaultValue(SettingsEnum.RYD_USE_COMPACT_LAYOUT.getDefaultValue());
compactLayoutPreference.setChecked(SettingsEnum.RYD_USE_COMPACT_LAYOUT.getBoolean());
compactLayoutPreference.setTitle(str("revanced_ryd_compact_layout_title"));
compactLayoutPreference.setOnPreferenceChangeListener((pref, newValue) -> {
SettingsEnum.RYD_USE_COMPACT_LAYOUT.saveValue((Boolean)newValue);

updateUIState();
return true;
});
preferenceScreen.addPreference(compactLayoutPreference);

updateUIState();


Expand Down
Expand Up @@ -133,12 +133,15 @@ public static boolean isTablet(Context context) {
return context.getResources().getConfiguration().smallestScreenWidthDp >= 600;
}

private static final boolean isRightToLeftTextLayout =
new Bidi(Locale.getDefault().getDisplayLanguage(), Bidi.DIRECTION_DEFAULT_RIGHT_TO_LEFT).isRightToLeft();
private static Boolean isRightToLeftTextLayout;
/**
* If the device language uses right to left text layout (hebrew, arabic, etc)
*/
public static boolean isRightToLeftTextLayout() {
if (isRightToLeftTextLayout == null) {
String displayLanguage = Locale.getDefault().getDisplayLanguage();
isRightToLeftTextLayout = new Bidi(displayLanguage, Bidi.DIRECTION_DEFAULT_LEFT_TO_RIGHT).isRightToLeft();
}
return isRightToLeftTextLayout;
}

Expand Down

0 comments on commit a80fab7

Please sign in to comment.