Skip to content
This repository has been archived by the owner on Aug 2, 2024. It is now read-only.

Commit

Permalink
Adding m3 ui updates to Sunflower
Browse files Browse the repository at this point in the history
  • Loading branch information
@MagicalMeghan
MagicalMeghan committed Aug 17, 2023
1 parent dff09b3 commit 267fce5
Show file tree
Hide file tree
Showing 6 changed files with 139 additions and 40 deletions.
9 changes: 4 additions & 5 deletions app/src/main/java/com/google/samples/apps/sunflower/compose/garden/GardenScreen.kt
View file
Original file line number Diff line number Diff line change
Expand Up @@ -30,6 +30,8 @@ import androidx.compose.foundation.lazy.grid.items
import androidx.compose.foundation.lazy.grid.rememberLazyGridState
import androidx.compose.material3.Button
import androidx.compose.material3.ButtonDefaults
import androidx.compose.material3.CardColors
import androidx.compose.material3.CardDefaults
import androidx.compose.material3.ElevatedCard
import androidx.compose.material3.ExperimentalMaterial3Api
import androidx.compose.material3.MaterialTheme
Expand Down Expand Up @@ -136,7 +138,8 @@ private fun GardenListItem(
end = cardSideMargin,
bottom = dimensionResource(id = R.dimen.card_bottom_margin)
),
shape = MaterialTheme.shapes.medium
shape = MaterialTheme.shapes.medium,
colors = CardDefaults.cardColors(containerColor = MaterialTheme.colorScheme.secondaryContainer)
) {
Column(Modifier.fillMaxWidth()) {
SunflowerImage(
Expand All @@ -162,7 +165,6 @@ private fun GardenListItem(
text = stringResource(id = R.string.plant_date_header),
Modifier.align(Alignment.CenterHorizontally),
fontWeight = FontWeight.Bold,
color = MaterialTheme.colorScheme.secondary,
style = MaterialTheme.typography.titleSmall
)
Text(
Expand All @@ -178,7 +180,6 @@ private fun GardenListItem(
.align(Alignment.CenterHorizontally)
.padding(top = marginNormal),
fontWeight = FontWeight.Bold,
color = MaterialTheme.colorScheme.secondary,
style = MaterialTheme.typography.titleSmall
)
Text(
Expand Down Expand Up @@ -216,12 +217,10 @@ private fun EmptyGarden(onAddPlantClick: () -> Unit, modifier: Modifier = Modifi
style = MaterialTheme.typography.headlineSmall
)
Button(
colors = ButtonDefaults.buttonColors(MaterialTheme.colorScheme.tertiary),
shape = MaterialTheme.shapes.medium,
onClick = onAddPlantClick
) {
Text(
color = MaterialTheme.colorScheme.onSurface,
text = stringResource(id = R.string.add_plant)
)
}
Expand Down
12 changes: 5 additions & 7 deletions app/src/main/java/com/google/samples/apps/sunflower/compose/home/HomeScreen.kt
View file
Original file line number Diff line number Diff line change
Expand Up @@ -110,8 +110,7 @@ fun HomePagerScreen(

// Tab Row
TabRow(
selectedTabIndex = pagerState.currentPage,
containerColor = MaterialTheme.colorScheme.background,
selectedTabIndex = pagerState.currentPage
) {
pages.forEachIndexed { index, page ->
val title = stringResource(id = page.titleResId)
Expand All @@ -125,8 +124,7 @@ fun HomePagerScreen(
contentDescription = title
)
},
unselectedContentColor = MaterialTheme.colorScheme.secondary,
selectedContentColor = MaterialTheme.colorScheme.tertiary,
unselectedContentColor = MaterialTheme.colorScheme.secondary
)
}
}
Expand Down Expand Up @@ -177,7 +175,8 @@ private fun HomeTopAppBar(
horizontalArrangement = Arrangement.Center,
) {
Text(
text = stringResource(id = R.string.app_name)
text = stringResource(id = R.string.app_name),
style = MaterialTheme.typography.displaySmall
)
}
},
Expand All @@ -189,8 +188,7 @@ private fun HomeTopAppBar(
painter = painterResource(id = R.drawable.ic_filter_list_24dp),
contentDescription = stringResource(
id = R.string.menu_filter_by_grow_zone
),
tint = MaterialTheme.colorScheme.onSurface
)
)
}
}
Expand Down
5 changes: 1 addition & 4 deletions app/src/main/java/com/google/samples/apps/sunflower/compose/plantdetail/PlantDetailView.kt
View file
Original file line number Diff line number Diff line change
Expand Up @@ -358,8 +358,6 @@ private fun PlantFab(
FloatingActionButton(
onClick = onFabClick,
shape = MaterialTheme.shapes.small,
containerColor = MaterialTheme.colorScheme.tertiary,
contentColor = MaterialTheme.colorScheme.onSurface,
// Semantics in parent due to https://issuetracker.google.com/184825850
modifier = modifier.semantics {
contentDescription = addPlantContentDescription
Expand Down Expand Up @@ -520,7 +518,7 @@ private fun PlantInformation(
Column(modifier = modifier.padding(Dimens.PaddingLarge)) {
Text(
text = name,
style = MaterialTheme.typography.headlineSmall,
style = MaterialTheme.typography.displaySmall,
modifier = Modifier
.padding(
start = Dimens.PaddingSmall,
Expand All @@ -543,7 +541,6 @@ private fun PlantInformation(
Column(Modifier.fillMaxWidth()) {
Text(
text = stringResource(id = R.string.watering_needs_prefix),
color = MaterialTheme.colorScheme.secondary,
fontWeight = FontWeight.Bold,
modifier = Modifier
.padding(horizontal = Dimens.PaddingSmall)
Expand Down
3 changes: 3 additions & 0 deletions app/src/main/java/com/google/samples/apps/sunflower/compose/plantlist/PlantListItemView.kt
View file
Original file line number Diff line number Diff line change
Expand Up @@ -22,6 +22,7 @@ import androidx.compose.foundation.layout.height
import androidx.compose.foundation.layout.padding
import androidx.compose.foundation.layout.wrapContentWidth
import androidx.compose.material3.Card
import androidx.compose.material3.CardDefaults
import androidx.compose.material3.ExperimentalMaterial3Api
import androidx.compose.material3.MaterialTheme
import androidx.compose.material3.Text
Expand Down Expand Up @@ -53,6 +54,7 @@ fun ImageListItem(name: String, imageUrl: String, onClick: () -> Unit) {
Card(
onClick = onClick,
shape = MaterialTheme.shapes.medium,
colors = CardDefaults.cardColors(containerColor = MaterialTheme.colorScheme.secondaryContainer),
modifier = Modifier
.padding(horizontal = dimensionResource(id = R.dimen.card_side_margin))
.padding(bottom = dimensionResource(id = R.dimen.card_bottom_margin))
Expand All @@ -70,6 +72,7 @@ fun ImageListItem(name: String, imageUrl: String, onClick: () -> Unit) {
text = name,
textAlign = TextAlign.Center,
maxLines = 1,
style = MaterialTheme.typography.titleMedium,
modifier = Modifier
.fillMaxWidth()
.padding(vertical = dimensionResource(id = R.dimen.margin_normal))
Expand Down
75 changes: 66 additions & 9 deletions app/src/main/java/com/google/samples/apps/sunflower/ui/Color.kt
View file
Original file line number Diff line number Diff line change
Expand Up @@ -18,12 +18,69 @@ package com.google.samples.apps.sunflower.ui

import androidx.compose.ui.graphics.Color

val sunflower_white = Color(0xdeffffff)
val sunflower_gray_50 = Color(0xfffafafa)
val sunflower_yellow_300 = Color(0xfff8f99f)
val sunflower_yellow_500 = Color(0xffffff63)
val sunflower_green_300 = Color(0xff6dc790)
val sunflower_green_500 = Color(0xff49bb79)
val sunflower_green_700 = Color(0xff005d2b)
val sunflower_green_900 = Color(0xff1a231e)
val sunflower_black = Color(0xde000000)
val md_theme_light_primary = Color(0xFF246D00)
val md_theme_light_onPrimary = Color(0xFFFFFFFF)
val md_theme_light_primaryContainer = Color(0xFFA6F780)
val md_theme_light_onPrimaryContainer = Color(0xFF062100)
val md_theme_light_secondary = Color(0xFF55624C)
val md_theme_light_onSecondary = Color(0xFFFFFFFF)
val md_theme_light_secondaryContainer = Color(0xFFD8E7CB)
val md_theme_light_onSecondaryContainer = Color(0xFF131F0D)
val md_theme_light_tertiary = Color(0xFF386667)
val md_theme_light_onTertiary = Color(0xFFFFFFFF)
val md_theme_light_tertiaryContainer = Color(0xFFBBEBEC)
val md_theme_light_onTertiaryContainer = Color(0xFF002021)
val md_theme_light_error = Color(0xFFBA1A1A)
val md_theme_light_errorContainer = Color(0xFFFFDAD6)
val md_theme_light_onError = Color(0xFFFFFFFF)
val md_theme_light_onErrorContainer = Color(0xFF410002)
val md_theme_light_background = Color(0xFFFDFDF6)
val md_theme_light_onBackground = Color(0xFF1A1C18)
val md_theme_light_surface = Color(0xFFFDFDF6)
val md_theme_light_onSurface = Color(0xFF1A1C18)
val md_theme_light_surfaceVariant = Color(0xFFDFE4D7)
val md_theme_light_onSurfaceVariant = Color(0xFF43483E)
val md_theme_light_outline = Color(0xFF73796D)
val md_theme_light_inverseOnSurface = Color(0xFFF1F1EA)
val md_theme_light_inverseSurface = Color(0xFF2F312D)
val md_theme_light_inversePrimary = Color(0xFF8BDA67)
val md_theme_light_shadow = Color(0xFF000000)
val md_theme_light_surfaceTint = Color(0xFF246D00)
val md_theme_light_outlineVariant = Color(0xFFC3C8BB)
val md_theme_light_scrim = Color(0xFF000000)

val md_theme_dark_primary = Color(0xFF8BDA67)
val md_theme_dark_onPrimary = Color(0xFF0F3900)
val md_theme_dark_primaryContainer = Color(0xFF195200)
val md_theme_dark_onPrimaryContainer = Color(0xFFA6F780)
val md_theme_dark_secondary = Color(0xFFBCCBB0)
val md_theme_dark_onSecondary = Color(0xFF273421)
val md_theme_dark_secondaryContainer = Color(0xFF3E4A36)
val md_theme_dark_onSecondaryContainer = Color(0xFFD8E7CB)
val md_theme_dark_tertiary = Color(0xFFA0CFD0)
val md_theme_dark_onTertiary = Color(0xFF003738)
val md_theme_dark_tertiaryContainer = Color(0xFF1E4E4F)
val md_theme_dark_onTertiaryContainer = Color(0xFFBBEBEC)
val md_theme_dark_error = Color(0xFFFFB4AB)
val md_theme_dark_errorContainer = Color(0xFF93000A)
val md_theme_dark_onError = Color(0xFF690005)
val md_theme_dark_onErrorContainer = Color(0xFFFFDAD6)
val md_theme_dark_background = Color(0xFF1A1C18)
val md_theme_dark_onBackground = Color(0xFFE3E3DC)
val md_theme_dark_surface = Color(0xFF1A1C18)
val md_theme_dark_onSurface = Color(0xFFE3E3DC)
val md_theme_dark_surfaceVariant = Color(0xFF43483E)
val md_theme_dark_onSurfaceVariant = Color(0xFFC3C8BB)
val md_theme_dark_outline = Color(0xFF8D9287)
val md_theme_dark_inverseOnSurface = Color(0xFF1A1C18)
val md_theme_dark_inverseSurface = Color(0xFFE3E3DC)
val md_theme_dark_inversePrimary = Color(0xFF246D00)
val md_theme_dark_shadow = Color(0xFF000000)
val md_theme_dark_surfaceTint = Color(0xFF8BDA67)
val md_theme_dark_outlineVariant = Color(0xFF43483E)
val md_theme_dark_scrim = Color(0xFF000000)


val seed = Color(0xFF256F00)


75 changes: 60 additions & 15 deletions app/src/main/java/com/google/samples/apps/sunflower/ui/Theme.kt
View file
Original file line number Diff line number Diff line change
Expand Up @@ -35,23 +35,68 @@ import androidx.core.view.WindowCompat
import com.google.accompanist.systemuicontroller.rememberSystemUiController

private val LightColors = lightColorScheme(
primary = sunflower_green_500,
secondary = sunflower_green_700,
onPrimary = sunflower_gray_50,
onSurface = sunflower_black,
surface = sunflower_gray_50,
tertiary = sunflower_yellow_500,
background = sunflower_green_500
primary = md_theme_light_primary,
onPrimary = md_theme_light_onPrimary,
primaryContainer = md_theme_light_primaryContainer,
onPrimaryContainer = md_theme_light_onPrimaryContainer,
secondary = md_theme_light_secondary,
onSecondary = md_theme_light_onSecondary,
secondaryContainer = md_theme_light_secondaryContainer,
onSecondaryContainer = md_theme_light_onSecondaryContainer,
tertiary = md_theme_light_tertiary,
onTertiary = md_theme_light_onTertiary,
tertiaryContainer = md_theme_light_tertiaryContainer,
onTertiaryContainer = md_theme_light_onTertiaryContainer,
error = md_theme_light_error,
errorContainer = md_theme_light_errorContainer,
onError = md_theme_light_onError,
onErrorContainer = md_theme_light_onErrorContainer,
background = md_theme_light_background,
onBackground = md_theme_light_onBackground,
surface = md_theme_light_surface,
onSurface = md_theme_light_onSurface,
surfaceVariant = md_theme_light_surfaceVariant,
onSurfaceVariant = md_theme_light_onSurfaceVariant,
outline = md_theme_light_outline,
inverseOnSurface = md_theme_light_inverseOnSurface,
inverseSurface = md_theme_light_inverseSurface,
inversePrimary = md_theme_light_inversePrimary,
surfaceTint = md_theme_light_surfaceTint,
outlineVariant = md_theme_light_outlineVariant,
scrim = md_theme_light_scrim,
)

val DarkColors = darkColorScheme(
primary = sunflower_green_900,
onPrimary = sunflower_yellow_300,
secondary = sunflower_yellow_500,
onSurface = sunflower_white,
surface = sunflower_black,
tertiary = sunflower_yellow_300,
background = sunflower_black

private val DarkColors = darkColorScheme(
primary = md_theme_dark_primary,
onPrimary = md_theme_dark_onPrimary,
primaryContainer = md_theme_dark_primaryContainer,
onPrimaryContainer = md_theme_dark_onPrimaryContainer,
secondary = md_theme_dark_secondary,
onSecondary = md_theme_dark_onSecondary,
secondaryContainer = md_theme_dark_secondaryContainer,
onSecondaryContainer = md_theme_dark_onSecondaryContainer,
tertiary = md_theme_dark_tertiary,
onTertiary = md_theme_dark_onTertiary,
tertiaryContainer = md_theme_dark_tertiaryContainer,
onTertiaryContainer = md_theme_dark_onTertiaryContainer,
error = md_theme_dark_error,
errorContainer = md_theme_dark_errorContainer,
onError = md_theme_dark_onError,
onErrorContainer = md_theme_dark_onErrorContainer,
background = md_theme_dark_background,
onBackground = md_theme_dark_onBackground,
surface = md_theme_dark_surface,
onSurface = md_theme_dark_onSurface,
surfaceVariant = md_theme_dark_surfaceVariant,
onSurfaceVariant = md_theme_dark_onSurfaceVariant,
outline = md_theme_dark_outline,
inverseOnSurface = md_theme_dark_inverseOnSurface,
inverseSurface = md_theme_dark_inverseSurface,
inversePrimary = md_theme_dark_inversePrimary,
surfaceTint = md_theme_dark_surfaceTint,
outlineVariant = md_theme_dark_outlineVariant,
scrim = md_theme_dark_scrim,
)

@Composable
Expand Down

0 comments on commit 267fce5

Please sign in to comment.