Skip to content

[Jetsurvey] Converted to use Material 3 #954

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 13 commits into from
Aug 30, 2022
Merged

[Jetsurvey] Converted to use Material 3 #954

Show file tree
Hide file tree
Changes from 1 commit
Commits
Show all changes
13 commits
Select commit Hold shift + click to select a range
ea5fb18
Initial work for converting Jetsurvey to Material3
IanGClifton Aug 19, 2022
b23ff57
Jetsurvey components converted to m3
IanGClifton Aug 19, 2022
d5c8d79
Manually matched figma colors to theme
IanGClifton Aug 19, 2022
0360ddc
Removed m2 dependency
IanGClifton Aug 19, 2022
04f641f
Fixed toolbar and status bar
IanGClifton Aug 19, 2022
d202838
Additional tweaks to better match comps
IanGClifton Aug 19, 2022
1b349cc
Spotless fixes
IanGClifton Aug 19, 2022
2894c4e
Fixes for alpha constants, content color checks, etc.
IanGClifton Aug 22, 2022
3afa815
More polish fixes
IanGClifton Aug 22, 2022
b405543
Spotless fixes
IanGClifton Aug 22, 2022
9ee2e37
Merge branch 'main' into iangclifton/jetsurvey-m3
IanGClifton Aug 23, 2022
6f465ef
Updated screenshots/animated gif; PR feedback
IanGClifton Aug 26, 2022
ede93fc
Updated app theme to m3
IanGClifton Aug 29, 2022
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Prev Previous commit
Next Next commit
More polish fixes
  • Loading branch information
@IanGClifton
IanGClifton committed Aug 22, 2022
commit 3afa815b11784b77b374b0599c23aa7ba9ccef3e
11 changes: 6 additions & 5 deletions Jetsurvey/app/src/main/java/com/example/compose/jetsurvey/signinsignup/SignInSignUp.kt
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -60,6 +60,7 @@ import androidx.compose.ui.tooling.preview.Preview
import androidx.compose.ui.unit.dp
import com.example.compose.jetsurvey.R
import com.example.compose.jetsurvey.theme.JetsurveyTheme
import com.example.compose.jetsurvey.theme.outlinedTextFieldColors
import com.example.compose.jetsurvey.theme.stronglyDeemphasizedAlpha

@Composable
Expand Down Expand Up @@ -137,7 +138,6 @@ fun Email(
Text(
text = stringResource(id = R.string.email),
style = MaterialTheme.typography.bodyMedium,
color = MaterialTheme.colorScheme.onSurface.copy(alpha = stronglyDeemphasizedAlpha)
)
},
modifier = Modifier
Expand All @@ -158,7 +158,8 @@ fun Email(
onDone = {
onImeAction()
}
)
),
colors = outlinedTextFieldColors(),
)

emailState.getError()?.let { error -> TextFieldError(textError = error) }
Expand Down Expand Up @@ -193,7 +194,6 @@ fun Password(
Text(
text = label,
style = MaterialTheme.typography.bodyMedium,
color = MaterialTheme.colorScheme.onSurface.copy(alpha = stronglyDeemphasizedAlpha)
)
},
trailingIcon = {
Expand Down Expand Up @@ -227,7 +227,8 @@ fun Password(
onDone = {
onImeAction()
}
)
),
colors = outlinedTextFieldColors()
)

passwordState.getError()?.let { error -> TextFieldError(textError = error) }
Expand Down Expand Up @@ -267,7 +268,7 @@ fun OrSignInAsGuest(
onClick = onSignedInAsGuest,
modifier = Modifier
.fillMaxWidth()
.padding(top = 20.dp, bottom = 24.dp)
.padding(top = 20.dp, bottom = 24.dp),
) {
Text(text = stringResource(id = R.string.sign_in_guest))
}
Expand Down
4 changes: 2 additions & 2 deletions Jetsurvey/app/src/main/java/com/example/compose/jetsurvey/signinsignup/WelcomeScreen.kt
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -123,7 +123,7 @@ private fun Branding(modifier: Modifier = Modifier) {
private fun Logo(
modifier: Modifier = Modifier,
) {
val assetId = if (LocalContentColor.current.luminance() > 0.5f) {
val assetId = if (LocalContentColor.current.luminance() < 0.5f) {
R.drawable.ic_logo_light
} else {
R.drawable.ic_logo_dark
Expand All @@ -147,7 +147,7 @@ private fun SignInCreateAccount(
Column(modifier = modifier, horizontalAlignment = Alignment.CenterHorizontally) {
Text(
text = stringResource(id = R.string.sign_in_create_account),
style = MaterialTheme.typography.titleSmall,
style = MaterialTheme.typography.bodyMedium,
color = MaterialTheme.colorScheme.onSurface.copy(alpha = stronglyDeemphasizedAlpha),
textAlign = TextAlign.Center,
modifier = Modifier.padding(top = 64.dp, bottom = 12.dp)
Expand Down
2 changes: 1 addition & 1 deletion Jetsurvey/app/src/main/java/com/example/compose/jetsurvey/survey/SurveyQuestions.kt
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -705,7 +705,7 @@ private fun DateQuestion(
private fun PhotoDefaultImage(
modifier: Modifier = Modifier,
) {
val assetId = if (LocalContentColor.current.luminance() > 0.5f) {
val assetId = if (LocalContentColor.current.luminance() < 0.5f) {
R.drawable.ic_selfie_light
} else {
R.drawable.ic_selfie_dark
Expand Down
2 changes: 1 addition & 1 deletion Jetsurvey/app/src/main/java/com/example/compose/jetsurvey/survey/SurveyScreen.kt
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -240,7 +240,7 @@ private fun SurveyTopAppBar(
Icons.Filled.Close,
contentDescription = stringResource(id = R.string.close),
modifier = Modifier.align(Alignment.CenterEnd),
tint = MaterialTheme.colorScheme.onSurface.copy(0.6f)
tint = MaterialTheme.colorScheme.onSurface.copy(stronglyDeemphasizedAlpha)
)
}
}
Expand Down
2 changes: 1 addition & 1 deletion Jetsurvey/app/src/main/java/com/example/compose/jetsurvey/theme/Color.kt
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -76,4 +76,4 @@ val md_theme_dark_inversePrimary = Color(0xFF8307F0)
val md_theme_dark_shadow = Color(0xFF000000)
val md_theme_dark_surfaceTint = Color(0xFFD9B9FF)

val seed = Color(0xFF8100EF)
val seed = Color(0xFF8100EF)
3 changes: 2 additions & 1 deletion Jetsurvey/app/src/main/java/com/example/compose/jetsurvey/theme/Shape.kt
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -21,5 +21,6 @@ import androidx.compose.material3.Shapes
import androidx.compose.ui.unit.dp

val Shapes = Shapes(
small = RoundedCornerShape(12.dp)
extraSmall = RoundedCornerShape(12.dp),
small = RoundedCornerShape(12.dp),
)
17 changes: 17 additions & 0 deletions Jetsurvey/app/src/main/java/com/example/compose/jetsurvey/theme/Theme.kt
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -17,7 +17,10 @@
package com.example.compose.jetsurvey.theme

import androidx.compose.foundation.isSystemInDarkTheme
import androidx.compose.material3.ExperimentalMaterial3Api
import androidx.compose.material3.MaterialTheme
import androidx.compose.material3.TextFieldColors
import androidx.compose.material3.TextFieldDefaults
import androidx.compose.material3.darkColorScheme
import androidx.compose.material3.lightColorScheme
import androidx.compose.runtime.Composable
Expand Down Expand Up @@ -87,6 +90,20 @@ private val DarkColors = darkColorScheme(
surfaceTint = md_theme_dark_surfaceTint,
)

@OptIn(ExperimentalMaterial3Api::class) // outlinedTextFieldColors is experimental in m3
@Composable
fun outlinedTextFieldColors() : TextFieldColors =
TextFieldDefaults.outlinedTextFieldColors(
unfocusedLabelColor = MaterialTheme.colorScheme.onSurface
.copy(alpha = stronglyDeemphasizedAlpha),
unfocusedBorderColor = MaterialTheme.colorScheme.onSurface
.copy(alpha = 0.38f),
focusedTrailingIconColor = MaterialTheme.colorScheme.onSurface
.copy(alpha = stronglyDeemphasizedAlpha),
unfocusedTrailingIconColor = MaterialTheme.colorScheme.onSurface
.copy(alpha = stronglyDeemphasizedAlpha),
)

@Composable
fun JetsurveyTheme(
useDarkTheme: Boolean = isSystemInDarkTheme(),
Expand Down
2 changes: 1 addition & 1 deletion Jetsurvey/app/src/main/java/com/example/compose/jetsurvey/theme/Typography.kt
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -60,7 +60,7 @@ val Typography = Typography(
letterSpacing = 0.sp,
),

// Headline Large - Montserrat 32/40 . 0px
// Headline Large - Montserrat 32/40 . 0px
headlineLarge = TextStyle(
fontFamily = MontserratFontFamily,
fontWeight = FontWeight.W400,
Expand Down