Minor styling of timerentries

This commit is contained in:
Tibo De Peuter 2023-04-28 00:15:09 +02:00
parent 18a055c599
commit cf91d727a0
4 changed files with 48 additions and 47 deletions

View file

@ -3,15 +3,9 @@ package be.ugent.sel.studeez.common.composable
import androidx.annotation.StringRes import androidx.annotation.StringRes
import androidx.compose.foundation.BorderStroke import androidx.compose.foundation.BorderStroke
import androidx.compose.foundation.shape.RoundedCornerShape import androidx.compose.foundation.shape.RoundedCornerShape
import androidx.compose.material.Button import androidx.compose.material.*
import androidx.compose.material.ButtonColors
import androidx.compose.material.ButtonDefaults
import androidx.compose.material.MaterialTheme
import androidx.compose.material.Text
import androidx.compose.material.TextButton
import androidx.compose.runtime.Composable import androidx.compose.runtime.Composable
import androidx.compose.ui.Modifier import androidx.compose.ui.Modifier
import androidx.compose.ui.graphics.Color
import androidx.compose.ui.res.stringResource import androidx.compose.ui.res.stringResource
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
@ -21,7 +15,6 @@ import be.ugent.sel.studeez.common.ext.basicButton
import be.ugent.sel.studeez.common.ext.card import be.ugent.sel.studeez.common.ext.card
@Composable @Composable
fun BasicTextButton(@StringRes text: Int, modifier: Modifier, action: () -> Unit) { fun BasicTextButton(@StringRes text: Int, modifier: Modifier, action: () -> Unit) {
TextButton(onClick = action, modifier = modifier) { Text(text = stringResource(text)) } TextButton(onClick = action, modifier = modifier) { Text(text = stringResource(text)) }
} }
@ -64,10 +57,10 @@ fun StealthButton(
onClick = onClick, onClick = onClick,
modifier = Modifier.card(), modifier = Modifier.card(),
colors = ButtonDefaults.buttonColors( colors = ButtonDefaults.buttonColors(
backgroundColor = Color.Transparent, backgroundColor = MaterialTheme.colors.surface,
contentColor = Color.DarkGray, contentColor = MaterialTheme.colors.onSurface
), ),
border = BorderStroke(3.dp, Color.DarkGray), border = BorderStroke(1.dp, MaterialTheme.colors.onSurface)
) )
} }

View file

@ -1,10 +1,6 @@
package be.ugent.sel.studeez.common.composable package be.ugent.sel.studeez.common.composable
import androidx.compose.foundation.layout.Arrangement import androidx.compose.foundation.layout.*
import androidx.compose.foundation.layout.Column
import androidx.compose.foundation.layout.Row
import androidx.compose.foundation.layout.fillMaxWidth
import androidx.compose.foundation.layout.padding
import androidx.compose.material.Text import androidx.compose.material.Text
import androidx.compose.runtime.Composable import androidx.compose.runtime.Composable
import androidx.compose.ui.Alignment import androidx.compose.ui.Alignment
@ -20,24 +16,39 @@ import be.ugent.sel.studeez.data.local.models.timer_info.TimerInfo
@Composable @Composable
fun TimerEntry( fun TimerEntry(
timerInfo: TimerInfo, timerInfo: TimerInfo,
button: @Composable () -> Unit, rightButton: @Composable () -> Unit = {},
leftButton: @Composable () -> Unit = {}
) { ) {
Row( Row(
verticalAlignment = Alignment.CenterVertically, modifier = Modifier.fillMaxWidth()
modifier = Modifier.fillMaxWidth(),
horizontalArrangement = Arrangement.SpaceBetween
) { ) {
Column( Row(
Modifier.padding(horizontal = 10.dp) modifier = Modifier.weight(1f)
) { ) {
Text( Box(modifier = Modifier.align(alignment = Alignment.CenterVertically)) {
text = timerInfo.name, fontWeight = FontWeight.Bold, fontSize = 20.sp leftButton()
) }
Text(
text = timerInfo.description, fontWeight = FontWeight.Light, fontSize = 15.sp Column(
) Modifier.padding(
horizontal = 20.dp,
vertical = 11.dp
)
) {
Text(
text = timerInfo.name,
fontWeight = FontWeight.Medium,
fontSize = 20.sp
)
Text(
text = timerInfo.description, fontWeight = FontWeight.Light, fontSize = 14.sp
)
}
}
Box(modifier = Modifier.align(alignment = Alignment.CenterVertically)) {
rightButton()
} }
button()
} }
} }

View file

@ -1,6 +1,5 @@
package be.ugent.sel.studeez.screens.timer_overview package be.ugent.sel.studeez.screens.timer_overview
import androidx.compose.foundation.layout.Arrangement
import androidx.compose.foundation.layout.Column import androidx.compose.foundation.layout.Column
import androidx.compose.foundation.lazy.LazyColumn import androidx.compose.foundation.lazy.LazyColumn
import androidx.compose.foundation.lazy.items import androidx.compose.foundation.lazy.items
@ -8,15 +7,14 @@ import androidx.compose.runtime.Composable
import androidx.compose.runtime.collectAsState import androidx.compose.runtime.collectAsState
import androidx.compose.ui.Modifier import androidx.compose.ui.Modifier
import androidx.compose.ui.tooling.preview.Preview import androidx.compose.ui.tooling.preview.Preview
import androidx.compose.ui.unit.dp
import be.ugent.sel.studeez.R import be.ugent.sel.studeez.R
import be.ugent.sel.studeez.common.composable.* import be.ugent.sel.studeez.common.composable.BasicButton
import be.ugent.sel.studeez.common.composable.DrawerScreenTemplate
import be.ugent.sel.studeez.common.composable.StealthButton
import be.ugent.sel.studeez.common.composable.TimerEntry
import be.ugent.sel.studeez.common.composable.drawer.DrawerActions import be.ugent.sel.studeez.common.composable.drawer.DrawerActions
import be.ugent.sel.studeez.common.composable.drawer.DrawerViewModel import be.ugent.sel.studeez.common.composable.drawer.DrawerViewModel
import be.ugent.sel.studeez.common.composable.drawer.getDrawerActions import be.ugent.sel.studeez.common.composable.drawer.getDrawerActions
import be.ugent.sel.studeez.common.composable.navbar.NavigationBarActions
import be.ugent.sel.studeez.common.composable.navbar.NavigationBarViewModel
import be.ugent.sel.studeez.common.composable.navbar.getNavigationBarActions
import be.ugent.sel.studeez.common.ext.basicButton import be.ugent.sel.studeez.common.ext.basicButton
import be.ugent.sel.studeez.data.local.models.timer_info.CustomTimerInfo import be.ugent.sel.studeez.data.local.models.timer_info.CustomTimerInfo
import be.ugent.sel.studeez.data.local.models.timer_info.TimerInfo import be.ugent.sel.studeez.data.local.models.timer_info.TimerInfo
@ -66,9 +64,7 @@ fun TimerOverviewScreen(
drawerActions = drawerActions drawerActions = drawerActions
) { ) {
Column { Column {
LazyColumn( LazyColumn {
verticalArrangement = Arrangement.spacedBy(7.dp)
) {
// Default Timers, cannot be edited // Default Timers, cannot be edited
items(timerOverviewActions.getDefaultTimers()) { items(timerOverviewActions.getDefaultTimers()) {
TimerEntry(timerInfo = it) {} TimerEntry(timerInfo = it) {}

View file

@ -1,12 +1,12 @@
package be.ugent.sel.studeez.screens.timer_selection package be.ugent.sel.studeez.screens.timer_selection
import androidx.compose.foundation.layout.Arrangement
import androidx.compose.foundation.lazy.LazyColumn import androidx.compose.foundation.lazy.LazyColumn
import androidx.compose.foundation.lazy.items import androidx.compose.foundation.lazy.items
import androidx.compose.material.Text
import androidx.compose.material.TextButton
import androidx.compose.runtime.Composable import androidx.compose.runtime.Composable
import androidx.compose.runtime.collectAsState import androidx.compose.runtime.collectAsState
import androidx.compose.ui.tooling.preview.Preview import androidx.compose.ui.tooling.preview.Preview
import androidx.compose.ui.unit.dp
import be.ugent.sel.studeez.R import be.ugent.sel.studeez.R
import be.ugent.sel.studeez.common.composable.SecondaryScreenTemplate import be.ugent.sel.studeez.common.composable.SecondaryScreenTemplate
import be.ugent.sel.studeez.common.composable.StealthButton import be.ugent.sel.studeez.common.composable.StealthButton
@ -59,17 +59,18 @@ fun TimerSelectionScreen(
title = resources().getString(R.string.timers), title = resources().getString(R.string.timers),
popUp = popUp popUp = popUp
) { ) {
LazyColumn(verticalArrangement = Arrangement.spacedBy(7.dp)) { LazyColumn {
// All timers // All timers
items(timers.value) { timerInfo -> items(timers.value) { timerInfo ->
TimerEntry( TimerEntry(
timerInfo = timerInfo, timerInfo = timerInfo,
) { leftButton = {
StealthButton( StealthButton(
text = R.string.start, text = R.string.start,
onClick = { timerSelectionActions.startSession(timerInfo) } onClick = { timerSelectionActions.startSession(timerInfo) }
) )
} }
)
} }
} }
} }