Merge pull request #476 from angeles-bilbao6/issue460/date-slider-photo

[Jetsurvey] Issue460/date slider photo

Author: florina-muntenescu

Jetsurvey/app/src/main/java/com/example/compose/jetsurvey/survey/Survey.kt

@@ -61,7 +61,8 @@ sealed class PossibleAnswer {
         val steps: Int,
         @StringRes val startText: Int,
         @StringRes val endText: Int,
-        val defaultValue: Float = range.start
+        @StringRes val neutralText: Int,
+        val defaultValue: Float = 5.5f
     ) : PossibleAnswer()
 }
 

Jetsurvey/app/src/main/java/com/example/compose/jetsurvey/survey/SurveyFragment.kt

@@ -88,7 +88,10 @@ class SurveyFragment : Fragment() {
     }
 
     private fun showDatePicker(questionId: Int) {
-        val picker = MaterialDatePicker.Builder.datePicker().build()
+        val date = viewModel.getCurrentDate(questionId = questionId)
+        val picker = MaterialDatePicker.Builder.datePicker()
+            .setSelection(date)
+            .build()
         activity?.let {
             picker.show(it.supportFragmentManager, picker.toString())
             picker.addOnPositiveButtonClickListener {

Jetsurvey/app/src/main/java/com/example/compose/jetsurvey/survey/SurveyQuestions.kt

@@ -16,10 +16,10 @@
 
 package com.example.compose.jetsurvey.survey
 
-import androidx.annotation.StringRes
 import androidx.compose.foundation.BorderStroke
 import androidx.compose.foundation.Image
 import androidx.compose.foundation.background
+import androidx.compose.foundation.border
 import androidx.compose.foundation.clickable
 import androidx.compose.foundation.layout.Arrangement
 import androidx.compose.foundation.layout.Column
@@ -36,6 +36,7 @@ import androidx.compose.foundation.layout.wrapContentSize
 import androidx.compose.foundation.lazy.LazyColumn
 import androidx.compose.foundation.selection.selectable
 import androidx.compose.material.Button
+import androidx.compose.material.ButtonDefaults
 import androidx.compose.material.Checkbox
 import androidx.compose.material.CheckboxDefaults
 import androidx.compose.material.ContentAlpha
@@ -50,6 +51,7 @@ import androidx.compose.material.Surface
 import androidx.compose.material.Text
 import androidx.compose.material.icons.Icons
 import androidx.compose.material.icons.filled.AddAPhoto
+import androidx.compose.material.icons.filled.ArrowDropDown
 import androidx.compose.material.icons.filled.SwapHoriz
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.CompositionLocalProvider
@@ -61,11 +63,15 @@ import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.res.painterResource
 import androidx.compose.ui.res.stringResource
+import androidx.compose.ui.text.style.TextAlign
 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.google.accompanist.coil.rememberCoilPainter
+import java.text.SimpleDateFormat
+import java.util.Date
+import java.util.Locale
 
 @Composable
 fun Question(
@@ -305,7 +311,6 @@ private fun ActionQuestion(
         SurveyActionType.PICK_DATE -> {
             DateQuestion(
                 questionId = questionId,
-                answerLabel = possibleAnswer.label,
                 answer = answer,
                 onAction = onAction,
                 modifier = modifier
@@ -379,25 +384,41 @@ private fun PhotoQuestion(
 @Composable
 private fun DateQuestion(
     questionId: Int,
-    @StringRes answerLabel: Int,
     answer: Answer.Action?,
     onAction: (Int, SurveyActionType) -> Unit,
     modifier: Modifier = Modifier
 ) {
-    // val date = Date()
-    // val formatter = SimpleDateFormat("dd/MM/yyyy")
+    val date = if (answer != null && answer.result is SurveyActionResult.Date) {
+        answer.result.date
+    } else {
+        SimpleDateFormat("EEE, MMM d", Locale.getDefault()).format(Date())
+    }
     Button(
         onClick = { onAction(questionId, SurveyActionType.PICK_DATE) },
-        modifier = modifier.padding(vertical = 20.dp)
-    ) {
-        Text(text = stringResource(id = answerLabel))
-    }
+        colors = ButtonDefaults.buttonColors(
+            backgroundColor = MaterialTheme.colors.onPrimary,
+            contentColor = MaterialTheme.colors.onSecondary
+        ),
+        shape = MaterialTheme.shapes.small,
+        modifier = modifier
+            .padding(vertical = 20.dp)
+            .height(54.dp),
+        elevation = ButtonDefaults.elevation(0.dp),
+        border = BorderStroke(1.dp, MaterialTheme.colors.onSurface.copy(alpha = 0.12f))
 
-    if (answer != null && answer.result is SurveyActionResult.Date) {
+    ) {
         Text(
-            text = stringResource(R.string.selected_date, answer.result.date),
-            style = MaterialTheme.typography.h4,
-            modifier = Modifier.padding(vertical = 20.dp)
+            text = date,
+            modifier = Modifier
+                .fillMaxWidth()
+                .weight(1.8f)
+        )
+        Icon(
+            imageVector = Icons.Filled.ArrowDropDown,
+            contentDescription = null,
+            modifier = Modifier
+                .fillMaxWidth()
+                .weight(0.2f)
         )
     }
 }
@@ -430,10 +451,7 @@ private fun SliderQuestion(
         mutableStateOf(answer?.answerValue ?: possibleAnswer.defaultValue)
     }
     Row(modifier = modifier) {
-        Text(
-            text = stringResource(id = possibleAnswer.startText),
-            modifier = Modifier.align(Alignment.CenterVertically)
-        )
+
         Slider(
             value = sliderPosition,
             onValueChange = {
@@ -446,9 +464,31 @@ private fun SliderQuestion(
                 .weight(1f)
                 .padding(horizontal = 16.dp)
         )
+    }
+    Row {
+        Text(
+            text = stringResource(id = possibleAnswer.startText),
+            style = MaterialTheme.typography.caption,
+            textAlign = TextAlign.Start,
+            modifier = Modifier
+                .fillMaxWidth()
+                .weight(1.8f)
+        )
+        Text(
+            text = stringResource(id = possibleAnswer.neutralText),
+            style = MaterialTheme.typography.caption,
+            textAlign = TextAlign.Center,
+            modifier = Modifier
+                .fillMaxWidth()
+                .weight(1.8f)
+        )
         Text(
             text = stringResource(id = possibleAnswer.endText),
-            modifier = Modifier.align(Alignment.CenterVertically)
+            style = MaterialTheme.typography.caption,
+            textAlign = TextAlign.End,
+            modifier = Modifier
+                .fillMaxWidth()
+                .weight(1.8f)
         )
     }
 }

Jetsurvey/app/src/main/java/com/example/compose/jetsurvey/survey/SurveyRepository.kt

@@ -79,8 +79,9 @@ private val jetpackQuestions = mutableListOf(
         answer = PossibleAnswer.Slider(
             range = 1f..10f,
             steps = 3,
-            startText = R.string.selfie_min,
-            endText = R.string.selfie_max
+            startText = R.string.strongly_dislike,
+            endText = R.string.strongly_like,
+            neutralText = R.string.neutral
         )
     )
 ).apply {

Jetsurvey/app/src/main/java/com/example/compose/jetsurvey/survey/SurveyScreen.kt

@@ -16,6 +16,7 @@
 
 package com.example.compose.jetsurvey.survey
 
+import androidx.compose.animation.core.animateFloatAsState
 import androidx.compose.foundation.layout.Box
 import androidx.compose.foundation.layout.Column
 import androidx.compose.foundation.layout.Row
@@ -34,13 +35,15 @@ import androidx.compose.material.LinearProgressIndicator
 import androidx.compose.material.LocalContentAlpha
 import androidx.compose.material.MaterialTheme
 import androidx.compose.material.OutlinedButton
+import androidx.compose.material.ProgressIndicatorDefaults
 import androidx.compose.material.Scaffold
 import androidx.compose.material.Surface
 import androidx.compose.material.Text
 import androidx.compose.material.icons.Icons
 import androidx.compose.material.icons.filled.Close
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.CompositionLocalProvider
+import androidx.compose.runtime.getValue
 import androidx.compose.runtime.remember
 import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
@@ -206,8 +209,12 @@ private fun SurveyTopAppBar(
                 }
             }
         }
+        val animatedProgress by animateFloatAsState(
+            targetValue = (questionIndex + 1) / totalQuestionsCount.toFloat(),
+            animationSpec = ProgressIndicatorDefaults.ProgressAnimationSpec
+        )
         LinearProgressIndicator(
-            progress = (questionIndex + 1) / totalQuestionsCount.toFloat(),
+            progress = animatedProgress,
             modifier = Modifier
                 .fillMaxWidth()
                 .padding(horizontal = 20.dp),

Jetsurvey/app/src/main/java/com/example/compose/jetsurvey/survey/SurveyViewModel.kt

@@ -22,6 +22,9 @@ import androidx.lifecycle.MutableLiveData
 import androidx.lifecycle.ViewModel
 import androidx.lifecycle.ViewModelProvider
 import androidx.lifecycle.viewModelScope
+import java.text.SimpleDateFormat
+import java.util.Date
+import java.util.Locale
 import kotlinx.coroutines.launch
 
 class SurveyViewModel(
@@ -69,6 +72,10 @@ class SurveyViewModel(
         updateStateWithActionResult(questionId, SurveyActionResult.Date(date))
     }
 
+    fun getCurrentDate(questionId: Int): Long {
+        return getSelectedDate(questionId)
+    }
+
     fun getUriToSaveImage(): Uri? {
         uri = photoUriManager.buildNewUri()
         return uri
@@ -101,6 +108,25 @@ class SurveyViewModel(
         }
         return null
     }
+
+    private fun getSelectedDate(questionId: Int): Long {
+        val latestState = _uiState.value
+        var ret = Date().time
+        if (latestState != null && latestState is SurveyState.Questions) {
+            val question =
+                latestState.questionsState.first { questionState ->
+                    questionState.question.id == questionId
+                }
+            val answer: Answer.Action? = question.answer as Answer.Action?
+            if (answer != null && answer.result is SurveyActionResult.Date) {
+                val formatter = SimpleDateFormat("MMM dd, yyyy", Locale.ENGLISH)
+                val formatted = formatter.parse(answer.result.date)
+                if (formatted is Date)
+                    ret = formatted.time
+            }
+        }
+        return ret
+    }
 }
 
 class SurveyViewModelFactory(

Jetsurvey/app/src/main/res/values/strings.xml

@@ -92,4 +92,7 @@
     <string name="survey_result">Congratulations, you are %s</string>
     <string name="survey_result_description">You are a curious developer, always willing to try
         something new. You want to stay up to date with the trends to Compose is your middle name</string>
+    <string name="strongly_dislike">Strongly\nDislike</string>
+    <string name="strongly_like">Strongly\nLike</string>
+    <string name="neutral">Neutral</string>
 </resources>