diff --git a/modules/widgetpicker/src/com/android/launcher3/widgetpicker/ui/components/ExpandCollapseIndicator.kt b/modules/widgetpicker/src/com/android/launcher3/widgetpicker/ui/components/ExpandCollapseIndicator.kt index 4003716a01..596da2a2b6 100644 --- a/modules/widgetpicker/src/com/android/launcher3/widgetpicker/ui/components/ExpandCollapseIndicator.kt +++ b/modules/widgetpicker/src/com/android/launcher3/widgetpicker/ui/components/ExpandCollapseIndicator.kt @@ -24,21 +24,18 @@ import androidx.compose.material.icons.Icons import androidx.compose.material.icons.rounded.KeyboardArrowDown import androidx.compose.material.icons.rounded.KeyboardArrowUp import androidx.compose.material3.Icon -import androidx.compose.material3.MaterialTheme import androidx.compose.runtime.Composable import androidx.compose.ui.Alignment import androidx.compose.ui.Modifier import androidx.compose.ui.draw.clip -import androidx.compose.ui.graphics.Color import androidx.compose.ui.unit.dp +import com.android.launcher3.widgetpicker.ui.theme.WidgetPickerTheme /** A visual cue displayed on list headers to indicate its current expand / collapse state. */ @Composable fun ExpandCollapseIndicator( expanded: Boolean, modifier: Modifier = Modifier, - iconColor: Color = ExpandCollapseIndicatorDefaults.iconColor, - backgroundColor: Color = ExpandCollapseIndicatorDefaults.backgroundColor, ) { Box( contentAlignment = Alignment.Center, @@ -46,11 +43,11 @@ fun ExpandCollapseIndicator( modifier .size(ExpandCollapseIndicatorDimensions.size) .clip(ExpandCollapseIndicatorDimensions.cornerShape) - .background(backgroundColor), + .background(WidgetPickerTheme.colors.expandCollapseIndicatorBackground), ) { Icon( modifier = Modifier.size(ExpandCollapseIndicatorDimensions.iconSize), - tint = iconColor, + tint = WidgetPickerTheme.colors.expandCollapseIndicatorIcon, contentDescription = null, // Decorative imageVector = if (expanded) { @@ -67,11 +64,3 @@ private object ExpandCollapseIndicatorDimensions { val size = 24.dp val iconSize = 16.dp } - -private object ExpandCollapseIndicatorDefaults { - val iconColor - @Composable get() = MaterialTheme.colorScheme.onSecondaryContainer - - val backgroundColor - @Composable get() = MaterialTheme.colorScheme.secondaryContainer -} diff --git a/modules/widgetpicker/src/com/android/launcher3/widgetpicker/ui/components/LeadingIconToolbarTab.kt b/modules/widgetpicker/src/com/android/launcher3/widgetpicker/ui/components/LeadingIconToolbarTab.kt index ebbc4c9b75..865a9b337a 100644 --- a/modules/widgetpicker/src/com/android/launcher3/widgetpicker/ui/components/LeadingIconToolbarTab.kt +++ b/modules/widgetpicker/src/com/android/launcher3/widgetpicker/ui/components/LeadingIconToolbarTab.kt @@ -31,17 +31,15 @@ import androidx.compose.foundation.layout.padding import androidx.compose.foundation.selection.selectable import androidx.compose.foundation.shape.CircleShape import androidx.compose.material3.Icon -import androidx.compose.material3.MaterialTheme import androidx.compose.material3.Text import androidx.compose.material3.minimumInteractiveComponentSize import androidx.compose.runtime.Composable import androidx.compose.ui.Alignment import androidx.compose.ui.Modifier import androidx.compose.ui.draw.clip -import androidx.compose.ui.graphics.Color import androidx.compose.ui.graphics.vector.ImageVector -import androidx.compose.ui.text.TextStyle import androidx.compose.ui.unit.dp +import com.android.launcher3.widgetpicker.ui.theme.WidgetPickerTheme /** * A tab (suitable for displaying in a horizontal toolbar) that shows a leading icon along with its @@ -55,17 +53,14 @@ fun LeadingIconToolbarTab( label: String, selected: Boolean, onClick: () -> Unit, - selectedBackgroundColor: Color = LeadingIconToolbarTabDefaults.selectedBackgroundColor, - contentColor: Color = LeadingIconToolbarTabDefaults.contentColor, - textStyle: TextStyle = LeadingIconToolbarTabDefaults.textStyle, iconEnterTransition: EnterTransition = LeadingIconToolbarTabDefaults.iconEnterTransition, iconExitTransition: ExitTransition = LeadingIconToolbarTabDefaults.iconExitTransition, ) { val backgroundColor = if (selected) { - selectedBackgroundColor + WidgetPickerTheme.colors.toolbarTabSelectedBackground } else { - Color.Transparent + WidgetPickerTheme.colors.toolbarTabUnSelectedBackground } Row( @@ -92,24 +87,19 @@ fun LeadingIconToolbarTab( imageVector = leadingIcon, contentDescription = null, // decorative modifier = Modifier.padding(end = LeadingIconToolbarTabDefaults.contentSpacing), - tint = contentColor, + tint = WidgetPickerTheme.colors.toolbarTabContent, ) } - Text(text = label, style = textStyle, color = contentColor) + Text( + text = label, + style = WidgetPickerTheme.typography.toolbarTabLabel, + color = WidgetPickerTheme.colors.toolbarTabContent, + ) } } /** Holds default values used by the [LeadingIconToolbarTab]. */ object LeadingIconToolbarTabDefaults { - val selectedBackgroundColor: Color - @Composable get() = MaterialTheme.colorScheme.secondaryContainer - - val contentColor: Color - @Composable get() = MaterialTheme.colorScheme.onSecondaryContainer - - val textStyle: TextStyle - @Composable get() = MaterialTheme.typography.labelLarge - val horizontalPadding = 16.dp val contentSpacing = 8.dp diff --git a/modules/widgetpicker/src/com/android/launcher3/widgetpicker/ui/components/ScrollableFloatingToolbar.kt b/modules/widgetpicker/src/com/android/launcher3/widgetpicker/ui/components/ScrollableFloatingToolbar.kt index 8e88f2b87a..76872efa30 100644 --- a/modules/widgetpicker/src/com/android/launcher3/widgetpicker/ui/components/ScrollableFloatingToolbar.kt +++ b/modules/widgetpicker/src/com/android/launcher3/widgetpicker/ui/components/ScrollableFloatingToolbar.kt @@ -24,7 +24,6 @@ import androidx.compose.foundation.layout.wrapContentSize import androidx.compose.foundation.rememberScrollState import androidx.compose.foundation.selection.selectableGroup import androidx.compose.foundation.shape.CircleShape -import androidx.compose.material3.MaterialTheme import androidx.compose.material3.Surface import androidx.compose.runtime.Composable import androidx.compose.runtime.remember @@ -32,7 +31,6 @@ import androidx.compose.runtime.rememberCoroutineScope import androidx.compose.ui.Alignment import androidx.compose.ui.Modifier import androidx.compose.ui.draw.clipToBounds -import androidx.compose.ui.graphics.Color import androidx.compose.ui.graphics.Shape import androidx.compose.ui.layout.Layout import androidx.compose.ui.layout.Measurable @@ -42,6 +40,7 @@ import androidx.compose.ui.unit.dp import androidx.compose.ui.util.fastFold import androidx.compose.ui.util.fastForEachIndexed import androidx.compose.ui.util.fastMap +import com.android.launcher3.widgetpicker.ui.theme.WidgetPickerTheme import kotlinx.coroutines.CoroutineScope import kotlinx.coroutines.launch @@ -70,7 +69,6 @@ import kotlinx.coroutines.launch * length, the padding appears on both sides. * @param maxWidth if the toolbar needs to be constraint to a specific width. * @param minTabWidth minimum width to be guaranteed for individual tabs - * @param containerColor color to be applied to the surface of toolbar * @param shadowElevation The size of the shadow below the surface. */ @Composable @@ -82,7 +80,6 @@ fun ScrollableFloatingToolbar( edgePadding: Dp = ScrollableFloatingToolbarDefaults.edgePadding, maxWidth: Dp = ScrollableFloatingToolbarDefaults.maxWidth, minTabWidth: Dp = ScrollableFloatingToolbarDefaults.minTabWidth, - containerColor: Color = ScrollableFloatingToolbarDefaults.containerColor, shadowElevation: Dp = ScrollableFloatingToolbarDefaults.shadowElevation, ) { check(tabs.size in 2..3) { "Unexpected number of tabs: ${tabs.size}. Suitable for 2-3 tabs." } @@ -90,7 +87,7 @@ fun ScrollableFloatingToolbar( val scrollState = rememberScrollState() Surface( - color = containerColor, + color = WidgetPickerTheme.colors.toolbarBackground, shadowElevation = shadowElevation, shape = shape, modifier = modifier.wrapContentSize(align = Alignment.Center), @@ -240,7 +237,4 @@ object ScrollableFloatingToolbarDefaults { val minTabWidth: Dp = 90.dp val shadowElevation: Dp = 3.dp - - val containerColor: Color - @Composable get() = MaterialTheme.colorScheme.surfaceBright } diff --git a/modules/widgetpicker/src/com/android/launcher3/widgetpicker/ui/components/TitledBottomSheet.kt b/modules/widgetpicker/src/com/android/launcher3/widgetpicker/ui/components/TitledBottomSheet.kt index 415c796f1d..0b61df95b3 100644 --- a/modules/widgetpicker/src/com/android/launcher3/widgetpicker/ui/components/TitledBottomSheet.kt +++ b/modules/widgetpicker/src/com/android/launcher3/widgetpicker/ui/components/TitledBottomSheet.kt @@ -49,6 +49,7 @@ import com.android.launcher3.widgetpicker.ui.components.DragHandleDimens.dragHan import com.android.launcher3.widgetpicker.ui.components.TitledBottomSheetDimens.headerBottomMargin import com.android.launcher3.widgetpicker.ui.components.TitledBottomSheetDimens.sheetInnerHorizontalPadding import com.android.launcher3.widgetpicker.ui.components.TitledBottomSheetDimens.sheetInnerTopPadding +import com.android.launcher3.widgetpicker.ui.theme.WidgetPickerTheme import com.android.launcher3.widgetpicker.ui.windowsizeclass.WindowInfo import com.android.launcher3.widgetpicker.ui.windowsizeclass.calculateWindowInfo import com.android.launcher3.widgetpicker.ui.windowsizeclass.isExtraTall @@ -104,7 +105,7 @@ fun TitledBottomSheet( sheetState = modalBottomSheetState, sheetGesturesEnabled = false, sheetMaxWidth = Dp.Unspecified, - containerColor = MaterialTheme.colorScheme.surfaceContainer, + containerColor = WidgetPickerTheme.colors.sheetBackground, onDismissRequest = onDismissRequest, dragHandle = dragHandle, modifier = modifier.windowInsetsPadding(WindowInsets.statusBars), @@ -141,8 +142,8 @@ private fun Header(title: String, description: String?) { maxLines = 1, text = title, textAlign = TextAlign.Center, - style = MaterialTheme.typography.headlineSmallEmphasized, - color = MaterialTheme.colorScheme.onSurface, + style = WidgetPickerTheme.typography.sheetTitle, + color = WidgetPickerTheme.colors.sheetTitle, ) description?.let { Text( @@ -150,8 +151,8 @@ private fun Header(title: String, description: String?) { maxLines = 2, text = it, textAlign = TextAlign.Center, - style = MaterialTheme.typography.bodyMedium, - color = MaterialTheme.colorScheme.onSurfaceVariant, + style = WidgetPickerTheme.typography.sheetDescription, + color = WidgetPickerTheme.colors.sheetDescription, ) } } diff --git a/modules/widgetpicker/src/com/android/launcher3/widgetpicker/ui/components/TwoPaneLayout.kt b/modules/widgetpicker/src/com/android/launcher3/widgetpicker/ui/components/TwoPaneLayout.kt index 7d9eb43615..dd13012a4b 100644 --- a/modules/widgetpicker/src/com/android/launcher3/widgetpicker/ui/components/TwoPaneLayout.kt +++ b/modules/widgetpicker/src/com/android/launcher3/widgetpicker/ui/components/TwoPaneLayout.kt @@ -27,13 +27,13 @@ import androidx.compose.foundation.layout.fillMaxSize import androidx.compose.foundation.layout.fillMaxWidth import androidx.compose.foundation.layout.height import androidx.compose.foundation.layout.padding +import androidx.compose.foundation.rememberScrollState import androidx.compose.foundation.shape.RoundedCornerShape -import androidx.compose.material3.MaterialTheme +import androidx.compose.foundation.verticalScroll import androidx.compose.runtime.Composable import androidx.compose.ui.Alignment import androidx.compose.ui.Modifier import androidx.compose.ui.draw.clip -import androidx.compose.ui.graphics.Color import androidx.compose.ui.semantics.isTraversalGroup import androidx.compose.ui.semantics.paneTitle import androidx.compose.ui.semantics.semantics @@ -43,6 +43,7 @@ import com.android.launcher3.widgetpicker.ui.components.TwoPaneLayoutDimensions. import com.android.launcher3.widgetpicker.ui.components.TwoPaneLayoutDimensions.horizontalPadding import com.android.launcher3.widgetpicker.ui.components.TwoPaneLayoutDimensions.paneSpacing import com.android.launcher3.widgetpicker.ui.components.TwoPaneLayoutDimensions.searchBarBottomMargin +import com.android.launcher3.widgetpicker.ui.theme.WidgetPickerTheme /** * A layout that splits the widget picker content into two panes where the left pane takes about @@ -58,7 +59,6 @@ import com.android.launcher3.widgetpicker.ui.components.TwoPaneLayoutDimensions. * pane guides the user that content for selected option is now visible on right. When using * accessibility services like talkback, after selecting an option on left, the users can use four * finger swipe down to move focus to the right pane. - * @param rightPaneBackgroundColor color to use for that background of content on right. */ @Composable fun TwoPaneLayout( @@ -66,7 +66,6 @@ fun TwoPaneLayout( leftContent: @Composable () -> Unit, rightContent: @Composable () -> Unit, rightPaneTitle: String?, - rightPaneBackgroundColor: Color = TwoPaneLayoutDefaults.rightPaneBackgroundColor, ) { val rightPaneModifier = if (rightPaneTitle != null) { @@ -95,7 +94,8 @@ fun TwoPaneLayout( .fillMaxHeight() .weight(RIGHT_PANE_WEIGHT) .clip(TwoPaneLayoutDimensions.rightPaneShape) - .background(rightPaneBackgroundColor), + .background(WidgetPickerTheme.colors.widgetsContainerBackground) + .verticalScroll(rememberScrollState()), ) { rightContent() } @@ -118,8 +118,3 @@ private object TwoPaneLayoutDimensions { val rightPaneShape = RoundedCornerShape(28.dp) } - -private object TwoPaneLayoutDefaults { - val rightPaneBackgroundColor - @Composable get() = MaterialTheme.colorScheme.surfaceBright -} diff --git a/modules/widgetpicker/src/com/android/launcher3/widgetpicker/ui/components/WidgetAppIcon.kt b/modules/widgetpicker/src/com/android/launcher3/widgetpicker/ui/components/WidgetAppIcon.kt index 735d8c1255..209e25d9a1 100644 --- a/modules/widgetpicker/src/com/android/launcher3/widgetpicker/ui/components/WidgetAppIcon.kt +++ b/modules/widgetpicker/src/com/android/launcher3/widgetpicker/ui/components/WidgetAppIcon.kt @@ -24,7 +24,6 @@ import androidx.compose.foundation.layout.fillMaxSize import androidx.compose.foundation.layout.size import androidx.compose.foundation.shape.CircleShape import androidx.compose.material3.Icon -import androidx.compose.material3.MaterialTheme import androidx.compose.runtime.Composable import androidx.compose.ui.Alignment import androidx.compose.ui.Modifier @@ -38,6 +37,7 @@ import androidx.compose.ui.unit.dp import com.android.launcher3.widgetpicker.shared.model.AppIcon import com.android.launcher3.widgetpicker.shared.model.AppIconBadge import com.android.launcher3.widgetpicker.shared.model.WidgetAppIcon +import com.android.launcher3.widgetpicker.ui.theme.WidgetPickerTheme /** An app icon rendered from the provided [WidgetAppIcon] with an option badge. */ @Composable @@ -91,7 +91,7 @@ private fun PlaceholderAppIcon(size: AppIconSize) { modifier = Modifier.size(size.iconSize) .background( - color = MaterialTheme.colorScheme.onSurfaceVariant.copy(alpha = 0.2f), + color = WidgetPickerTheme.colors.placeholderAppIcon.copy(alpha = 0.2f), shape = CircleShape, ) ) diff --git a/modules/widgetpicker/src/com/android/launcher3/widgetpicker/ui/components/WidgetAppsList.kt b/modules/widgetpicker/src/com/android/launcher3/widgetpicker/ui/components/WidgetAppsList.kt index 4ddf5aa7eb..d429fe0ec5 100644 --- a/modules/widgetpicker/src/com/android/launcher3/widgetpicker/ui/components/WidgetAppsList.kt +++ b/modules/widgetpicker/src/com/android/launcher3/widgetpicker/ui/components/WidgetAppsList.kt @@ -22,7 +22,6 @@ import androidx.compose.foundation.layout.fillMaxWidth import androidx.compose.foundation.lazy.LazyColumn import androidx.compose.foundation.lazy.rememberLazyListState import androidx.compose.foundation.shape.RoundedCornerShape -import androidx.compose.material3.MaterialTheme import androidx.compose.runtime.Composable import androidx.compose.runtime.remember import androidx.compose.ui.Modifier @@ -139,17 +138,7 @@ private fun ExpandableWidgetAppHeader( widgetSizeGroups = widgetApp.widgetSizeGroups, showAllWidgetDetails = true, previews = widgetPreviews, - modifier = - Modifier - .fillMaxWidth() - .background( - color = MaterialTheme.colorScheme.surfaceBright, - shape = - when { - isLast -> WidgetAppsListDimensions.bottomLargeShape - else -> WidgetAppsListDimensions.smallShape - }, - ), + modifier = Modifier.fillMaxWidth(), onWidgetInteraction = onWidgetInteraction, showDragShadow = showDragShadow, ) diff --git a/modules/widgetpicker/src/com/android/launcher3/widgetpicker/ui/components/WidgetAppsListHeader.kt b/modules/widgetpicker/src/com/android/launcher3/widgetpicker/ui/components/WidgetAppsListHeader.kt index 371c08fc5e..62c30c0aab 100644 --- a/modules/widgetpicker/src/com/android/launcher3/widgetpicker/ui/components/WidgetAppsListHeader.kt +++ b/modules/widgetpicker/src/com/android/launcher3/widgetpicker/ui/components/WidgetAppsListHeader.kt @@ -32,24 +32,20 @@ import androidx.compose.foundation.layout.padding import androidx.compose.foundation.shape.RoundedCornerShape import androidx.compose.material.icons.Icons import androidx.compose.material.icons.filled.Star -import androidx.compose.material3.ExperimentalMaterial3ExpressiveApi import androidx.compose.material3.Icon -import androidx.compose.material3.MaterialTheme import androidx.compose.material3.Text import androidx.compose.material3.minimumInteractiveComponentSize import androidx.compose.runtime.Composable import androidx.compose.ui.Alignment import androidx.compose.ui.Modifier import androidx.compose.ui.draw.clip -import androidx.compose.ui.graphics.Color import androidx.compose.ui.res.stringResource import androidx.compose.ui.semantics.selected import androidx.compose.ui.semantics.semantics -import androidx.compose.ui.text.TextStyle -import androidx.compose.ui.text.font.FontWeight import androidx.compose.ui.text.style.TextOverflow import androidx.compose.ui.unit.dp import com.android.launcher3.widgetpicker.R +import com.android.launcher3.widgetpicker.ui.theme.WidgetPickerTheme /** * A list header in widget picker that when [expanded] displays the [expandedContent]. @@ -79,12 +75,11 @@ fun ExpandableListHeader( val finalModifier = modifier .clip(shape = shape) - .background(color = ExpandedListHeaderDefaults.backgroundColor) + .background(color = WidgetPickerTheme.colors.expandableListItemsBackground) Column(modifier = finalModifier) { WidgetAppHeader( - modifier = Modifier - .clickable { onClick() }, + modifier = Modifier.clickable { onClick() }, leadingIcon = { leadingAppIcon() }, title = title, subTitle = subTitle, @@ -115,8 +110,6 @@ fun ExpandableListHeader( * @param subTitle a short 1 line description (e.g. number of widgets in the selected app). * @param onSelect action to perform when user clicks to select the header * @param shape shape for the header e.g. depending on position in the list, a different corner - * @param selectedBackgroundColor background color when header is [selected] - * @param unSelectedBackgroundColor background color when header is not [selected] */ @Composable fun SelectableListHeader( @@ -127,8 +120,6 @@ fun SelectableListHeader( subTitle: String, onSelect: () -> Unit, shape: RoundedCornerShape, - selectedBackgroundColor: Color = ClickableListHeaderDefaults.selectedBackgroundColor, - unSelectedBackgroundColor: Color = ClickableListHeaderDefaults.unSelectedBackgroundColor, ) { val clickModifier = if (!selected) { @@ -145,9 +136,9 @@ fun SelectableListHeader( .background( color = if (selected) { - selectedBackgroundColor + WidgetPickerTheme.colors.selectedListHeaderBackground } else { - unSelectedBackgroundColor + WidgetPickerTheme.colors.unselectedListHeaderBackground } ) .then(clickModifier), @@ -166,8 +157,6 @@ fun SelectableListHeader( * @param count number of suggested widgets. * @param onSelect action to perform when user selects the header. * @param shape shape for the header e.g. depending on position in the list, a different corner. - * @param selectedBackgroundColor background color when header is [selected]. - * @param unSelectedBackgroundColor background color when header is not [selected]. */ @Composable fun SelectableSuggestionsHeader( @@ -176,25 +165,24 @@ fun SelectableSuggestionsHeader( count: Int, onSelect: () -> Unit, shape: RoundedCornerShape, - selectedBackgroundColor: Color = ClickableListHeaderDefaults.selectedBackgroundColor, - unSelectedBackgroundColor: Color = ClickableListHeaderDefaults.unSelectedBackgroundColor, ) { SelectableListHeader( modifier = modifier, selected = selected, shape = shape, - selectedBackgroundColor = selectedBackgroundColor, - unSelectedBackgroundColor = unSelectedBackgroundColor, title = stringResource(R.string.featured_widgets_tab_label), subTitle = widgetsCountString(count), leadingAppIcon = { Icon( imageVector = Icons.Filled.Star, contentDescription = null, + tint = WidgetPickerTheme.colors.featuredHeaderLeadingIcon, modifier = Modifier .clip(shape) - .background(MaterialTheme.colorScheme.surfaceBright) + .background( + WidgetPickerTheme.colors.featuredHeaderLeadingIconBackground + ) .minimumInteractiveComponentSize(), ) }, @@ -243,24 +231,24 @@ private fun CenterText(title: String, subTitle: String, selected: Boolean, modif text = title, maxLines = 1, overflow = TextOverflow.Ellipsis, - color = WidgetAppListHeaderDefaults.titleTextColor, + color = WidgetPickerTheme.colors.listHeaderTitle, style = if (selected) { - WidgetAppListHeaderDefaults.selectedTitleTextStyle + WidgetPickerTheme.typography.selectedListHeaderTitle } else { - WidgetAppListHeaderDefaults.unSelectedTitleTextStyle + WidgetPickerTheme.typography.unSelectedListHeaderTitle }, ) Text( text = subTitle, maxLines = 1, overflow = TextOverflow.Ellipsis, - color = WidgetAppListHeaderDefaults.subTitleTextColor, + color = WidgetPickerTheme.colors.listHeaderSubTitle, style = if (selected) { - WidgetAppListHeaderDefaults.selectedSubTitleTextStyle + WidgetPickerTheme.typography.selectedListHeaderSubTitle } else { - WidgetAppListHeaderDefaults.unSelectedSubTitleTextStyle + WidgetPickerTheme.typography.unSelectedListHeaderSubTitle }, ) } @@ -273,40 +261,6 @@ private object ListHeaderDimensions { } private object ExpandedListHeaderDefaults { - val backgroundColor: Color - @Composable get() = MaterialTheme.colorScheme.surfaceBright - val contentExpandAnimationSpec = fadeIn(tween(durationMillis = 500)) + expandVertically() val contentCollapseAnimationSpec = fadeOut(tween(durationMillis = 500)) + shrinkVertically() } - -private object ClickableListHeaderDefaults { - val selectedBackgroundColor - @Composable get() = MaterialTheme.colorScheme.secondaryContainer - - val unSelectedBackgroundColor - @Composable get() = Color.Transparent -} - -@OptIn(ExperimentalMaterial3ExpressiveApi::class) -private object WidgetAppListHeaderDefaults { - val selectedTitleTextStyle: TextStyle - @Composable - get() = MaterialTheme.typography.titleMediumEmphasized.copy(fontWeight = FontWeight.Medium) - - val unSelectedTitleTextStyle: TextStyle - @Composable - get() = MaterialTheme.typography.titleMedium.copy(fontWeight = FontWeight.Normal) - - val selectedSubTitleTextStyle: TextStyle - @Composable get() = MaterialTheme.typography.titleSmall.copy(fontWeight = FontWeight.Medium) - - val unSelectedSubTitleTextStyle: TextStyle - @Composable get() = MaterialTheme.typography.titleSmall.copy(fontWeight = FontWeight.Normal) - - val titleTextColor: Color - @Composable get() = MaterialTheme.colorScheme.onSurface - - val subTitleTextColor: Color - @Composable get() = MaterialTheme.colorScheme.onSurfaceVariant -} diff --git a/modules/widgetpicker/src/com/android/launcher3/widgetpicker/ui/components/WidgetDetails.kt b/modules/widgetpicker/src/com/android/launcher3/widgetpicker/ui/components/WidgetDetails.kt index 12ab8d5723..4edcdfd40c 100644 --- a/modules/widgetpicker/src/com/android/launcher3/widgetpicker/ui/components/WidgetDetails.kt +++ b/modules/widgetpicker/src/com/android/launcher3/widgetpicker/ui/components/WidgetDetails.kt @@ -39,7 +39,6 @@ import androidx.compose.material3.Button import androidx.compose.material3.ButtonColors import androidx.compose.material3.ButtonDefaults import androidx.compose.material3.Icon -import androidx.compose.material3.MaterialTheme import androidx.compose.material3.Text import androidx.compose.material3.minimumInteractiveComponentSize import androidx.compose.runtime.Composable @@ -54,7 +53,6 @@ import androidx.compose.ui.res.stringResource import androidx.compose.ui.semantics.clearAndSetSemantics import androidx.compose.ui.semantics.contentDescription import androidx.compose.ui.semantics.semantics -import androidx.compose.ui.text.font.FontWeight import androidx.compose.ui.text.style.TextAlign import androidx.compose.ui.text.style.TextOverflow import androidx.compose.ui.unit.Dp @@ -66,6 +64,7 @@ import com.android.launcher3.widgetpicker.ui.WidgetInteractionInfo import com.android.launcher3.widgetpicker.ui.components.AddButtonDefaults.TOGGLE_ANIMATION_DURATION import com.android.launcher3.widgetpicker.ui.components.WidgetDetailsDimensions.INVISIBLE_ALPHA import com.android.launcher3.widgetpicker.ui.components.WidgetDetailsDimensions.VISIBLE_ALPHA +import com.android.launcher3.widgetpicker.ui.theme.WidgetPickerTheme /** * Displays the details of the widget that can be shown below their previews. @@ -185,7 +184,10 @@ private fun AddButton( Button( modifier = Modifier.minimumInteractiveComponentSize(), contentPadding = AddButtonDimensions.paddingValues, - colors = AddButtonDefaults.colors, + colors = ButtonDefaults.buttonColors( + containerColor = WidgetPickerTheme.colors.addButtonBackground, + contentColor = WidgetPickerTheme.colors.addButtonContent + ), onClick = onClick, ) { Icon( @@ -222,11 +224,8 @@ private fun WidgetLabel(label: String, appIcon: (@Composable () -> Unit)?, modif overflow = TextOverflow.Ellipsis, maxLines = 1, textAlign = TextAlign.Center, - style = - MaterialTheme.typography.bodyMedium.copy( - color = MaterialTheme.colorScheme.onSurface, - fontWeight = FontWeight.Medium, - ), + color = WidgetPickerTheme.colors.widgetLabel, + style = WidgetPickerTheme.typography.widgetLabel, ) } } @@ -242,11 +241,8 @@ private fun WidgetDescription(description: CharSequence) { overflow = TextOverflow.Ellipsis, textAlign = TextAlign.Center, maxLines = 3, - style = - MaterialTheme.typography.bodySmall.copy( - color = MaterialTheme.colorScheme.onSurfaceVariant, - fontWeight = FontWeight.Normal, - ), + color = WidgetPickerTheme.colors.widgetDescription, + style = WidgetPickerTheme.typography.widgetDescription, ) } @@ -260,11 +256,8 @@ private fun WidgetSpanSizeLabel(spanX: Int, spanY: Int) { text = stringResource(R.string.widget_span_dimensions_format, spanX, spanY), textAlign = TextAlign.Center, maxLines = 1, - style = - MaterialTheme.typography.bodyMedium.copy( - color = MaterialTheme.colorScheme.onSurfaceVariant, - fontWeight = FontWeight.Normal, - ), + color = WidgetPickerTheme.colors.widgetSpanText, + style = WidgetPickerTheme.typography.widgetSpanText, modifier = Modifier.semantics { this.contentDescription = contentDescription }, ) } @@ -291,10 +284,4 @@ private object AddButtonDefaults { const val TOGGLE_ANIMATION_DURATION = 400 val enterTransition = fadeIn(animationSpec = tween(TOGGLE_ANIMATION_DURATION)) val exitTransition = fadeOut(animationSpec = tween(TOGGLE_ANIMATION_DURATION)) - - val colors: ButtonColors - @Composable get() = ButtonDefaults.buttonColors( - containerColor = MaterialTheme.colorScheme.primary, - contentColor = MaterialTheme.colorScheme.onPrimary - ) } diff --git a/modules/widgetpicker/src/com/android/launcher3/widgetpicker/ui/components/WidgetPreview.kt b/modules/widgetpicker/src/com/android/launcher3/widgetpicker/ui/components/WidgetPreview.kt index f7d712cd0d..7977dd2ddc 100644 --- a/modules/widgetpicker/src/com/android/launcher3/widgetpicker/ui/components/WidgetPreview.kt +++ b/modules/widgetpicker/src/com/android/launcher3/widgetpicker/ui/components/WidgetPreview.kt @@ -34,7 +34,6 @@ import androidx.compose.foundation.layout.width import androidx.compose.foundation.layout.wrapContentSize import androidx.compose.foundation.shape.RoundedCornerShape import androidx.compose.material3.CircularProgressIndicator -import androidx.compose.material3.MaterialTheme import androidx.compose.runtime.Composable import androidx.compose.runtime.derivedStateOf import androidx.compose.runtime.getValue @@ -67,6 +66,7 @@ import com.android.launcher3.widgetpicker.shared.model.WidgetId import com.android.launcher3.widgetpicker.shared.model.WidgetPreview import com.android.launcher3.widgetpicker.shared.model.WidgetSizeInfo import com.android.launcher3.widgetpicker.ui.WidgetInteractionInfo +import com.android.launcher3.widgetpicker.ui.theme.WidgetPickerTheme import kotlin.math.roundToInt /** Renders a different types of preview for an appwidget. */ @@ -149,11 +149,11 @@ private fun PlaceholderWidgetPreview(size: DpSize, widgetRadius: Dp) { .width(size.width) .height(size.height) .background( - color = MaterialTheme.colorScheme.secondaryContainer, + color = WidgetPickerTheme.colors.widgetPlaceholderBackground, shape = RoundedCornerShape(widgetRadius), ), ) { - CircularProgressIndicator() + CircularProgressIndicator(color = WidgetPickerTheme.colors.widgetPlaceholderContent) } } diff --git a/modules/widgetpicker/src/com/android/launcher3/widgetpicker/ui/components/WidgetsSearchBar.kt b/modules/widgetpicker/src/com/android/launcher3/widgetpicker/ui/components/WidgetsSearchBar.kt index 1889f4c474..5d3b815564 100644 --- a/modules/widgetpicker/src/com/android/launcher3/widgetpicker/ui/components/WidgetsSearchBar.kt +++ b/modules/widgetpicker/src/com/android/launcher3/widgetpicker/ui/components/WidgetsSearchBar.kt @@ -37,9 +37,7 @@ import androidx.compose.material.icons.filled.Search import androidx.compose.material3.Icon import androidx.compose.material3.IconButton import androidx.compose.material3.IconButtonDefaults -import androidx.compose.material3.MaterialTheme import androidx.compose.material3.Text -import androidx.compose.material3.TextFieldColors import androidx.compose.material3.TextFieldDefaults import androidx.compose.material3.minimumInteractiveComponentSize import androidx.compose.runtime.Composable @@ -55,14 +53,12 @@ import androidx.compose.ui.graphics.SolidColor import androidx.compose.ui.platform.LocalFocusManager import androidx.compose.ui.platform.LocalSoftwareKeyboardController import androidx.compose.ui.res.stringResource -import androidx.compose.ui.text.TextStyle -import androidx.compose.ui.text.font.FontWeight import androidx.compose.ui.text.input.ImeAction import androidx.compose.ui.text.input.VisualTransformation import androidx.compose.ui.text.style.TextOverflow import androidx.compose.ui.unit.dp -import androidx.compose.ui.unit.sp import com.android.launcher3.widgetpicker.R +import com.android.launcher3.widgetpicker.ui.theme.WidgetPickerTheme import kotlin.coroutines.cancellation.CancellationException import kotlinx.coroutines.flow.Flow @@ -114,14 +110,17 @@ fun WidgetsSearchBar( value = text, onValueChange = { onSearch(it) }, singleLine = true, - cursorBrush = SolidColor(MaterialTheme.colorScheme.primary), + cursorBrush = SolidColor(WidgetPickerTheme.colors.searchBarCursor), keyboardOptions = KeyboardOptions(imeAction = ImeAction.Search), keyboardActions = KeyboardActions(onSearch = { keyboardController?.hide() onSearch(text) }), interactionSource = interactionSource, - textStyle = WidgetsSearchBarDefaults.textStyle, + textStyle = + WidgetPickerTheme.typography.searchBarText.copy( + color = WidgetPickerTheme.colors.searchBarText + ), decorationBox = @Composable { innerTextField -> WidgetsSearchBarContent( @@ -172,7 +171,11 @@ private fun WidgetsSearchBarContent( isError = false, interactionSource = interactionSource, shape = CircleShape, - colors = WidgetsSearchBarDefaults.containerColors, + colors = + TextFieldDefaults.colors( + focusedContainerColor = WidgetPickerTheme.colors.searchBarBackground, + unfocusedContainerColor = WidgetPickerTheme.colors.searchBarBackground, + ), focusedIndicatorLineThickness = 0.dp, unfocusedIndicatorLineThickness = 0.dp, ) @@ -210,13 +213,22 @@ private fun LeadingButton(isSearching: Boolean, onBack: () -> Unit) { private fun SearchIcon() { Icon( imageVector = Icons.Filled.Search, + tint = WidgetPickerTheme.colors.searchBarSearchIcon, contentDescription = null, // decorative ) } @Composable private fun BackButton(onClick: () -> Unit) { - IconButton(colors = WidgetsSearchBarDefaults.iconButtonColors, onClick = onClick) { + IconButton( + colors = + IconButtonDefaults.iconButtonColors() + .copy( + containerColor = Color.Transparent, + contentColor = WidgetPickerTheme.colors.searchBarBackButtonIcon, + ), + onClick = onClick, + ) { Icon( imageVector = Icons.AutoMirrored.Outlined.ArrowBack, contentDescription = stringResource(R.string.widget_search_bar_back_button_label), @@ -230,14 +242,22 @@ private fun PlaceholderText() { text = stringResource(R.string.widgets_search_bar_hint), maxLines = 1, overflow = TextOverflow.Ellipsis, - color = WidgetsSearchBarDefaults.placeholderTextColor, - style = WidgetsSearchBarDefaults.placeholderTextStyle, + color = WidgetPickerTheme.colors.searchBarPlaceholderText, + style = WidgetPickerTheme.typography.searchBarPlaceholderText, ) } @Composable private fun ClearButton(onClick: () -> Unit) { - IconButton(colors = WidgetsSearchBarDefaults.iconButtonColors, onClick = onClick) { + IconButton( + colors = + IconButtonDefaults.iconButtonColors() + .copy( + containerColor = Color.Transparent, + contentColor = WidgetPickerTheme.colors.searchBarClearButtonIcon, + ), + onClick = onClick, + ) { Icon( imageVector = Icons.Filled.Close, contentDescription = stringResource(R.string.widget_search_bar_clear_button_label), @@ -249,37 +269,3 @@ private object WidgetsSearchBarDimens { val paddingValues = PaddingValues(horizontal = 16.dp, vertical = 8.dp) val minHeight = 52.dp } - -private object WidgetsSearchBarDefaults { - val containerColors: TextFieldColors - @Composable - get() = - TextFieldDefaults.colors( - focusedContainerColor = MaterialTheme.colorScheme.surfaceBright, - unfocusedContainerColor = MaterialTheme.colorScheme.surfaceBright, - ) - - val placeholderTextColor: Color - @Composable get() = MaterialTheme.colorScheme.onSurfaceVariant - - val iconButtonColors - @Composable - get() = IconButtonDefaults.iconButtonColors().copy(containerColor = Color.Transparent) - - val textStyle: TextStyle - @Composable - get() = - MaterialTheme.typography.bodyLarge.copy( - fontSize = 20.sp, - fontWeight = FontWeight.Normal, - color = MaterialTheme.colorScheme.onSurfaceVariant, - ) - - val placeholderTextStyle: TextStyle - @Composable - get() = - MaterialTheme.typography.bodyLarge.copy( - fontSize = 20.sp, - fontWeight = FontWeight.Normal, - ) -} diff --git a/modules/widgetpicker/src/com/android/launcher3/widgetpicker/ui/fullcatalog/screens/landing/LandingScreen.kt b/modules/widgetpicker/src/com/android/launcher3/widgetpicker/ui/fullcatalog/screens/landing/LandingScreen.kt index fb69be4a7b..b297a9c7f9 100644 --- a/modules/widgetpicker/src/com/android/launcher3/widgetpicker/ui/fullcatalog/screens/landing/LandingScreen.kt +++ b/modules/widgetpicker/src/com/android/launcher3/widgetpicker/ui/fullcatalog/screens/landing/LandingScreen.kt @@ -16,11 +16,10 @@ package com.android.launcher3.widgetpicker.ui.fullcatalog.screens.landing +import androidx.compose.foundation.background import androidx.compose.foundation.layout.fillMaxSize import androidx.compose.foundation.layout.fillMaxWidth import androidx.compose.foundation.layout.wrapContentSize -import androidx.compose.foundation.rememberScrollState -import androidx.compose.foundation.verticalScroll import androidx.compose.runtime.Composable import androidx.compose.runtime.remember import androidx.compose.ui.Modifier @@ -28,6 +27,7 @@ import com.android.launcher3.widgetpicker.shared.model.WidgetAppId import com.android.launcher3.widgetpicker.ui.WidgetInteractionInfo import com.android.launcher3.widgetpicker.ui.components.WidgetsGrid import com.android.launcher3.widgetpicker.ui.components.WidgetsSearchBar +import com.android.launcher3.widgetpicker.ui.theme.WidgetPickerTheme /** * View displayed when user opens the full catalog of widgets in widget picker. @@ -106,10 +106,10 @@ private fun LandingScreen( ) { val featuredWidgetsContent: @Composable () -> Unit = { WidgetsGrid( - modifier = Modifier - .fillMaxSize() - .wrapContentSize() - .verticalScroll(rememberScrollState()), + modifier = + Modifier + .fillMaxSize() + .wrapContentSize(), widgetSizeGroups = featuredWidgetsState.sizeGroups, showAllWidgetDetails = false, previews = featuredWidgetPreviewsState.previews, diff --git a/modules/widgetpicker/src/com/android/launcher3/widgetpicker/ui/fullcatalog/screens/landing/LandingScreenSinglePane.kt b/modules/widgetpicker/src/com/android/launcher3/widgetpicker/ui/fullcatalog/screens/landing/LandingScreenSinglePane.kt index 49db26b667..157f4de19c 100644 --- a/modules/widgetpicker/src/com/android/launcher3/widgetpicker/ui/fullcatalog/screens/landing/LandingScreenSinglePane.kt +++ b/modules/widgetpicker/src/com/android/launcher3/widgetpicker/ui/fullcatalog/screens/landing/LandingScreenSinglePane.kt @@ -24,13 +24,14 @@ import androidx.compose.foundation.layout.padding import androidx.compose.foundation.pager.HorizontalPager import androidx.compose.foundation.pager.PagerState import androidx.compose.foundation.pager.rememberPagerState +import androidx.compose.foundation.rememberScrollState import androidx.compose.foundation.shape.RoundedCornerShape +import androidx.compose.foundation.verticalScroll import androidx.compose.material.icons.Icons import androidx.compose.material.icons.automirrored.filled.List import androidx.compose.material.icons.filled.Person import androidx.compose.material.icons.filled.Star import androidx.compose.material.icons.outlined.Work -import androidx.compose.material3.MaterialTheme import androidx.compose.runtime.Composable import androidx.compose.runtime.remember import androidx.compose.runtime.rememberCoroutineScope @@ -60,6 +61,7 @@ import com.android.launcher3.widgetpicker.ui.fullcatalog.screens.landing.Landing import com.android.launcher3.widgetpicker.ui.fullcatalog.screens.landing.LandingScreenSinglePaneDimens.bottomTabsTopPadding import com.android.launcher3.widgetpicker.ui.fullcatalog.screens.landing.LandingScreenSinglePaneDimens.contentShape import com.android.launcher3.widgetpicker.ui.fullcatalog.screens.landing.LandingScreenSinglePaneDimens.pagerItemsSpacing +import com.android.launcher3.widgetpicker.ui.theme.WidgetPickerTheme import kotlinx.coroutines.launch /** @@ -115,10 +117,12 @@ fun LandingScreenSinglePane( when (pageIndex) { FEATURED_TAB_INDEX -> { Box( + contentAlignment = Alignment.Center, modifier = Modifier .fillMaxSize() .clip(contentShape) - .background(MaterialTheme.colorScheme.surfaceBright) + .background(WidgetPickerTheme.colors.widgetsContainerBackground) + .verticalScroll(rememberScrollState()) ) { featuredWidgetsContent() } diff --git a/modules/widgetpicker/src/com/android/launcher3/widgetpicker/ui/fullcatalog/screens/landing/LandingScreenTwoPane.kt b/modules/widgetpicker/src/com/android/launcher3/widgetpicker/ui/fullcatalog/screens/landing/LandingScreenTwoPane.kt index 9929405557..5a5c19bd7b 100644 --- a/modules/widgetpicker/src/com/android/launcher3/widgetpicker/ui/fullcatalog/screens/landing/LandingScreenTwoPane.kt +++ b/modules/widgetpicker/src/com/android/launcher3/widgetpicker/ui/fullcatalog/screens/landing/LandingScreenTwoPane.kt @@ -25,9 +25,7 @@ import androidx.compose.foundation.layout.wrapContentSize import androidx.compose.foundation.pager.HorizontalPager import androidx.compose.foundation.pager.PagerState import androidx.compose.foundation.pager.rememberPagerState -import androidx.compose.foundation.rememberScrollState import androidx.compose.foundation.shape.RoundedCornerShape -import androidx.compose.foundation.verticalScroll import androidx.compose.material.icons.Icons import androidx.compose.material.icons.filled.Person import androidx.compose.material.icons.outlined.Work @@ -149,7 +147,6 @@ fun LandingScreenTwoPane( browseWidgetsState = browseWidgetsState, selectedPersonalWidgetAppId = selectedPersonalWidgetAppId, personalWidgetPreviewsState = personalWidgetPreviewsState, - widgetAppIconsState = widgetAppIconsState, selectedWorkWidgetAppId = selectedWorkWidgetAppId, workWidgetPreviewsState = workWidgetPreviewsState, onWidgetInteraction = onWidgetInteraction, @@ -207,7 +204,6 @@ private fun RightPaneContent( browseWidgetsState: BrowseWidgetsState.Data, selectedPersonalWidgetAppId: WidgetAppId?, personalWidgetPreviewsState: PreviewsState, - widgetAppIconsState: AppIconsState, selectedWorkWidgetAppId: WidgetAppId?, workWidgetPreviewsState: PreviewsState, onWidgetInteraction: (WidgetInteractionInfo) -> Unit, @@ -230,12 +226,10 @@ private fun RightPaneContent( WidgetsGrid( modifier = Modifier .fillMaxWidth() - .wrapContentSize() - .verticalScroll(rememberScrollState()), + .wrapContentSize(), showAllWidgetDetails = true, widgetSizeGroups = selectedPersonalWidgets, previews = personalWidgetPreviewsState.previews, - appIcons = widgetAppIconsState.icons, onWidgetInteraction = onWidgetInteraction, showDragShadow = showDragShadow, ) @@ -256,12 +250,10 @@ private fun RightPaneContent( WidgetsGrid( modifier = Modifier .fillMaxWidth() - .wrapContentSize() - .verticalScroll(rememberScrollState()), + .wrapContentSize(), showAllWidgetDetails = true, widgetSizeGroups = selectedWorkWidgets, previews = workWidgetPreviewsState.previews, - appIcons = widgetAppIconsState.icons, onWidgetInteraction = onWidgetInteraction, showDragShadow = showDragShadow, ) diff --git a/modules/widgetpicker/src/com/android/launcher3/widgetpicker/ui/fullcatalog/screens/search/SearchScreen.kt b/modules/widgetpicker/src/com/android/launcher3/widgetpicker/ui/fullcatalog/screens/search/SearchScreen.kt index 5bba364ace..615f808e97 100644 --- a/modules/widgetpicker/src/com/android/launcher3/widgetpicker/ui/fullcatalog/screens/search/SearchScreen.kt +++ b/modules/widgetpicker/src/com/android/launcher3/widgetpicker/ui/fullcatalog/screens/search/SearchScreen.kt @@ -20,8 +20,6 @@ import androidx.compose.foundation.layout.Box import androidx.compose.foundation.layout.fillMaxSize import androidx.compose.foundation.layout.fillMaxWidth import androidx.compose.foundation.layout.wrapContentSize -import androidx.compose.foundation.rememberScrollState -import androidx.compose.foundation.verticalScroll import androidx.compose.runtime.Composable import androidx.compose.runtime.remember import androidx.compose.ui.Modifier @@ -200,12 +198,10 @@ fun SearchScreenTwoPane( WidgetsGrid( modifier = Modifier .fillMaxWidth() - .wrapContentSize() - .verticalScroll(rememberScrollState()), + .wrapContentSize(), showAllWidgetDetails = true, widgetSizeGroups = selectedWidgets, previews = widgetPreviewsState.previews, - appIcons = appIconsState.icons, onWidgetInteraction = onWidgetInteraction, showDragShadow = showDragShadow, )