Use TextInputLayout for the name field in the create/rename mode page
In addition to looking nicer, this fixes two accessibility issues ("no hint when text is entered" and "reason for disabled button is unclear"). This requires a bit of theme merging black magic, because TextInputLayout requires a Theme.AppCompat descendant, which the Settings theme isn't. Fixes: 356398157 Fixes: 370654542 Fixes: 369942776 Test: atest ZenModeEditNamePreferenceControllerTest Flag: android.app.modes_ui Change-Id: I92d8ec044dabc6daed5d755e206120ec7abc143e
This commit is contained in:
@@ -15,23 +15,37 @@
|
|||||||
limitations under the License.
|
limitations under the License.
|
||||||
-->
|
-->
|
||||||
|
|
||||||
|
<!-- Theme.AppCompat.DayNight is in the parent View so that it's merged with the Theme.Settings
|
||||||
|
theme below. An AppCompat descendant (which Theme.Settings isn't is necessary to inflate
|
||||||
|
TextInputLayout. -->
|
||||||
<LinearLayout
|
<LinearLayout
|
||||||
xmlns:android="http://schemas.android.com/apk/res/android"
|
xmlns:android="http://schemas.android.com/apk/res/android"
|
||||||
|
xmlns:app="http://schemas.android.com/apk/res-auto"
|
||||||
android:layout_width="match_parent"
|
android:layout_width="match_parent"
|
||||||
android:layout_height="wrap_content"
|
android:layout_height="wrap_content"
|
||||||
|
android:theme="@style/Theme.AppCompat.DayNight"
|
||||||
android:paddingStart="?android:attr/listPreferredItemPaddingStart"
|
android:paddingStart="?android:attr/listPreferredItemPaddingStart"
|
||||||
android:paddingEnd="?android:attr/listPreferredItemPaddingEnd"
|
android:paddingEnd="?android:attr/listPreferredItemPaddingEnd">
|
||||||
android:paddingBottom="8dp">
|
|
||||||
|
|
||||||
<EditText
|
<com.google.android.material.textfield.TextInputLayout
|
||||||
|
android:id="@+id/edit_input_layout"
|
||||||
android:layout_width="match_parent"
|
android:layout_width="match_parent"
|
||||||
android:layout_height="wrap_content"
|
android:layout_height="wrap_content"
|
||||||
android:id="@android:id/edit"
|
android:theme="@style/Theme.Settings"
|
||||||
android:minHeight="48dp"
|
style="?attr/textInputFilledStyle"
|
||||||
android:maxLines="1"
|
app:endIconMode="clear_text"
|
||||||
android:inputType="text|textCapSentences"
|
app:errorEnabled="true"
|
||||||
android:imeOptions="actionDone"
|
android:hint="@string/zen_mode_edit_name_hint">
|
||||||
android:selectAllOnFocus="true"
|
|
||||||
android:hint="@string/zen_mode_edit_name_hint" />
|
<com.google.android.material.textfield.TextInputEditText
|
||||||
|
android:id="@android:id/edit"
|
||||||
|
android:layout_width="match_parent"
|
||||||
|
android:layout_height="wrap_content"
|
||||||
|
android:maxLines="1"
|
||||||
|
android:inputType="text|textCapSentences"
|
||||||
|
android:imeOptions="actionDone"
|
||||||
|
android:selectAllOnFocus="true" />
|
||||||
|
|
||||||
|
</com.google.android.material.textfield.TextInputLayout>
|
||||||
|
|
||||||
</LinearLayout>
|
</LinearLayout>
|
@@ -9607,6 +9607,9 @@
|
|||||||
<!-- Modes: Hint for the EditText for editing a mode's name [CHAR LIMIT=30] -->
|
<!-- Modes: Hint for the EditText for editing a mode's name [CHAR LIMIT=30] -->
|
||||||
<string name="zen_mode_edit_name_hint">Mode name</string>
|
<string name="zen_mode_edit_name_hint">Mode name</string>
|
||||||
|
|
||||||
|
<!-- Modes: Error message when editing a mode's name and the name is empty [CHAR LIMIT=40] -->
|
||||||
|
<string name="zen_mode_edit_name_empty_error">Mode name cannot be empty</string>
|
||||||
|
|
||||||
<!-- Modes: Text shown above the list of icons in the mode editor. [CHAR LIMIT=40] -->
|
<!-- Modes: Text shown above the list of icons in the mode editor. [CHAR LIMIT=40] -->
|
||||||
<string name="zen_mode_edit_choose_icon_title">Choose an icon</string>
|
<string name="zen_mode_edit_choose_icon_title">Choose an icon</string>
|
||||||
|
|
||||||
|
@@ -73,6 +73,9 @@
|
|||||||
<item name="notification_importance_button_background_color_selected">?androidprv:attr/materialColorSecondaryContainer</item>
|
<item name="notification_importance_button_background_color_selected">?androidprv:attr/materialColorSecondaryContainer</item>
|
||||||
<item name="notification_importance_button_border_color_selected">?androidprv:attr/materialColorOnSecondaryContainer</item>
|
<item name="notification_importance_button_border_color_selected">?androidprv:attr/materialColorOnSecondaryContainer</item>
|
||||||
<item name="notification_importance_button_foreground_color_selected">?androidprv:attr/materialColorOnSecondaryContainer</item>
|
<item name="notification_importance_button_foreground_color_selected">?androidprv:attr/materialColorOnSecondaryContainer</item>
|
||||||
|
|
||||||
|
<!-- For AppCompat widgets, e.g. TextInputLayout -->
|
||||||
|
<item name="colorAccent">?android:attr/colorAccent</item>
|
||||||
</style>
|
</style>
|
||||||
|
|
||||||
<!-- Variant of the settings theme with no action bar. -->
|
<!-- Variant of the settings theme with no action bar. -->
|
||||||
|
@@ -17,9 +17,11 @@
|
|||||||
package com.android.settings.notification.modes;
|
package com.android.settings.notification.modes;
|
||||||
|
|
||||||
import static com.google.common.base.Preconditions.checkNotNull;
|
import static com.google.common.base.Preconditions.checkNotNull;
|
||||||
|
import static com.google.common.base.Preconditions.checkState;
|
||||||
|
|
||||||
import android.content.Context;
|
import android.content.Context;
|
||||||
import android.text.Editable;
|
import android.text.Editable;
|
||||||
|
import android.text.TextUtils;
|
||||||
import android.text.TextWatcher;
|
import android.text.TextWatcher;
|
||||||
import android.widget.EditText;
|
import android.widget.EditText;
|
||||||
|
|
||||||
@@ -28,14 +30,18 @@ import androidx.annotation.Nullable;
|
|||||||
import androidx.preference.Preference;
|
import androidx.preference.Preference;
|
||||||
import androidx.preference.PreferenceScreen;
|
import androidx.preference.PreferenceScreen;
|
||||||
|
|
||||||
|
import com.android.settings.R;
|
||||||
import com.android.settingslib.notification.modes.ZenMode;
|
import com.android.settingslib.notification.modes.ZenMode;
|
||||||
import com.android.settingslib.widget.LayoutPreference;
|
import com.android.settingslib.widget.LayoutPreference;
|
||||||
|
|
||||||
|
import com.google.android.material.textfield.TextInputLayout;
|
||||||
|
|
||||||
import java.util.function.Consumer;
|
import java.util.function.Consumer;
|
||||||
|
|
||||||
class ZenModeEditNamePreferenceController extends AbstractZenModePreferenceController {
|
class ZenModeEditNamePreferenceController extends AbstractZenModePreferenceController {
|
||||||
|
|
||||||
private final Consumer<String> mModeNameSetter;
|
private final Consumer<String> mModeNameSetter;
|
||||||
|
@Nullable private TextInputLayout mInputLayout;
|
||||||
@Nullable private EditText mEditText;
|
@Nullable private EditText mEditText;
|
||||||
private boolean mIsSettingText;
|
private boolean mIsSettingText;
|
||||||
|
|
||||||
@@ -50,7 +56,8 @@ class ZenModeEditNamePreferenceController extends AbstractZenModePreferenceContr
|
|||||||
super.displayPreference(screen);
|
super.displayPreference(screen);
|
||||||
if (mEditText == null) {
|
if (mEditText == null) {
|
||||||
LayoutPreference pref = checkNotNull(screen.findPreference(getPreferenceKey()));
|
LayoutPreference pref = checkNotNull(screen.findPreference(getPreferenceKey()));
|
||||||
mEditText = pref.findViewById(android.R.id.edit);
|
mInputLayout = checkNotNull(pref.findViewById(R.id.edit_input_layout));
|
||||||
|
mEditText = checkNotNull(pref.findViewById(android.R.id.edit));
|
||||||
|
|
||||||
mEditText.addTextChangedListener(new TextWatcher() {
|
mEditText.addTextChangedListener(new TextWatcher() {
|
||||||
@Override
|
@Override
|
||||||
@@ -61,9 +68,11 @@ class ZenModeEditNamePreferenceController extends AbstractZenModePreferenceContr
|
|||||||
|
|
||||||
@Override
|
@Override
|
||||||
public void afterTextChanged(Editable s) {
|
public void afterTextChanged(Editable s) {
|
||||||
if (!mIsSettingText) {
|
if (mIsSettingText) {
|
||||||
mModeNameSetter.accept(s.toString());
|
return;
|
||||||
}
|
}
|
||||||
|
mModeNameSetter.accept(s.toString());
|
||||||
|
updateErrorState(s.toString());
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
@@ -79,9 +88,20 @@ class ZenModeEditNamePreferenceController extends AbstractZenModePreferenceContr
|
|||||||
if (!modeName.equals(currentText)) {
|
if (!modeName.equals(currentText)) {
|
||||||
mEditText.setText(modeName);
|
mEditText.setText(modeName);
|
||||||
}
|
}
|
||||||
|
updateErrorState(modeName);
|
||||||
} finally {
|
} finally {
|
||||||
mIsSettingText = false;
|
mIsSettingText = false;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
private void updateErrorState(String currentName) {
|
||||||
|
checkState(mInputLayout != null);
|
||||||
|
if (TextUtils.isEmpty(currentName)) {
|
||||||
|
mInputLayout.setError(
|
||||||
|
mContext.getString(R.string.zen_mode_edit_name_empty_error));
|
||||||
|
} else {
|
||||||
|
mInputLayout.setError(null);
|
||||||
|
}
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
@@ -35,6 +35,8 @@ import com.android.settingslib.notification.modes.TestModeBuilder;
|
|||||||
import com.android.settingslib.notification.modes.ZenMode;
|
import com.android.settingslib.notification.modes.ZenMode;
|
||||||
import com.android.settingslib.widget.LayoutPreference;
|
import com.android.settingslib.widget.LayoutPreference;
|
||||||
|
|
||||||
|
import com.google.android.material.textfield.TextInputLayout;
|
||||||
|
|
||||||
import org.junit.Before;
|
import org.junit.Before;
|
||||||
import org.junit.Rule;
|
import org.junit.Rule;
|
||||||
import org.junit.Test;
|
import org.junit.Test;
|
||||||
@@ -55,6 +57,7 @@ public class ZenModeEditNamePreferenceControllerTest {
|
|||||||
|
|
||||||
private ZenModeEditNamePreferenceController mController;
|
private ZenModeEditNamePreferenceController mController;
|
||||||
private LayoutPreference mPreference;
|
private LayoutPreference mPreference;
|
||||||
|
private TextInputLayout mTextInputLayout;
|
||||||
private EditText mEditText;
|
private EditText mEditText;
|
||||||
@Mock private Consumer<String> mNameSetter;
|
@Mock private Consumer<String> mNameSetter;
|
||||||
|
|
||||||
@@ -64,12 +67,15 @@ public class ZenModeEditNamePreferenceControllerTest {
|
|||||||
|
|
||||||
Context context = RuntimeEnvironment.application;
|
Context context = RuntimeEnvironment.application;
|
||||||
PreferenceManager preferenceManager = new PreferenceManager(context);
|
PreferenceManager preferenceManager = new PreferenceManager(context);
|
||||||
|
|
||||||
|
// Inflation is a test in itself, because it will crash if the Theme isn't set correctly.
|
||||||
PreferenceScreen preferenceScreen = preferenceManager.inflateFromResource(context,
|
PreferenceScreen preferenceScreen = preferenceManager.inflateFromResource(context,
|
||||||
R.xml.modes_edit_name_icon, null);
|
R.xml.modes_edit_name_icon, null);
|
||||||
mPreference = preferenceScreen.findPreference("name");
|
mPreference = preferenceScreen.findPreference("name");
|
||||||
|
|
||||||
mController = new ZenModeEditNamePreferenceController(context, "name", mNameSetter);
|
mController = new ZenModeEditNamePreferenceController(context, "name", mNameSetter);
|
||||||
mController.displayPreference(preferenceScreen);
|
mController.displayPreference(preferenceScreen);
|
||||||
|
mTextInputLayout = mPreference.findViewById(R.id.edit_input_layout);
|
||||||
mEditText = mPreference.findViewById(android.R.id.edit);
|
mEditText = mPreference.findViewById(android.R.id.edit);
|
||||||
assertThat(mEditText).isNotNull();
|
assertThat(mEditText).isNotNull();
|
||||||
}
|
}
|
||||||
@@ -88,11 +94,24 @@ public class ZenModeEditNamePreferenceControllerTest {
|
|||||||
public void onEditText_callsNameSetter() {
|
public void onEditText_callsNameSetter() {
|
||||||
ZenMode mode = new TestModeBuilder().setName("A fancy name").build();
|
ZenMode mode = new TestModeBuilder().setName("A fancy name").build();
|
||||||
mController.updateState(mPreference, mode);
|
mController.updateState(mPreference, mode);
|
||||||
EditText editText = mPreference.findViewById(android.R.id.edit);
|
|
||||||
|
|
||||||
editText.setText("An even fancier name");
|
mEditText.setText("An even fancier name");
|
||||||
|
|
||||||
verify(mNameSetter).accept("An even fancier name");
|
verify(mNameSetter).accept("An even fancier name");
|
||||||
verifyNoMoreInteractions(mNameSetter);
|
verifyNoMoreInteractions(mNameSetter);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@Test
|
||||||
|
public void onEditText_emptyText_showsError() {
|
||||||
|
ZenMode mode = new TestModeBuilder().setName("Default name").build();
|
||||||
|
mController.updateState(mPreference, mode);
|
||||||
|
|
||||||
|
mEditText.setText("");
|
||||||
|
|
||||||
|
assertThat(mTextInputLayout.getError()).isNotNull();
|
||||||
|
|
||||||
|
mEditText.setText("this is fine");
|
||||||
|
|
||||||
|
assertThat(mTextInputLayout.getError()).isNull();
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
Reference in New Issue
Block a user