worked on calendar
This commit is contained in:
parent
8350ef65b5
commit
b22c82de00
2 changed files with 67 additions and 41 deletions
|
|
@ -10,6 +10,7 @@ import androidx.compose.material.icons.Icons
|
||||||
import androidx.compose.material.icons.filled.Emergency
|
import androidx.compose.material.icons.filled.Emergency
|
||||||
import androidx.compose.material3.FloatingActionButton
|
import androidx.compose.material3.FloatingActionButton
|
||||||
import androidx.compose.material3.Icon
|
import androidx.compose.material3.Icon
|
||||||
|
import androidx.compose.material3.MaterialTheme
|
||||||
import androidx.compose.material3.Scaffold
|
import androidx.compose.material3.Scaffold
|
||||||
import androidx.compose.material3.Text
|
import androidx.compose.material3.Text
|
||||||
import androidx.compose.runtime.Composable
|
import androidx.compose.runtime.Composable
|
||||||
|
|
@ -38,33 +39,35 @@ class MainActivity : ComponentActivity() {
|
||||||
@Composable
|
@Composable
|
||||||
private fun MainContent() {
|
private fun MainContent() {
|
||||||
val navController = rememberNavController()
|
val navController = rememberNavController()
|
||||||
Box {
|
MaterialTheme {
|
||||||
Scaffold(
|
Box {
|
||||||
modifier = Modifier.fillMaxSize(),
|
Scaffold(
|
||||||
bottomBar = { BottomNavigationBar(navController) },
|
modifier = Modifier.fillMaxSize(),
|
||||||
floatingActionButton = { EmergencyButton() }
|
bottomBar = { BottomNavigationBar(navController) },
|
||||||
) { paddingValues ->
|
floatingActionButton = { EmergencyButton() }
|
||||||
NavHost(
|
) { paddingValues ->
|
||||||
navController = navController,
|
NavHost(
|
||||||
startDestination = Screens.Home.route,
|
navController = navController,
|
||||||
modifier = Modifier.padding(paddingValues = paddingValues)
|
startDestination = Screens.Home.route,
|
||||||
) {
|
modifier = Modifier.padding(paddingValues = paddingValues)
|
||||||
composable(Screens.Tracking.route) {
|
) {
|
||||||
TrackingScreen()
|
composable(Screens.Tracking.route) {
|
||||||
}
|
TrackingScreen()
|
||||||
composable(Screens.Skillslist.route) {
|
}
|
||||||
SkillsScreen()
|
composable(Screens.Skillslist.route) {
|
||||||
}
|
SkillsScreen()
|
||||||
composable(Screens.Home.route) {
|
}
|
||||||
Text("Home")
|
composable(Screens.Home.route) {
|
||||||
}
|
Text("Home")
|
||||||
composable(Screens.Favourites.route) {
|
}
|
||||||
Text("Favourites")
|
composable(Screens.Favourites.route) {
|
||||||
|
Text("Favourites")
|
||||||
|
|
||||||
}
|
}
|
||||||
composable(Screens.Skillschains.route) {
|
composable(Screens.Skillschains.route) {
|
||||||
Text("Skillschains")
|
Text("Skillschains")
|
||||||
|
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -1,6 +1,7 @@
|
||||||
package de.cdaut.dbtapp.components
|
package de.cdaut.dbtapp.components
|
||||||
|
|
||||||
import androidx.compose.foundation.background
|
import androidx.compose.foundation.background
|
||||||
|
import androidx.compose.foundation.border
|
||||||
import androidx.compose.foundation.clickable
|
import androidx.compose.foundation.clickable
|
||||||
import androidx.compose.foundation.layout.Arrangement
|
import androidx.compose.foundation.layout.Arrangement
|
||||||
import androidx.compose.foundation.layout.Box
|
import androidx.compose.foundation.layout.Box
|
||||||
|
|
@ -12,16 +13,17 @@ import androidx.compose.foundation.layout.padding
|
||||||
import androidx.compose.foundation.layout.size
|
import androidx.compose.foundation.layout.size
|
||||||
import androidx.compose.foundation.lazy.grid.GridCells
|
import androidx.compose.foundation.lazy.grid.GridCells
|
||||||
import androidx.compose.foundation.lazy.grid.LazyVerticalGrid
|
import androidx.compose.foundation.lazy.grid.LazyVerticalGrid
|
||||||
|
import androidx.compose.foundation.shape.CircleShape
|
||||||
import androidx.compose.material.icons.Icons
|
import androidx.compose.material.icons.Icons
|
||||||
import androidx.compose.material.icons.filled.ChevronLeft
|
import androidx.compose.material.icons.filled.ChevronLeft
|
||||||
import androidx.compose.material.icons.filled.ChevronRight
|
import androidx.compose.material.icons.filled.ChevronRight
|
||||||
import androidx.compose.material3.Icon
|
import androidx.compose.material3.Icon
|
||||||
|
import androidx.compose.material3.MaterialTheme
|
||||||
import androidx.compose.material3.Text
|
import androidx.compose.material3.Text
|
||||||
import androidx.compose.runtime.Composable
|
import androidx.compose.runtime.Composable
|
||||||
import androidx.compose.runtime.getValue
|
import androidx.compose.runtime.MutableState
|
||||||
import androidx.compose.runtime.mutableStateOf
|
import androidx.compose.runtime.mutableStateOf
|
||||||
import androidx.compose.runtime.remember
|
import androidx.compose.runtime.remember
|
||||||
import androidx.compose.runtime.setValue
|
|
||||||
import androidx.compose.ui.Alignment
|
import androidx.compose.ui.Alignment
|
||||||
import androidx.compose.ui.Modifier
|
import androidx.compose.ui.Modifier
|
||||||
import androidx.compose.ui.graphics.Color
|
import androidx.compose.ui.graphics.Color
|
||||||
|
|
@ -54,10 +56,11 @@ private fun TopCalendarPrev() {
|
||||||
@Composable
|
@Composable
|
||||||
private fun TopCalendar() {
|
private fun TopCalendar() {
|
||||||
|
|
||||||
var currentDate: LocalDate by remember {
|
var currentDateMut: MutableState<LocalDate> = remember {
|
||||||
mutableStateOf(LocalDate.now())
|
mutableStateOf(LocalDate.now())
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
Column(
|
Column(
|
||||||
horizontalAlignment = Alignment.CenterHorizontally
|
horizontalAlignment = Alignment.CenterHorizontally
|
||||||
) {
|
) {
|
||||||
|
|
@ -72,7 +75,7 @@ private fun TopCalendar() {
|
||||||
//Header stating the currently selected date
|
//Header stating the currently selected date
|
||||||
Text(
|
Text(
|
||||||
fontSize = 4.5.em,
|
fontSize = 4.5.em,
|
||||||
text = currentDate.format(
|
text = currentDateMut.value.format(
|
||||||
DateTimeFormatter.ofLocalizedDate(FormatStyle.LONG)
|
DateTimeFormatter.ofLocalizedDate(FormatStyle.LONG)
|
||||||
.withLocale(LocalConfiguration.current.locales[0])
|
.withLocale(LocalConfiguration.current.locales[0])
|
||||||
)
|
)
|
||||||
|
|
@ -82,7 +85,7 @@ private fun TopCalendar() {
|
||||||
Icon(
|
Icon(
|
||||||
modifier = Modifier
|
modifier = Modifier
|
||||||
.clickable(onClick = {
|
.clickable(onClick = {
|
||||||
currentDate = currentDate.minusMonths(1)
|
currentDateMut.value = currentDateMut.value.minusMonths(1)
|
||||||
})
|
})
|
||||||
.size(30.dp),
|
.size(30.dp),
|
||||||
imageVector = Icons.Filled.ChevronLeft,
|
imageVector = Icons.Filled.ChevronLeft,
|
||||||
|
|
@ -92,7 +95,7 @@ private fun TopCalendar() {
|
||||||
Icon(
|
Icon(
|
||||||
modifier = Modifier
|
modifier = Modifier
|
||||||
.clickable(onClick = {
|
.clickable(onClick = {
|
||||||
currentDate = currentDate.plusMonths(1)
|
currentDateMut.value = currentDateMut.value.plusMonths(1)
|
||||||
})
|
})
|
||||||
.size(30.dp),
|
.size(30.dp),
|
||||||
imageVector = Icons.Filled.ChevronRight,
|
imageVector = Icons.Filled.ChevronRight,
|
||||||
|
|
@ -118,15 +121,16 @@ private fun TopCalendar() {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
CalendarDaysGrid(currentDate)
|
CalendarDaysGrid(currentDateMut)
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@Composable
|
@Composable
|
||||||
fun CalendarDaysGrid(date: LocalDate, modifier: Modifier = Modifier) {
|
fun CalendarDaysGrid(selectedDateMut: MutableState<LocalDate>, modifier: Modifier = Modifier) {
|
||||||
val locale = LocalConfiguration.current.locales[0]
|
val locale = LocalConfiguration.current.locales[0]
|
||||||
|
val selectedDate = selectedDateMut.value
|
||||||
|
|
||||||
val firstDayOfMonth = LocalDate.of(date.year, date.month, 1)
|
val firstDayOfMonth = LocalDate.of(selectedDate.year, selectedDate.month, 1)
|
||||||
val totalDaysInMonth = firstDayOfMonth.lengthOfMonth()
|
val totalDaysInMonth = firstDayOfMonth.lengthOfMonth()
|
||||||
val firstDayOfWeek = WeekFields.of(locale).firstDayOfWeek
|
val firstDayOfWeek = WeekFields.of(locale).firstDayOfWeek
|
||||||
|
|
||||||
|
|
@ -146,14 +150,33 @@ fun CalendarDaysGrid(date: LocalDate, modifier: Modifier = Modifier) {
|
||||||
modifier = Modifier.fillMaxWidth()
|
modifier = Modifier.fillMaxWidth()
|
||||||
) {
|
) {
|
||||||
items(days.size) { index ->
|
items(days.size) { index ->
|
||||||
Box(
|
days[index]?.let { day ->
|
||||||
modifier = Modifier
|
|
||||||
|
var dayBoxModifier = Modifier
|
||||||
.aspectRatio(1f)
|
.aspectRatio(1f)
|
||||||
.padding(4.dp),
|
.padding(4.dp)
|
||||||
contentAlignment = Alignment.Center
|
.clickable(onClick = {
|
||||||
) {
|
selectedDateMut.value = LocalDate.of(
|
||||||
days[index]?.let {
|
selectedDate.year,
|
||||||
Text(text = it.toString())
|
selectedDate.month,
|
||||||
|
day
|
||||||
|
)
|
||||||
|
})
|
||||||
|
|
||||||
|
//add a mark to the currently selected day
|
||||||
|
if (day == selectedDate.dayOfMonth) {
|
||||||
|
dayBoxModifier = dayBoxModifier.border(
|
||||||
|
2.dp,
|
||||||
|
MaterialTheme.colorScheme.primaryContainer,
|
||||||
|
CircleShape
|
||||||
|
)
|
||||||
|
}
|
||||||
|
|
||||||
|
Box(
|
||||||
|
modifier = dayBoxModifier,
|
||||||
|
contentAlignment = Alignment.Center
|
||||||
|
) {
|
||||||
|
Text(text = day.toString())
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
||||||
Loading…
Add table
Add a link
Reference in a new issue