Android/frameworks_base
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Style panel with Material designs (3/n)

Browse Source 
The following components are styled to follow Material designs in this
modification:
1. All image buttons for adjusting magnifier window size
   - The background for image buttons
   - The tint for image buttons
   The icon button will get a background color when it is selected and
   the background color will be cleared when "Edit mode" for the window
   is triggered.

Bug: 257272333
Test: manual - attach screenshots with the bug
Test: atest
SystemUITests:com.android.systemui.accessibility.WindowMagnificationSettingsTest
Change-Id: I300f88be6fb9cc9e4c4bc4eaa7f5bf0e2c124d58
This commit is contained in:
chihtinglo
2022-12-20 17:05:08 +08:00
parent 81fff93ba9
commit db1be9d957
9 changed files with 203 additions and 69 deletions
Download Patch File Download Diff File Expand all files Collapse all files

22
packages/SystemUI/res/color/accessibility_magnification_image_button_background.xml Normal file
View File

@@ -0,0 +1,22 @@
<?xml version="1.0" encoding="utf-8"?>
<!--
~ Copyright (C) 2023 The Android Open Source Project
~
~ Licensed under the Apache License, Version 2.0 (the "License");
~ you may not use this file except in compliance with the License.
~ You may obtain a copy of the License at
~
~ http://www.apache.org/licenses/LICENSE-2.0
~
~ Unless required by applicable law or agreed to in writing, software
~ distributed under the License is distributed on an "AS IS" BASIS,
~ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
~ See the License for the specific language governing permissions and
~ limitations under the License.
-->
<selector xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:androidprv="http://schemas.android.com/apk/prv/res/android">
<item android:state_selected="true"
android:color="?androidprv:attr/colorAccent" />
<item android:color="?androidprv:attr/colorSurfaceVariant" />
</selector>

22
packages/SystemUI/res/color/accessibility_magnification_image_button_tint.xml Normal file
View File

@@ -0,0 +1,22 @@
<?xml version="1.0" encoding="utf-8"?>
<!--
~ Copyright (C) 2023 The Android Open Source Project
~
~ Licensed under the Apache License, Version 2.0 (the "License");
~ you may not use this file except in compliance with the License.
~ You may obtain a copy of the License at
~
~ http://www.apache.org/licenses/LICENSE-2.0
~
~ Unless required by applicable law or agreed to in writing, software
~ distributed under the License is distributed on an "AS IS" BASIS,
~ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
~ See the License for the specific language governing permissions and
~ limitations under the License.
-->
<selector xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:androidprv="http://schemas.android.com/apk/prv/res/android">
<item android:state_selected="true"
android:color="?androidprv:attr/textColorPrimaryInverse" />
<item android:color="?androidprv:attr/textColorPrimary" />
</selector>

30
packages/SystemUI/res/drawable/accessibility_magnification_setting_view_image_btn_bg.xml Normal file
View File

@@ -0,0 +1,30 @@
<?xml version="1.0" encoding="utf-8"?><!--
Copyright (C) 2023 The Android Open Source Project
Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at
http://www.apache.org/licenses/LICENSE-2.0
Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
-->
<ripple xmlns:android="http://schemas.android.com/apk/res/android"
android:color="?android:attr/colorControlHighlight">
<item android:id="@android:id/mask">
<shape android:shape="rectangle">
<corners android:radius="@dimen/magnification_setting_image_button_corner_radius" />
<solid android:color="@color/accessibility_magnification_image_button_background" />
</shape>
</item>
<item android:id="@android:id/background">
<shape android:shape="rectangle">
<corners android:radius="@dimen/magnification_setting_image_button_corner_radius" />
<solid android:color="@color/accessibility_magnification_image_button_background" />
</shape>
</item>
</ripple>

50
packages/SystemUI/res/drawable/accessibility_magnification_setting_view_btn_bg.xml → packages/SystemUI/res/drawable/accessibility_magnification_setting_view_image_btn_layout_bg.xml
View File

@@ -1,28 +1,22 @@
<?xml version="1.0" encoding="utf-8"?>
<!--
Copyright (C) 2022 The Android Open Source Project
Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at
http://www.apache.org/licenses/LICENSE-2.0
Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
-->
<ripple xmlns:android="http://schemas.android.com/apk/res/android"
android:color="?android:attr/colorControlHighlight">
<item android:id="@android:id/mask">
<shape android:shape="oval">
<solid android:color="@color/accessibility_magnifier_bg" />
<size
android:width="56dp"
android:height="56dp"/>
<corners android:radius="2dp"/>
</shape>
</item>
</ripple>
<?xml version="1.0" encoding="utf-8"?>
<!--
Copyright (C) 2022 The Android Open Source Project
Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at
http://www.apache.org/licenses/LICENSE-2.0
Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
-->
<shape xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:androidprv="http://schemas.android.com/apk/prv/res/android"
android:shape="rectangle">
<solid android:color="?androidprv:attr/colorSurfaceVariant" />
<corners android:radius="@dimen/magnification_setting_image_button_background_corner_radius" />
</shape>

24
packages/SystemUI/res/drawable/ic_open_in_new_fullscreen.xml → packages/SystemUI/res/drawable/ic_open_in_full.xml
View File

@@ -1,5 +1,5 @@
<!--
~ Copyright (C) 2020 The Android Open Source Project
~ Copyright (C) 2023 The Android Open Source Project
~
~ Licensed under the Apache License, Version 2.0 (the "License");
~ you may not use this file except in compliance with the License.
@@ -14,18 +14,12 @@
~ limitations under the License.
-->
<vector xmlns:android="http://schemas.android.com/apk/res/android"
android:width="36dp"
android:height="36dp"
android:viewportWidth="24"
android:viewportHeight="24">
<group>
<clip-path
android:pathData="M0,0h24v24h-24z"/>
<path
android:pathData="M11,6.05V8.05H14.59L8,14.64V11.05H6V18.05H13V16.05H9.41L16,9.46V13.05H18V6.05H11Z"
android:fillColor="#000000"/>
<path
android:pathData="M20,4.05V20.05H4V4.05H20ZM22,2.05H2V22.05H22V2.05Z"
android:fillColor="#000000"/>
</group>
android:width="48dp"
android:height="48dp"
android:viewportWidth="48"
android:viewportHeight="48"
android:tint="?attr/colorControlNormal">
<path
android:fillColor="@android:color/white"
android:pathData="M6,42V27H9V36.9L36.9,9H27V6H42V21H39V11.1L11.1,39H21V42Z"/>
</vector>

63
packages/SystemUI/res/layout/window_magnification_settings_view.xml
View File

@@ -46,55 +46,72 @@
</LinearLayout>
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="@drawable/accessibility_magnification_setting_view_image_btn_layout_bg"
android:layout_width="@dimen/magnification_setting_image_button_background_width"
android:layout_height="@dimen/magnification_setting_image_button_height"
android:orientation="horizontal">
<ImageButton
android:id="@+id/magnifier_small_button"
android:layout_width="0dp"
android:layout_height="56dp"
android:scaleType="center"
android:layout_height="@dimen/magnification_setting_image_button_height"
android:layout_weight="1"
android:background="@drawable/accessibility_magnification_setting_view_btn_bg"
android:padding="@dimen/magnification_switch_button_padding"
android:scaleType="fitCenter"
android:background="@drawable/accessibility_magnification_setting_view_image_btn_bg"
android:paddingLeft="@dimen/magnification_setting_image_button_padding_horizontal"
android:paddingRight="@dimen/magnification_setting_image_button_padding_horizontal"
android:paddingTop="@dimen/magnification_setting_image_button_padding_vertical"
android:paddingBottom="@dimen/magnification_setting_image_button_padding_vertical"
android:src="@drawable/ic_magnification_menu_small"
android:tint="@color/accessibility_magnifier_icon_color"
android:tint="@color/accessibility_magnification_image_button_tint"
android:tintMode="src_atop" />
<ImageButton
android:id="@+id/magnifier_medium_button"
android:layout_width="0dp"
android:layout_height="56dp"
android:scaleType="center"
android:layout_height="@dimen/magnification_setting_image_button_height"
android:layout_weight="1"
android:background="@drawable/accessibility_magnification_setting_view_btn_bg"
android:padding="@dimen/magnification_switch_button_padding"
android:scaleType="fitCenter"
android:background="@drawable/accessibility_magnification_setting_view_image_btn_bg"
android:paddingLeft="@dimen/magnification_setting_image_button_padding_horizontal"
android:paddingRight="@dimen/magnification_setting_image_button_padding_horizontal"
android:paddingTop="@dimen/magnification_setting_image_button_padding_vertical"
android:paddingBottom="@dimen/magnification_setting_image_button_padding_vertical"
android:src="@drawable/ic_magnification_menu_medium"
android:tint="@color/accessibility_magnifier_icon_color"
android:tint="@color/accessibility_magnification_image_button_tint"
android:tintMode="src_atop" />
<ImageButton
android:id="@+id/magnifier_large_button"
android:layout_width="0dp"
android:layout_height="56dp"
android:scaleType="center"
android:layout_height="@dimen/magnification_setting_image_button_height"
android:layout_weight="1"
android:background="@drawable/accessibility_magnification_setting_view_btn_bg"
android:padding="@dimen/magnification_switch_button_padding"
android:scaleType="fitCenter"
android:background="@drawable/accessibility_magnification_setting_view_image_btn_bg"
android:paddingLeft="@dimen/magnification_setting_image_button_padding_horizontal"
android:paddingRight="@dimen/magnification_setting_image_button_padding_horizontal"
android:paddingTop="@dimen/magnification_setting_image_button_padding_vertical"
android:paddingBottom="@dimen/magnification_setting_image_button_padding_vertical"
android:src="@drawable/ic_magnification_menu_large"
android:tint="@color/accessibility_magnifier_icon_color"
android:tint="@color/accessibility_magnification_image_button_tint"
android:tintMode="src_atop" />
<ImageButton
android:id="@+id/magnifier_full_button"
android:layout_width="0dp"
android:layout_height="56dp"
android:scaleType="center"
android:layout_height="@dimen/magnification_setting_image_button_height"
android:layout_weight="1"
android:background="@drawable/accessibility_magnification_setting_view_btn_bg"
android:padding="@dimen/magnification_switch_button_padding"
android:src="@drawable/ic_open_in_new_fullscreen"
android:tint="@color/accessibility_magnifier_icon_color"
android:scaleType="fitCenter"
android:background="@drawable/accessibility_magnification_setting_view_image_btn_bg"
android:paddingLeft
="@dimen/magnification_setting_image_button_open_in_full_padding_horizontal"
android:paddingRight
="@dimen/magnification_setting_image_button_open_in_full_padding_horizontal"
android:paddingTop
="@dimen/magnification_setting_image_button_open_in_full_padding_vertical"
android:paddingBottom
="@dimen/magnification_setting_image_button_open_in_full_padding_vertical"
android:src="@drawable/ic_open_in_full"
android:tint="@color/accessibility_magnification_image_button_tint"
android:tintMode="src_atop" />
</LinearLayout>

8
packages/SystemUI/res/values/dimens.xml
View File

@@ -1121,6 +1121,14 @@
<dimen name="magnification_setting_button_done_corner_radius">100dp</dimen>
<dimen name="magnification_setting_button_done_padding_vertical">10dp</dimen>
<dimen name="magnification_setting_button_done_padding_horizontal">24dp</dimen>
<dimen name="magnification_setting_image_button_height">58dp</dimen>
<dimen name="magnification_setting_image_button_corner_radius">48dp</dimen>
<dimen name="magnification_setting_image_button_background_width">316dp</dimen>
<dimen name="magnification_setting_image_button_background_corner_radius">80dp</dimen>
<dimen name="magnification_setting_image_button_padding_vertical">12dp</dimen>
<dimen name="magnification_setting_image_button_padding_horizontal">24dp</dimen>
<dimen name="magnification_setting_image_button_open_in_full_padding_vertical">16dp</dimen>
<dimen name="magnification_setting_image_button_open_in_full_padding_horizontal">28dp</dimen>
<!-- How far from the right edge of the screen you need to drag the window before the button
repositions to the other side. -->

35
packages/SystemUI/src/com/android/systemui/accessibility/WindowMagnificationSettings.java
View File

@@ -90,6 +90,7 @@ class WindowMagnificationSettings implements MagnificationGestureDetector.OnGest
private Button mDoneButton;
private Button mEditButton;
private ImageButton mChangeModeButton;
private int mLastSelectedButtonIndex = MagnificationSize.NONE;
private boolean mAllowDiagonalScrolling = false;
private static final float A11Y_CHANGE_SCALE_DIFFERENCE = 1.0f;
private static final float A11Y_SCALE_MIN_VALUE = 2.0f;
@@ -124,10 +125,11 @@ class WindowMagnificationSettings implements MagnificationGestureDetector.OnGest
Settings.Secure.ACCESSIBILITY_ALLOW_DIAGONAL_SCROLLING, 0,
UserHandle.USER_CURRENT) == 1;
inflateView();
mParams = createLayoutParams(context);
mWindowInsetChangeRunnable = this::onWindowInsetChanged;
inflateView();
mGestureDetector = new MagnificationGestureDetector(context,
context.getMainThreadHandler(), this);
}
@@ -423,11 +425,14 @@ class WindowMagnificationSettings implements MagnificationGestureDetector.OnGest
mSettingView.setOnApplyWindowInsetsListener((v, insets) -> {
// Adds a pending post check to avoiding redundant calculation because this callback
// is sent frequently when the switch icon window dragged by the users.
if (!mSettingView.getHandler().hasCallbacks(mWindowInsetChangeRunnable)) {
if (mSettingView.isAttachedToWindow()
&& !mSettingView.getHandler().hasCallbacks(mWindowInsetChangeRunnable)) {
mSettingView.getHandler().post(mWindowInsetChangeRunnable);
}
return v.onApplyWindowInsets(insets);
});
updateSelectedButton(mLastSelectedButtonIndex);
}
void onConfigurationChanged(int configDiff) {
@@ -505,11 +510,13 @@ class WindowMagnificationSettings implements MagnificationGestureDetector.OnGest
public void editMagnifierSizeMode(boolean enable) {
setEditMagnifierSizeMode(enable);
updateSelectedButton(MagnificationSize.NONE);
hideSettingPanel();
}
private void setMagnifierSize(@MagnificationSize int index) {
mCallback.onSetMagnifierSize(index);
updateSelectedButton(index);
}
private void toggleDiagonalScrolling() {
@@ -567,4 +574,26 @@ class WindowMagnificationSettings implements MagnificationGestureDetector.OnGest
new Rect(0, 0, mSettingView.getWidth(), mSettingView.getHeight())));
});
}
private void updateSelectedButton(@MagnificationSize int index) {
// Clear the state of last selected button
if (mLastSelectedButtonIndex == MagnificationSize.SMALL) {
mSmallButton.setSelected(false);
} else if (mLastSelectedButtonIndex == MagnificationSize.MEDIUM) {
mMediumButton.setSelected(false);
} else if (mLastSelectedButtonIndex == MagnificationSize.LARGE) {
mLargeButton.setSelected(false);
}
// Set the state for selected button
if (index == MagnificationSize.SMALL) {
mSmallButton.setSelected(true);
} else if (index == MagnificationSize.MEDIUM) {
mMediumButton.setSelected(true);
} else if (index == MagnificationSize.LARGE) {
mLargeButton.setSelected(true);
}
mLastSelectedButtonIndex = index;
}
}

18
packages/SystemUI/tests/src/com/android/systemui/accessibility/WindowMagnificationSettingsTest.java
View File

@@ -16,6 +16,8 @@
package com.android.systemui.accessibility;
import static com.google.common.truth.Truth.assertThat;
import static junit.framework.Assert.assertEquals;
import static junit.framework.Assert.assertNotNull;
@@ -24,6 +26,7 @@ import static org.mockito.Mockito.verify;
import android.annotation.IdRes;
import android.content.Context;
import android.content.pm.ActivityInfo;
import android.provider.Settings;
import android.testing.AndroidTestingRunner;
import android.testing.TestableLooper;
@@ -183,6 +186,21 @@ public class WindowMagnificationSettingsTest extends SysuiTestCase {
verify(mWindowMagnificationSettingsCallback).onSetDiagonalScrolling(!currentCheckedState);
}
@Test
public void onConfigurationChanged_selectedButtonIsStillSelected() {
// Open view
mWindowMagnificationSettings.showSettingPanel();
View magnifierMediumButton = getInternalView(R.id.magnifier_medium_button);
magnifierMediumButton.performClick();
mWindowMagnificationSettings.onConfigurationChanged(ActivityInfo.CONFIG_UI_MODE);
// Since the view is re-inflated after onConfigurationChanged,
// we need to get the view again.
magnifierMediumButton = getInternalView(R.id.magnifier_medium_button);
assertThat(magnifierMediumButton.isSelected()).isTrue();
}
private <T extends View> T getInternalView(@IdRes int idRes) {
T view = mSettingView.findViewById(idRes);
assertNotNull(view);