Merge changes from topic "revert-2-of-window-size-class-and-bouncer-scene-large-screen" into main (7e453989) · Commits · e / os / android_frameworks_base

packages/SystemUI/compose/core/Android.bp

+2 −0

Original line number	Diff line number	Diff line
		@@ -34,7 +34,9 @@ android_library {

		"androidx.compose.runtime_runtime",
		"androidx.compose.material3_material3",
		"androidx.compose.material3_material3-window-size-class",
		"androidx.savedstate_savedstate",
		"androidx.window_window",
		],

		kotlincflags: ["-Xjvm-default=all"],

packages/SystemUI/compose/core/src/com/android/compose/theme/PlatformTheme.kt

+4 −0

Original line number	Diff line number	Diff line
		@@ -29,6 +29,8 @@ import com.android.compose.theme.typography.TypefaceNames
		import com.android.compose.theme.typography.TypefaceTokens
		import com.android.compose.theme.typography.TypographyTokens
		import com.android.compose.theme.typography.platformTypography
		import com.android.compose.windowsizeclass.LocalWindowSizeClass
		import com.android.compose.windowsizeclass.calculateWindowSizeClass

		/** The Material 3 theme that should wrap all Platform Composables. */
		@Composable
		@@ -51,10 +53,12 @@ fun PlatformTheme(
		remember(typefaceNames) {
		platformTypography(TypographyTokens(TypeScaleTokens(TypefaceTokens(typefaceNames))))
		}
		val windowSizeClass = calculateWindowSizeClass()

		MaterialTheme(colorScheme, typography = typography) {
		CompositionLocalProvider(
		LocalAndroidColorScheme provides androidColorScheme,
		LocalWindowSizeClass provides windowSizeClass,
		) {
		content()
		}

packages/SystemUI/compose/core/src/com/android/compose/windowsizeclass/WindowSizeClass.kt

0 → 100644

+47 −0

Original line number	Diff line number	Diff line
		/*
		* Copyright 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.
		*/

		package com.android.compose.windowsizeclass

		import androidx.compose.material3.windowsizeclass.ExperimentalMaterial3WindowSizeClassApi
		import androidx.compose.material3.windowsizeclass.WindowSizeClass
		import androidx.compose.runtime.Composable
		import androidx.compose.runtime.staticCompositionLocalOf
		import androidx.compose.ui.graphics.toComposeRect
		import androidx.compose.ui.platform.LocalConfiguration
		import androidx.compose.ui.platform.LocalContext
		import androidx.compose.ui.platform.LocalDensity
		import androidx.window.layout.WindowMetricsCalculator

		val LocalWindowSizeClass =
		staticCompositionLocalOf<WindowSizeClass> {
		throw IllegalStateException(
		"No WindowSizeClass configured. Make sure to use LocalWindowSizeClass in a Composable" +
		" surrounded by a PlatformTheme {}."
		)
		}

		@OptIn(ExperimentalMaterial3WindowSizeClassApi::class)
		@Composable
		fun calculateWindowSizeClass(): WindowSizeClass {
		// Observe view configuration changes and recalculate the size class on each change.
		LocalConfiguration.current
		val density = LocalDensity.current
		val context = LocalContext.current
		val metrics = WindowMetricsCalculator.getOrCreate().computeCurrentWindowMetrics(context)
		val size = with(density) { metrics.bounds.toComposeRect().size.toDpSize() }
		return WindowSizeClass.calculateFromSize(size)
		}

packages/SystemUI/compose/features/src/com/android/systemui/bouncer/ui/composable/BouncerScene.kt

+222 −78

Original line number	Diff line number	Diff line
		@@ -14,40 +14,49 @@
		* limitations under the License.
		*/

		@file:OptIn(ExperimentalMaterial3Api::class)

		package com.android.systemui.bouncer.ui.composable

		import android.app.AlertDialog
		import android.app.Dialog
		import android.content.DialogInterface
		import androidx.compose.animation.Crossfade
		import androidx.compose.animation.core.animateFloatAsState
		import androidx.compose.animation.core.snap
		import androidx.compose.animation.core.tween
		import androidx.compose.foundation.Canvas
		import androidx.compose.foundation.gestures.detectTapGestures
		import androidx.compose.foundation.layout.Arrangement
		import androidx.compose.foundation.layout.Box
		import androidx.compose.foundation.layout.Column
		import androidx.compose.foundation.layout.Row
		import androidx.compose.foundation.layout.aspectRatio
		import androidx.compose.foundation.layout.fillMaxHeight
		import androidx.compose.foundation.layout.fillMaxSize
		import androidx.compose.foundation.layout.fillMaxWidth
		import androidx.compose.foundation.layout.padding
		import androidx.compose.material3.Button
		import androidx.compose.material3.ButtonDefaults
		import androidx.compose.material3.ExperimentalMaterial3Api
		import androidx.compose.material3.MaterialTheme
		import androidx.compose.material3.Text
		import androidx.compose.material3.windowsizeclass.WindowWidthSizeClass
		import androidx.compose.runtime.Composable
		import androidx.compose.runtime.collectAsState
		import androidx.compose.runtime.getValue
		import androidx.compose.runtime.mutableStateOf
		import androidx.compose.runtime.remember
		import androidx.compose.runtime.saveable.rememberSaveable
		import androidx.compose.runtime.setValue
		import androidx.compose.ui.Alignment
		import androidx.compose.ui.Modifier
		import androidx.compose.ui.graphics.graphicsLayer
		import androidx.compose.ui.input.pointer.pointerInput
		import androidx.compose.ui.platform.LocalLayoutDirection
		import androidx.compose.ui.res.stringResource
		import androidx.compose.ui.unit.LayoutDirection
		import androidx.compose.ui.unit.dp
		import com.android.compose.animation.scene.ElementKey
		import com.android.compose.animation.scene.SceneScope
		import com.android.compose.windowsizeclass.LocalWindowSizeClass
		import com.android.systemui.bouncer.ui.viewmodel.AuthMethodBouncerViewModel
		import com.android.systemui.bouncer.ui.viewmodel.BouncerViewModel
		import com.android.systemui.bouncer.ui.viewmodel.PasswordBouncerViewModel
		@@ -103,25 +112,59 @@ private fun SceneScope.BouncerScene(
		dialogFactory: BouncerSceneDialogFactory,
		modifier: Modifier = Modifier,
		) {
		val message: BouncerViewModel.MessageViewModel by viewModel.message.collectAsState()
		val authMethodViewModel: AuthMethodBouncerViewModel? by
		viewModel.authMethodViewModel.collectAsState()
		val dialogMessage: String? by viewModel.throttlingDialogMessage.collectAsState()
		var dialog: Dialog? by remember { mutableStateOf(null) }
		val backgroundColor = MaterialTheme.colorScheme.surface
		val windowSizeClass = LocalWindowSizeClass.current

		Box(modifier) {
		Canvas(Modifier.element(Bouncer.Elements.Background).fillMaxSize()) {
		drawRect(color = backgroundColor)
		}

		val childModifier = Modifier.element(Bouncer.Elements.Content).fillMaxSize()

		when (windowSizeClass.widthSizeClass) {
		WindowWidthSizeClass.Expanded ->
		SideBySide(
		viewModel = viewModel,
		dialogFactory = dialogFactory,
		modifier = childModifier,
		)
		WindowWidthSizeClass.Medium ->
		Stacked(
		viewModel = viewModel,
		dialogFactory = dialogFactory,
		modifier = childModifier,
		)
		else ->
		Bouncer(
		viewModel = viewModel,
		dialogFactory = dialogFactory,
		modifier = childModifier,
		)
		}
		}
		}

		/**
		* Renders the contents of the actual bouncer UI, the area that takes user input to do an
		* authentication attempt, including all messaging UI (directives, reasoning, errors, etc.).
		*/
		@Composable
		private fun Bouncer(
		viewModel: BouncerViewModel,
		dialogFactory: BouncerSceneDialogFactory,
		modifier: Modifier = Modifier,
		) {
		val message: BouncerViewModel.MessageViewModel by viewModel.message.collectAsState()
		val authMethodViewModel: AuthMethodBouncerViewModel? by
		viewModel.authMethodViewModel.collectAsState()
		val dialogMessage: String? by viewModel.throttlingDialogMessage.collectAsState()
		var dialog: Dialog? by remember { mutableStateOf(null) }

		Column(
		horizontalAlignment = Alignment.CenterHorizontally,
		verticalArrangement = Arrangement.spacedBy(60.dp),
		modifier =
		Modifier.element(Bouncer.Elements.Content)
		.fillMaxSize()
		.padding(start = 32.dp, top = 92.dp, end = 32.dp, bottom = 32.dp)
		modifier = modifier.padding(start = 32.dp, top = 92.dp, end = 32.dp, bottom = 32.dp)
		) {
		Crossfade(
		targetState = message,
		@@ -194,6 +237,107 @@ private fun SceneScope.BouncerScene(
		}
		}
		}

		/** Renders the UI of the user switcher that's displayed on large screens next to the bouncer UI. */
		@Composable
		private fun UserSwitcher(
		modifier: Modifier = Modifier,
		) {
		Box(modifier) {
		Text(
		text = "TODO: the user switcher goes here",
		modifier = Modifier.align(Alignment.Center)
		)
		}
		}

		/**
		* Arranges the bouncer contents and user switcher contents side-by-side, supporting a double tap
		* anywhere on the background to flip their positions.
		*/
		@Composable
		private fun SideBySide(
		viewModel: BouncerViewModel,
		dialogFactory: BouncerSceneDialogFactory,
		modifier: Modifier = Modifier,
		) {
		val layoutDirection = LocalLayoutDirection.current
		val isLeftToRight = layoutDirection == LayoutDirection.Ltr
		val (isUserSwitcherFirst, setUserSwitcherFirst) =
		rememberSaveable(isLeftToRight) { mutableStateOf(isLeftToRight) }

		Row(
		modifier =
		modifier.pointerInput(Unit) {
		detectTapGestures(
		onDoubleTap = { offset ->
		// Depending on where the user double tapped, switch the elements such that
		// the bouncer contents element is closer to the side that was double
		// tapped.
		setUserSwitcherFirst(offset.x > size.width / 2)
		}
		)
		},
		) {
		val animatedOffset by
		animateFloatAsState(
		targetValue =
		if (isUserSwitcherFirst) {
		// When the user switcher is first, both elements have their natural
		// placement so they are not offset in any way.
		0f
		} else if (isLeftToRight) {
		// Since the user switcher is not first, the elements have to be swapped
		// horizontally. In the case of LTR locales, this means pushing the user
		// switcher to the right, hence the positive number.
		1f
		} else {
		// Since the user switcher is not first, the elements have to be swapped
		// horizontally. In the case of RTL locales, this means pushing the user
		// switcher to the left, hence the negative number.
		-1f
		},
		label = "offset",
		)

		UserSwitcher(
		modifier =
		Modifier.fillMaxHeight().weight(1f).graphicsLayer {
		translationX = size.width * animatedOffset
		},
		)
		Bouncer(
		viewModel = viewModel,
		dialogFactory = dialogFactory,
		modifier =
		Modifier.fillMaxHeight().weight(1f).graphicsLayer {
		// A negative sign is used to make sure this is offset in the direction that's
		// opposite of the direction that the user switcher is pushed in.
		translationX = -size.width * animatedOffset
		},
		)
		}
		}

		/** Arranges the bouncer contents and user switcher contents one on top of the other. */
		@Composable
		private fun Stacked(
		viewModel: BouncerViewModel,
		dialogFactory: BouncerSceneDialogFactory,
		modifier: Modifier = Modifier,
		) {
		Column(
		modifier = modifier,
		) {
		UserSwitcher(
		modifier = Modifier.fillMaxWidth().weight(1f),
		)
		Bouncer(
		viewModel = viewModel,
		dialogFactory = dialogFactory,
		modifier = Modifier.fillMaxWidth().weight(1f),
		)
		}
		}

		interface BouncerSceneDialogFactory {