Report Submitted Screen #60
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,146 @@ | ||
| package com.cornellappdev.uplift.ui.screens | ||
|
|
||
| import androidx.compose.foundation.Image | ||
| import androidx.compose.foundation.background | ||
| import androidx.compose.foundation.clickable | ||
| import androidx.compose.foundation.layout.Arrangement | ||
| import androidx.compose.foundation.layout.Column | ||
| import androidx.compose.foundation.layout.Row | ||
| import androidx.compose.foundation.layout.fillMaxSize | ||
| import androidx.compose.foundation.layout.height | ||
| import androidx.compose.foundation.layout.padding | ||
| import androidx.compose.foundation.layout.width | ||
| import androidx.compose.foundation.shape.RoundedCornerShape | ||
| import androidx.compose.material.icons.Icons | ||
| import androidx.compose.material.icons.automirrored.filled.ArrowForward | ||
| import androidx.compose.material3.Icon | ||
| import androidx.compose.material3.Scaffold | ||
| import androidx.compose.material3.Surface | ||
| import androidx.compose.material3.Text | ||
| import androidx.compose.runtime.Composable | ||
| import androidx.compose.ui.Alignment | ||
| import androidx.compose.ui.Modifier | ||
| import androidx.compose.ui.graphics.Color | ||
| import androidx.compose.ui.res.painterResource | ||
| import androidx.compose.ui.text.font.FontWeight | ||
| import androidx.compose.ui.text.style.TextAlign | ||
| import androidx.compose.ui.tooling.preview.Preview | ||
| import androidx.compose.ui.unit.dp | ||
| import androidx.compose.ui.unit.sp | ||
| import com.cornellappdev.uplift.R | ||
| import com.cornellappdev.uplift.ui.components.general.UpliftTopBarWithBack | ||
| import com.cornellappdev.uplift.util.GRAY01 | ||
| import com.cornellappdev.uplift.util.GRAY04 | ||
| import com.cornellappdev.uplift.util.GRAY05 | ||
| import com.cornellappdev.uplift.util.montserratFamily | ||
|
|
||
| /** | ||
| * Screen displayed after a user submits a report. | ||
| */ | ||
| @Composable | ||
| fun ReportSubmittedScreen( | ||
| onSubmitAnother: () -> Unit = {}, | ||
| onReturnHome: () -> Unit = {} | ||
| ) { | ||
| Scaffold(topBar = { | ||
| UpliftTopBarWithBack( | ||
| title = "Report an issue", | ||
| withBack = false | ||
| ) | ||
| }) { padding -> | ||
| Column( | ||
| modifier = Modifier | ||
| .padding(padding) | ||
| .fillMaxSize() | ||
| .background(Color.White), | ||
| verticalArrangement = Arrangement.spacedBy( | ||
| 60.dp, | ||
| Alignment.CenterVertically | ||
| ), | ||
| horizontalAlignment = Alignment.CenterHorizontally | ||
| ) { | ||
| Column( | ||
| horizontalAlignment = Alignment.CenterHorizontally, | ||
| verticalArrangement = Arrangement.spacedBy(26.dp) | ||
| ) { | ||
| Image( | ||
| painter = painterResource(id = R.drawable.ic_check_circle), | ||
| contentDescription = "Check Circle", | ||
| ) | ||
| Column( | ||
| horizontalAlignment = Alignment.CenterHorizontally, | ||
| verticalArrangement = Arrangement.spacedBy(10.dp) | ||
| ) { | ||
| Text( | ||
| text = "Thank you for your input!", | ||
| fontFamily = montserratFamily, | ||
| fontWeight = FontWeight.Bold, | ||
| fontSize = 16.sp, | ||
| ) | ||
| Text( | ||
| text = "Your report has been submitted.", | ||
| fontFamily = montserratFamily, | ||
| fontSize = 14.sp, | ||
| ) | ||
| } | ||
|
|
||
|
There was a problem hiding this comment. It's a tad bit difficult to read the nested composables here; please pull this out into a new |
||
| } | ||
| Column( | ||
| verticalArrangement = Arrangement.spacedBy(16.dp), | ||
| ) { | ||
| Surface( | ||
| color = GRAY01, | ||
| shape = RoundedCornerShape(38.dp), | ||
| modifier = Modifier | ||
| .width(184.dp) | ||
| .height(42.dp), | ||
| shadowElevation = 2.dp, | ||
| onClick = { onSubmitAnother() } | ||
| ) { | ||
| Text( | ||
| text = "SUBMIT ANOTHER", | ||
| fontFamily = montserratFamily, | ||
| fontSize = 14.sp, | ||
| fontWeight = FontWeight.Bold, | ||
| textAlign = TextAlign.Center, | ||
| modifier = Modifier.padding(12.dp) | ||
| ) | ||
|
There was a problem hiding this comment. Same thing with this column, |
||
| } | ||
| Row( | ||
| modifier = Modifier | ||
| .width(184.dp) | ||
| .clickable(onClick = { onReturnHome() }), | ||
| verticalAlignment = Alignment.CenterVertically, | ||
| horizontalArrangement = Arrangement.spacedBy( | ||
| 8.dp, | ||
| Alignment.CenterHorizontally | ||
| ), | ||
| ) { | ||
| Text( | ||
| text = "Return to Home", | ||
| fontFamily = montserratFamily, | ||
| fontSize = 14.sp, | ||
| fontWeight = FontWeight.Medium, | ||
| color = GRAY04 | ||
| ) | ||
| Icon( | ||
| imageVector = Icons.AutoMirrored.Filled.ArrowForward, | ||
| contentDescription = "Right Arrow", | ||
| tint = GRAY05, | ||
| modifier = Modifier | ||
| .height(20.dp) | ||
|
|
||
| ) | ||
| } | ||
|
|
||
| } | ||
| } | ||
| } | ||
|
|
||
| } | ||
|
|
||
| @Preview(showBackground = true) | ||
| @Composable | ||
| private fun ReportSubmittedScreenPreview() { | ||
| ReportSubmittedScreen() | ||
| } | ||
|
Comment on lines
+163
to
+167
There was a problem hiding this comment. I do want to make sure that this screen looks correct on several device heights. I actually can't really tell how you're centering the text from the composables above, but... In general, suppose we centered an object on one device by padding some In general, usages of like There was a problem hiding this comment. Hi, sorry for the disorganized composables, I extracted them into private composables, but the general idea for centering was I used from the main outermost column to center the inner most composables vertically and then space them apart by 60.dp There was a problem hiding this comment. Ah okay I see, I actually didn't know you could used |
||
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,17 @@ | ||
| <vector xmlns:android="http://schemas.android.com/apk/res/android" | ||
| android:width="111dp" | ||
| android:height="111dp" | ||
| android:viewportWidth="111" | ||
| android:viewportHeight="111"> | ||
| <path | ||
| android:pathData="M55.5,2L55.5,2A53.5,53.5 0,0 1,109 55.5L109,55.5A53.5,53.5 0,0 1,55.5 109L55.5,109A53.5,53.5 0,0 1,2 55.5L2,55.5A53.5,53.5 0,0 1,55.5 2z" | ||
| android:strokeWidth="3" | ||
| android:fillColor="#00000000" | ||
| android:strokeColor="#64C270"/> | ||
| <path | ||
| android:pathData="M32.17,59.41L45.9,71.5C46.31,71.87 46.95,71.83 47.31,71.41L78.83,35.5" | ||
| android:strokeWidth="6" | ||
| android:fillColor="#00000000" | ||
| android:strokeColor="#64C270" | ||
| android:strokeLineCap="round"/> | ||
| </vector> |
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Add a TODO to replace with a viewmodel!