Skip to content

Improve toolbar switch button usability #1527

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Draft
wants to merge 1 commit into
base: main
Choose a base branch
from
Draft

Improve toolbar switch button usability #1527

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
10 changes: 7 additions & 3 deletions app/src/main/java/helium314/keyboard/keyboard/internal/KeyboardIconsSet.kt
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -79,6 +79,7 @@ class KeyboardIconsSet private constructor() {
const val NAME_SWITCH_ONEHANDED_KEY = "switch_onehanded_key"
const val NAME_RESIZE_ONEHANDED_KEY = "resize_onehanded_key"
const val NAME_TOOLBAR_KEY = "toolbar_key"
const val NAME_SUGGESTIONS_KEY = "suggestions_key"
const val NAME_BIN = "bin"

// names used in the past, and we can't just delete them because they might still be in use in some layouts
Expand Down Expand Up @@ -119,7 +120,8 @@ class KeyboardIconsSet private constructor() {
NAME_STOP_ONEHANDED_KEY to R.drawable.sym_keyboard_stop_onehanded_holo,
NAME_SWITCH_ONEHANDED_KEY to R.drawable.ic_arrow_left,
NAME_RESIZE_ONEHANDED_KEY to R.drawable.ic_arrow_horizontal,
NAME_TOOLBAR_KEY to R.drawable.ic_arrow_right,
NAME_TOOLBAR_KEY to R.drawable.ic_toolbar,
NAME_SUGGESTIONS_KEY to R.drawable.ic_suggestions,
NAME_BIN to R.drawable.ic_bin,
).apply {
ToolbarKey.entries.forEach {
Expand Down Expand Up @@ -180,7 +182,8 @@ class KeyboardIconsSet private constructor() {
NAME_STOP_ONEHANDED_KEY to R.drawable.sym_keyboard_stop_onehanded_lxx,
NAME_SWITCH_ONEHANDED_KEY to R.drawable.ic_arrow_left,
NAME_RESIZE_ONEHANDED_KEY to R.drawable.ic_arrow_horizontal,
NAME_TOOLBAR_KEY to R.drawable.ic_arrow_right,
NAME_TOOLBAR_KEY to R.drawable.ic_toolbar,
NAME_SUGGESTIONS_KEY to R.drawable.ic_suggestions,
NAME_BIN to R.drawable.ic_bin,
).apply {
ToolbarKey.entries.forEach {
Expand Down Expand Up @@ -241,7 +244,8 @@ class KeyboardIconsSet private constructor() {
NAME_STOP_ONEHANDED_KEY to R.drawable.sym_keyboard_stop_onehanded_rounded,
NAME_SWITCH_ONEHANDED_KEY to R.drawable.ic_arrow_left_rounded,
NAME_RESIZE_ONEHANDED_KEY to R.drawable.ic_arrow_horizontal_rounded,
NAME_TOOLBAR_KEY to R.drawable.ic_arrow_right_rounded,
NAME_TOOLBAR_KEY to R.drawable.ic_toolbar,
NAME_SUGGESTIONS_KEY to R.drawable.ic_suggestions,
NAME_BIN to R.drawable.ic_bin_rounded,
).apply {
ToolbarKey.entries.forEach {
Expand Down
33 changes: 20 additions & 13 deletions app/src/main/java/helium314/keyboard/latin/suggestions/SuggestionStripView.java
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -85,7 +85,8 @@ public interface Listener {
private final ViewGroup mSuggestionsStrip;
private final ImageButton mToolbarExpandKey;
private final Drawable mIncognitoIcon;
private final Drawable mToolbarArrowIcon;
private final Drawable mToolbarIcon;
private final Drawable mSuggestionsIcon;
private final Drawable mBinIcon;
private final ViewGroup mToolbar;
private final View mToolbarContainer;
Expand All @@ -105,7 +106,6 @@ public interface Listener {
Listener mListener;
private SuggestedWords mSuggestedWords = SuggestedWords.getEmptyInstance();
private int mStartIndexOfMoreSuggestions;
private int mRtl = 1; // 1 if LTR, -1 if RTL

private final SuggestionStripLayoutHelper mLayoutHelper;
private final StripVisibilityGroup mStripVisibilityGroup;
Expand Down Expand Up @@ -188,7 +188,8 @@ public SuggestionStripView(final Context context, final AttributeSet attrs, fina

final KeyboardIconsSet iconsSet = KeyboardIconsSet.Companion.getInstance();
mIncognitoIcon = iconsSet.getNewDrawable(ToolbarKey.INCOGNITO.name(), context);
mToolbarArrowIcon = iconsSet.getNewDrawable(KeyboardIconsSet.NAME_TOOLBAR_KEY, context);
mToolbarIcon = iconsSet.getNewDrawable(KeyboardIconsSet.NAME_TOOLBAR_KEY, context);
mSuggestionsIcon = iconsSet.getNewDrawable(KeyboardIconsSet.NAME_SUGGESTIONS_KEY, context);
mBinIcon = iconsSet.getNewDrawable(KeyboardIconsSet.NAME_BIN, context);

final LinearLayout.LayoutParams toolbarKeyLayoutParams = new LinearLayout.LayoutParams(
Expand All @@ -204,20 +205,17 @@ public SuggestionStripView(final Context context, final AttributeSet attrs, fina

final int toolbarHeight = Math.min(mToolbarExpandKey.getLayoutParams().height, (int) getResources().getDimension(R.dimen.config_suggestions_strip_height));
mToolbarExpandKey.getLayoutParams().height = toolbarHeight;
mToolbarExpandKey.getLayoutParams().width = toolbarHeight; // we want it square
mToolbarExpandKey.getLayoutParams().width = toolbarHeight << 1;
colors.setBackground(mToolbarExpandKey, ColorType.STRIP_BACKGROUND);
mDefaultBackground = mToolbarExpandKey.getBackground();
mEnabledToolKeyBackground.setColors(new int[] {colors.get(ColorType.TOOL_BAR_KEY_ENABLED_BACKGROUND) | 0xFF000000, Color.TRANSPARENT}); // ignore alpha on accent color
mEnabledToolKeyBackground.setGradientType(GradientDrawable.RADIAL_GRADIENT);
mEnabledToolKeyBackground.setGradientRadius(mToolbarExpandKey.getLayoutParams().height / 2f); // nothing else has a usable height at this state

mToolbarExpandKey.setOnClickListener(this);
mToolbarExpandKey.setImageDrawable(Settings.getValues().mIncognitoModeEnabled ? mIncognitoIcon : mToolbarArrowIcon);
colors.setColor(mToolbarExpandKey, ColorType.TOOL_BAR_EXPAND_KEY);
mToolbarExpandKey.setBackground(new ShapeDrawable(new OvalShape())); // ShapeDrawable color is black, need src_atop filter
mToolbarExpandKey.getBackground().setColorFilter(colors.get(ColorType.TOOL_BAR_EXPAND_KEY_BACKGROUND), PorterDuff.Mode.SRC_ATOP);
mToolbarExpandKey.getLayoutParams().height *= 0.82; // shrink the whole key a little (drawable not affected)
mToolbarExpandKey.getLayoutParams().width *= 0.82;
updateExpandButton();

for (final ToolbarKey pinnedKey : ToolbarUtilsKt.getPinnedToolbarKeys(prefs)) {
final ImageButton button = createToolbarKey(context, iconsSet, pinnedKey);
Expand Down Expand Up @@ -254,8 +252,7 @@ private void updateKeys() {
final View pinnedVoiceKey = mPinnedKeys.findViewWithTag(ToolbarKey.VOICE);
if (pinnedVoiceKey != null)
pinnedVoiceKey.setVisibility(currentSettingsValues.mShowsVoiceInputKey ? VISIBLE : GONE);
mToolbarExpandKey.setImageDrawable(currentSettingsValues.mIncognitoModeEnabled ? mIncognitoIcon : mToolbarArrowIcon);
mToolbarExpandKey.setScaleX((mToolbarContainer.getVisibility() != VISIBLE ? 1f : -1f) * mRtl);
updateExpandButton();

// hide pinned keys if device is locked, and avoid expanding toolbar
final KeyguardManager km = (KeyguardManager) getContext().getSystemService(Context.KEYGUARD_SERVICE);
Expand All @@ -273,18 +270,17 @@ public void setRtl(final boolean isRtlLanguage) {
layoutDirection = View.LAYOUT_DIRECTION_LOCALE;
else{
layoutDirection = isRtlLanguage ? View.LAYOUT_DIRECTION_RTL : View.LAYOUT_DIRECTION_LTR;
mRtl = isRtlLanguage ? -1 : 1;
}
mStripVisibilityGroup.setLayoutDirection(layoutDirection);
}

public void setSuggestions(final SuggestedWords suggestedWords, final boolean isRtlLanguage) {
clear();
setRtl(isRtlLanguage);
updateKeys();
mSuggestedWords = suggestedWords;
mStartIndexOfMoreSuggestions = mLayoutHelper.layoutAndReturnStartIndexOfMoreSuggestions(
getContext(), mSuggestedWords, mSuggestionsStrip, this);
updateKeys();
}

public void setExternalSuggestionView(final View view) {
Expand Down Expand Up @@ -707,7 +703,18 @@ public void setToolbarVisibility(final boolean visible) {
mSuggestionsStrip.setVisibility(VISIBLE);
mPinnedKeys.setVisibility(VISIBLE);
}
mToolbarExpandKey.setScaleX((visible && !locked ? -1f : 1f) * mRtl);
updateExpandButton();
}

private void updateExpandButton() {
var settingsValues = Settings.getValues();
mToolbarExpandKey.setImageDrawable(settingsValues.mIncognitoModeEnabled ? mIncognitoIcon
: mToolbarContainer.getVisibility() != VISIBLE? mToolbarIcon : mSuggestionsIcon);
var highlight = ! settingsValues.mIncognitoModeEnabled && mToolbarContainer.getVisibility() == VISIBLE
&& ! mSuggestedWords.isEmpty();
mToolbarExpandKey.getBackground().setColorFilter(settingsValues.mColors.get(
highlight? ColorType.TOOL_BAR_KEY_ENABLED_BACKGROUND :
ColorType.TOOL_BAR_EXPAND_KEY_BACKGROUND), PorterDuff.Mode.SRC_ATOP);
}

private void addKeyToPinnedKeys(final ToolbarKey pinnedKey) {
Expand Down
13 changes: 13 additions & 0 deletions app/src/main/res/drawable/ic_suggestions.xml
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,13 @@
<!--
SPDX-FileCopyrightText: Material Design Authors / Google LLC
SPDX-License-Identifier: Apache-2.0
-->
<vector xmlns:android="http://schemas.android.com/apk/res/android"
android:width="32dp"
android:height="32dp"
android:viewportWidth="960"
android:viewportHeight="960">
<path
android:fillColor="#FFF"
android:pathData="M564,880L394,710L450,654L564,768L790,542L846,598L564,880ZM120,640L314,120L408,120L602,640L510,640L464,508L254,508L208,640L120,640ZM282,432L438,432L362,216L358,216L282,432Z"/>
</vector>
8 changes: 8 additions & 0 deletions app/src/main/res/drawable/ic_toolbar.xml
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,8 @@
<vector xmlns:android="http://schemas.android.com/apk/res/android" android:height="24dp"
android:viewportHeight="24" android:viewportWidth="24" android:width="24dp"
android:fillColor="#FFF">
<path android:fillColor="@android:color/white" android:pathData="M21.67,18.17l-5.3,-5.3h-0.99l-2.54,2.54v0.99l5.3,5.3c0.39,0.39 1.02,0.39 1.41,0l2.12,-2.12C22.06,19.2 22.06,18.56 21.67,18.17z"/>

<path android:fillColor="@android:color/white" android:pathData="M17.34,10.19l1.41,-1.41l2.12,2.12c1.17,-1.17 1.17,-3.07 0,-4.24l-3.54,-3.54l-1.41,1.41V1.71L15.22,1l-3.54,3.54l0.71,0.71h2.83l-1.41,1.41l1.06,1.06l-2.89,2.89L7.85,6.48V5.06L4.83,2.04L2,4.87l3.03,3.03h1.41l4.13,4.13l-0.85,0.85H7.6l-5.3,5.3c-0.39,0.39 -0.39,1.02 0,1.41l2.12,2.12c0.39,0.39 1.02,0.39 1.41,0l5.3,-5.3v-2.12l5.15,-5.15L17.34,10.19z"/>

</vector>
Loading