#21 further styling subject
This commit is contained in:
		
							parent
							
								
									c33aad5496
								
							
						
					
					
						commit
						7ad1047091
					
				
					 7 changed files with 94 additions and 40 deletions
				
			
		|  | @ -37,7 +37,7 @@ fun BasicTextButton(@StringRes text: Int, modifier: Modifier, action: () -> Unit | ||||||
| @Composable | @Composable | ||||||
| fun BasicButton( | fun BasicButton( | ||||||
|     @StringRes text: Int, |     @StringRes text: Int, | ||||||
|     modifier: Modifier, |     modifier: Modifier = Modifier, | ||||||
|     colors: ButtonColors = ButtonDefaults.buttonColors(), |     colors: ButtonColors = ButtonDefaults.buttonColors(), | ||||||
|     border: BorderStroke? = null, |     border: BorderStroke? = null, | ||||||
|     onClick: () -> Unit, |     onClick: () -> Unit, | ||||||
|  | @ -65,12 +65,13 @@ fun BasicButtonPreview() { | ||||||
| @Composable | @Composable | ||||||
| fun StealthButton( | fun StealthButton( | ||||||
|     @StringRes text: Int, |     @StringRes text: Int, | ||||||
|  |     modifier: Modifier = Modifier.card(), | ||||||
|     onClick: () -> Unit, |     onClick: () -> Unit, | ||||||
| ) { | ) { | ||||||
|     BasicButton( |     BasicButton( | ||||||
|         text = text, |         text = text, | ||||||
|         onClick = onClick, |         onClick = onClick, | ||||||
|         modifier = Modifier.card(), |         modifier = modifier, | ||||||
|         colors = ButtonDefaults.buttonColors( |         colors = ButtonDefaults.buttonColors( | ||||||
|             backgroundColor = MaterialTheme.colors.surface, |             backgroundColor = MaterialTheme.colors.surface, | ||||||
|             contentColor = MaterialTheme.colors.onSurface |             contentColor = MaterialTheme.colors.onSurface | ||||||
|  |  | ||||||
|  | @ -3,22 +3,30 @@ package be.ugent.sel.studeez.common.composable | ||||||
| import androidx.compose.foundation.background | import androidx.compose.foundation.background | ||||||
| import androidx.compose.foundation.layout.Arrangement | import androidx.compose.foundation.layout.Arrangement | ||||||
| import androidx.compose.foundation.layout.Box | import androidx.compose.foundation.layout.Box | ||||||
|  | import androidx.compose.foundation.layout.Column | ||||||
| import androidx.compose.foundation.layout.Row | import androidx.compose.foundation.layout.Row | ||||||
| import androidx.compose.foundation.layout.fillMaxWidth | import androidx.compose.foundation.layout.fillMaxWidth | ||||||
| import androidx.compose.foundation.layout.padding | import androidx.compose.foundation.layout.padding | ||||||
| import androidx.compose.foundation.layout.size | import androidx.compose.foundation.layout.size | ||||||
|  | import androidx.compose.foundation.layout.width | ||||||
| import androidx.compose.foundation.shape.CircleShape | import androidx.compose.foundation.shape.CircleShape | ||||||
| import androidx.compose.material.Card | import androidx.compose.material.Card | ||||||
|  | import androidx.compose.material.Icon | ||||||
| import androidx.compose.material.Text | import androidx.compose.material.Text | ||||||
|  | import androidx.compose.material.icons.Icons | ||||||
|  | import androidx.compose.material.icons.filled.List | ||||||
| import androidx.compose.runtime.Composable | import androidx.compose.runtime.Composable | ||||||
| import androidx.compose.ui.Alignment | import androidx.compose.ui.Alignment | ||||||
| import androidx.compose.ui.Modifier | import androidx.compose.ui.Modifier | ||||||
| import androidx.compose.ui.draw.clip | import androidx.compose.ui.draw.clip | ||||||
| import androidx.compose.ui.graphics.Color | import androidx.compose.ui.graphics.Color | ||||||
|  | import androidx.compose.ui.text.font.FontWeight | ||||||
|  | import androidx.compose.ui.text.style.TextOverflow | ||||||
| import androidx.compose.ui.tooling.preview.Preview | import androidx.compose.ui.tooling.preview.Preview | ||||||
| import androidx.compose.ui.unit.dp | import androidx.compose.ui.unit.dp | ||||||
| import be.ugent.sel.studeez.R | import be.ugent.sel.studeez.R | ||||||
| import be.ugent.sel.studeez.data.local.models.task.Subject | import be.ugent.sel.studeez.data.local.models.task.Subject | ||||||
|  | import be.ugent.sel.studeez.data.local.models.timer_functional.HoursMinutesSeconds | ||||||
| 
 | 
 | ||||||
| @Composable | @Composable | ||||||
| fun SubjectEntry( | fun SubjectEntry( | ||||||
|  | @ -27,26 +35,58 @@ fun SubjectEntry( | ||||||
|     Card( |     Card( | ||||||
|         modifier = Modifier |         modifier = Modifier | ||||||
|             .fillMaxWidth() |             .fillMaxWidth() | ||||||
|             .padding(10.dp), |             .padding(horizontal = 10.dp, vertical = 5.dp), | ||||||
|     ) { |     ) { | ||||||
|         Row( |         Row( | ||||||
|             horizontalArrangement = Arrangement.SpaceBetween, |             horizontalArrangement = Arrangement.SpaceBetween, | ||||||
|             verticalAlignment = Alignment.Top, |             verticalAlignment = Alignment.CenterVertically, | ||||||
|  | //            modifier = Modifier.fillMaxWidth(), | ||||||
|         ) { |         ) { | ||||||
|             Row( |             Row( | ||||||
|                 horizontalArrangement = Arrangement.spacedBy(10.dp), |                 horizontalArrangement = Arrangement.spacedBy(8.dp), | ||||||
|                 verticalAlignment = Alignment.Top, |                 verticalAlignment = Alignment.CenterVertically, | ||||||
|  |                 modifier = Modifier.padding(start = 10.dp).weight(3f) | ||||||
|             ) { |             ) { | ||||||
|                 Box( |                 Box( | ||||||
|                     modifier = Modifier |                     modifier = Modifier | ||||||
|                         .size(20.dp) |                         .size(20.dp) | ||||||
|                         .clip(CircleShape) |                         .clip(CircleShape) | ||||||
|                         .background(Color(subject.argb_color)) |                         .background(Color(subject.argb_color)), | ||||||
|                         .padding(4.dp), |  | ||||||
|                 ) |                 ) | ||||||
|                 Text(text = subject.name) |                 Column( | ||||||
|  |                     verticalArrangement = Arrangement.spacedBy(0.dp) | ||||||
|  |                 ) { | ||||||
|  |                     Text( | ||||||
|  |                         text = subject.name, | ||||||
|  |                         fontWeight = FontWeight.Bold, | ||||||
|  |                         overflow = TextOverflow.Ellipsis, | ||||||
|  |                         maxLines = 1, | ||||||
|  | //                        modifier = Modifier.fillMaxWidth(), | ||||||
|  | //                        modifier = Modifier.width(200.dp) | ||||||
|  |                     ) | ||||||
|  |                     Row( | ||||||
|  |                         horizontalArrangement = Arrangement.spacedBy(10.dp), | ||||||
|  |                         verticalAlignment = Alignment.CenterVertically, | ||||||
|  |                     ) { | ||||||
|  |                         Text( | ||||||
|  |                             text = "${HoursMinutesSeconds(subject.time)}", | ||||||
|  |                         ) | ||||||
|  |                         Row( | ||||||
|  |                             verticalAlignment = Alignment.CenterVertically, | ||||||
|  |                             horizontalArrangement = Arrangement.spacedBy(3.dp) | ||||||
|  |                         ) { | ||||||
|  |                             Icon( | ||||||
|  |                                 imageVector = Icons.Default.List, contentDescription = "tasks" | ||||||
|  |                             ) | ||||||
|  |                             Text(text = "4/9") | ||||||
|                         } |                         } | ||||||
|             StealthButton(text = R.string.view_task) { |                     } | ||||||
|  |                 } | ||||||
|  |             } | ||||||
|  |             StealthButton( | ||||||
|  |                 text = R.string.view_task, | ||||||
|  |                 modifier = Modifier.padding(start = 10.dp, end = 5.dp).weight(1f) | ||||||
|  |                 ) { | ||||||
| 
 | 
 | ||||||
|             } |             } | ||||||
|         } |         } | ||||||
|  | @ -56,5 +96,12 @@ fun SubjectEntry( | ||||||
| @Preview | @Preview | ||||||
| @Composable | @Composable | ||||||
| fun SubjectEntryPreview() { | fun SubjectEntryPreview() { | ||||||
|     SubjectEntry(subject = Subject(name = "Test Subject", argb_color = 0xFFF44336)) |     SubjectEntry( | ||||||
|  |         subject = Subject( | ||||||
|  |             name = "Test Subject longgggggggggggggggggggggggggggggggggggggggg", | ||||||
|  | //            name = "Test Subject", | ||||||
|  |             argb_color = 0xFFF44336, | ||||||
|  |             time = 60 | ||||||
|  |         ) | ||||||
|  |     ) | ||||||
| } | } | ||||||
|  | @ -8,6 +8,4 @@ data class Subject( | ||||||
|     val tasks: List<Task> = mutableListOf(), |     val tasks: List<Task> = mutableListOf(), | ||||||
|     val time: Int = 0, |     val time: Int = 0, | ||||||
|     val argb_color: Long = 0, |     val argb_color: Long = 0, | ||||||
| ) { | ) | ||||||
| //    fun getColor(): Color = Color(ARGB_color) |  | ||||||
| } |  | ||||||
|  | @ -1,4 +1,17 @@ | ||||||
| package be.ugent.sel.studeez.data.local.models.timer_functional | package be.ugent.sel.studeez.data.local.models.timer_functional | ||||||
| 
 | 
 | ||||||
| data class HoursMinutesSeconds(val hours: String, val minutes: String, val seconds: String | class HoursMinutesSeconds(val hours: Int, val minutes: Int, val seconds: Int) { | ||||||
| ) |     constructor(seconds: Int) : this( | ||||||
|  |         hours = seconds / (60 * 60), | ||||||
|  |         minutes = (seconds / 60) % 60, | ||||||
|  |         seconds = seconds % 60, | ||||||
|  |     ) | ||||||
|  | 
 | ||||||
|  |     override fun toString(): String { | ||||||
|  |         return hours.toString().padStart(2, '0') + | ||||||
|  |                 ":" + | ||||||
|  |                 minutes.toString().padStart(2, '0') + | ||||||
|  |                 ":" + | ||||||
|  |                 seconds.toString().padStart(2, '0') | ||||||
|  |     } | ||||||
|  | } | ||||||
|  | @ -13,15 +13,6 @@ class Time(initialTime: Int) { | ||||||
|     } |     } | ||||||
| 
 | 
 | ||||||
|     fun getAsHMS(): HoursMinutesSeconds { |     fun getAsHMS(): HoursMinutesSeconds { | ||||||
|         val hours: Int = time / (60 * 60) |         return HoursMinutesSeconds(time) | ||||||
|         val minutes: Int = (time / (60)) % 60 |  | ||||||
|         val seconds: Int = time % 60 |  | ||||||
| 
 |  | ||||||
|         return HoursMinutesSeconds( |  | ||||||
|             hours.toString().padStart(2, '0'), |  | ||||||
|             minutes.toString().padStart(2, '0'), |  | ||||||
|             seconds.toString().padStart(2, '0') |  | ||||||
|         ) |  | ||||||
|     } |     } | ||||||
| 
 |  | ||||||
| } | } | ||||||
|  | @ -49,22 +49,27 @@ fun TaskScreen( | ||||||
|         barAction = {}, |         barAction = {}, | ||||||
|     ) { |     ) { | ||||||
|         val subjects = getSubjects().collectAsState(initial = emptyList()) |         val subjects = getSubjects().collectAsState(initial = emptyList()) | ||||||
|         Column { |         Column( | ||||||
|  |             modifier = Modifier.padding(top = 5.dp) | ||||||
|  |         ) { | ||||||
|             LazyColumn { |             LazyColumn { | ||||||
|                 if (subjects.value.isNotEmpty()) { | //                if (subjects.value.isNotEmpty()) { | ||||||
|                     item { | //                    item { | ||||||
|                         SubjectEntry(subject = subjects.value[0]) | //                        SubjectEntry(subject = subjects.value[0]) | ||||||
|                     } | //                    } | ||||||
|                 } | //                } | ||||||
|                 if (subjects.value.size > 1) { | //                if (subjects.value.size > 1) { | ||||||
|                     items(subjects.value.subList(1, subjects.value.lastIndex + 1)) { | //                    items(subjects.value.subList(1, subjects.value.lastIndex + 1)) { | ||||||
|                         Column { | //                        Column { | ||||||
|                             Divider(modifier = Modifier.padding(10.dp, 0.dp)) | //                            Divider(modifier = Modifier.padding(10.dp, 0.dp)) | ||||||
|  | //                            SubjectEntry(subject = it) | ||||||
|  | //                        } | ||||||
|  | //                    } | ||||||
|  | //                } | ||||||
|  |                 items(subjects.value) { | ||||||
|                     SubjectEntry(subject = it) |                     SubjectEntry(subject = it) | ||||||
|                 } |                 } | ||||||
|             } |             } | ||||||
|                 } |  | ||||||
|             } |  | ||||||
|             NewTaskSubjectButton(onClick = addSubject, R.string.new_subject) |             NewTaskSubjectButton(onClick = addSubject, R.string.new_subject) | ||||||
|         } |         } | ||||||
|     } |     } | ||||||
|  |  | ||||||
|  | @ -82,5 +82,4 @@ | ||||||
| 
 | 
 | ||||||
|     <!-- About --> |     <!-- About --> | ||||||
|     <string name="about">About Studeez</string> |     <string name="about">About Studeez</string> | ||||||
| 
 |  | ||||||
| </resources> | </resources> | ||||||
|  |  | ||||||
		Reference in a new issue
	
	 brreynie
						brreynie