Skip to content

Commit

Permalink
OneScreen year and month ui added
Browse files Browse the repository at this point in the history
  • Loading branch information
@BerkkanB
BerkkanB committed Sep 21, 2022
1 parent 2b041df commit 460ea2f
Show file tree
Hide file tree
Showing 5 changed files with 193 additions and 114 deletions.
8 changes: 5 additions & 3 deletions app/src/main/java/com/dt/calendarwork/MainActivity.kt
View file
Original file line number Diff line number Diff line change
Expand Up @@ -17,6 +17,7 @@ import androidx.compose.ui.Modifier
import androidx.compose.ui.graphics.Color
import androidx.compose.ui.unit.sp
import com.dt.calendarwork.ui.theme.CalendarWorkTheme
import com.dt.composedatepicker.CalendarType
import com.dt.composedatepicker.ComposeCalendar
import com.dt.composedatepicker.MonthViewType
import com.dt.composedatepicker.SelectDateListener
Expand All @@ -37,12 +38,12 @@ class MainActivity : ComponentActivity() {
@Composable
fun MainScreen() {
val calendar = Calendar.getInstance()
calendar.set(Calendar.YEAR, 2022)
calendar.set(Calendar.YEAR, 1999)
calendar.set(Calendar.MONTH, 1)
calendar.set(Calendar.DAY_OF_MONTH, 1)

val calendarMax = Calendar.getInstance()
calendarMax.set(Calendar.YEAR, 2023)
calendarMax.set(Calendar.YEAR, 2044)
calendarMax.set(Calendar.MONTH, 0)
calendarMax.set(Calendar.DAY_OF_MONTH, 1)

Expand Down Expand Up @@ -73,10 +74,11 @@ fun MainScreen() {
locale = Locale("en"),
title = "Select Date",
buttonTextSize = 15.sp,
calendarType = CalendarType.ONE_SCREEN_MONTH_AND_YEAR,
monthViewType = MonthViewType.ONLY_NUMBER_ONE_COLUMN,
listener = object : SelectDateListener {
override fun onDateSelected(date: Date) {
Log.i("DENEME", date.toString())
Log.i("Selected Date: ", date.toString())
}

override fun onCanceled() {
Expand Down
17 changes: 8 additions & 9 deletions library/src/main/java/com/dt/composedatepicker/CalendarHeader.kt
View file
Original file line number Diff line number Diff line change
Expand Up @@ -21,8 +21,7 @@ fun CalendarHeader(
showMonths: Boolean,
setShowMonths: (Boolean) -> Unit,
title: String,
showOnlyMonth: Boolean,
showOnlyYear: Boolean,
calendarType: CalendarType,
themeColor:Color,
monthViewType: MonthViewType?
) {
Expand All @@ -37,27 +36,27 @@ fun CalendarHeader(
modifier = Modifier.padding(top = 16.dp),
color = Color.White)
Row() {
if (!showOnlyYear) {
if (calendarType != CalendarType.ONLY_YEAR) {
Text(
text = monthText,
fontSize = 35.sp,
modifier = Modifier
.padding(bottom = 20.dp,
start = if (showOnlyMonth) 0.dp else 30.dp,
end = if (showOnlyMonth) 0.dp else 10.dp)
start = if (calendarType == CalendarType.ONLY_MONTH) 0.dp else 30.dp,
end = if (calendarType == CalendarType.ONLY_MONTH) 0.dp else 10.dp)
.clickable { setShowMonths(true) },
color = if (showMonths) Color.White else Color.LightGray)
}
if (!showOnlyMonth && !showOnlyYear){
if (calendarType != CalendarType.ONLY_MONTH && calendarType != CalendarType.ONLY_YEAR){
Text(text = "/",fontSize = 35.sp,color = Color.White)
}
if (!showOnlyMonth) {
if (calendarType != CalendarType.ONLY_MONTH ) {
Text(text = selectedYear.toString(),
fontSize = 35.sp,
modifier = Modifier
.padding(bottom = 20.dp,
start = if (showOnlyYear) 0.dp else 10.dp,
end = if (showOnlyYear) 0.dp else 30.dp)
start = if (calendarType == CalendarType.ONLY_YEAR) 0.dp else 10.dp,
end = if (calendarType == CalendarType.ONLY_YEAR) 0.dp else 30.dp)
.clickable { setShowMonths(false) },
color = if (showMonths) Color.LightGray else Color.White)
}
Expand Down
11 changes: 6 additions & 5 deletions library/src/main/java/com/dt/composedatepicker/CalendarMonthViewOneColumn.kt
View file
Original file line number Diff line number Diff line change
Expand Up @@ -30,14 +30,15 @@ fun CalendarMonthViewOneColumn(
setShowMonths: (Boolean) -> Unit,
showOnlyMonth: Boolean,
themeColor: Color,
unselectedColor: Color
unselectedColor: Color,
modifier: Modifier = Modifier
.fillMaxHeight(0.85f)
.fillMaxWidth()
.padding(10.dp),
) {

LazyColumn(
modifier = Modifier
.fillMaxHeight(0.85f)
.fillMaxWidth()
.padding(10.dp),
modifier = modifier,
horizontalAlignment = Alignment.CenterHorizontally
) {
items(items = monthList) { item ->
Expand Down
216 changes: 119 additions & 97 deletions library/src/main/java/com/dt/composedatepicker/ComposeCalendar.kt
View file
Original file line number Diff line number Diff line change
Expand Up @@ -24,116 +24,130 @@ fun ComposeCalendar(
locale: Locale = Locale.getDefault(),
title: String = "",
listener: SelectDateListener,
showOnlyMonth: Boolean = false,
showOnlyYear: Boolean = false,
calendarType: CalendarType = CalendarType.MONTH_AND_YEAR,
themeColor: Color = Color(0xFF614FF0),
unselectedColor: Color = Color.Black,
negativeButtonTitle: String = "CANCEL",
positiveButtonTitle: String = "OK",
buttonTextSize: TextUnit = TextUnit.Unspecified,
monthViewType: MonthViewType? = MonthViewType.ONLY_MONTH
) {
if (showOnlyMonth && showOnlyYear) {
throw IllegalStateException("'showOnlyMonth' and 'showOnlyYear' states cannot be true at the same time")
} else {

var minYear = 1970
var minMonth = 0
var maxYear = 2100
var maxMonth = 11
var minYear = 1970
var minMonth = 0
var maxYear = 2100
var maxMonth = 11

var initialCalendar = Calendar.getInstance(locale)
var currentMonth = initialCalendar.get(Calendar.MONTH)
var currentYear = initialCalendar.get(Calendar.YEAR)
var initialCalendar = Calendar.getInstance(locale)
var currentMonth = initialCalendar.get(Calendar.MONTH)
var currentYear = initialCalendar.get(Calendar.YEAR)

minDate?.let {
val calendarMin = Calendar.getInstance()
calendarMin.time = minDate
minMonth = calendarMin.get(Calendar.MONTH)
minYear = calendarMin.get(Calendar.YEAR)
}
maxDate?.let {
val calendarMax = Calendar.getInstance()
calendarMax.time = maxDate
maxMonth = calendarMax.get(Calendar.MONTH)
maxYear = calendarMax.get(Calendar.YEAR)
}
initialDate?.let {
initialCalendar.time = initialDate
currentMonth = initialCalendar.get(Calendar.MONTH)
currentYear = initialCalendar.get(Calendar.YEAR)
}
minDate?.let {
val calendarMin = Calendar.getInstance()
calendarMin.time = minDate
minMonth = calendarMin.get(Calendar.MONTH)
minYear = calendarMin.get(Calendar.YEAR)
}
maxDate?.let {
val calendarMax = Calendar.getInstance()
calendarMax.time = maxDate
maxMonth = calendarMax.get(Calendar.MONTH)
maxYear = calendarMax.get(Calendar.YEAR)
}
initialDate?.let {
initialCalendar.time = initialDate
currentMonth = initialCalendar.get(Calendar.MONTH)
currentYear = initialCalendar.get(Calendar.YEAR)
}


if (minYear > currentYear) {
currentYear = minYear
}
if (maxYear < currentYear) {
currentYear = maxYear
}
if (minYear > currentYear) {
currentYear = minYear
}
if (maxYear < currentYear) {
currentYear = maxYear
}

val months = (DateFormatSymbols(locale).shortMonths).toList()
val monthList = months.mapIndexed { index, name ->
MonthData(name = name, index = index)
}
val (selectedMonth, setMonth) = remember {
mutableStateOf(
MonthData(
name = DateFormatSymbols(locale).shortMonths[currentMonth],
index = currentMonth
)
val months = (DateFormatSymbols(locale).shortMonths).toList()
val monthList = months.mapIndexed { index, name ->
MonthData(name = name, index = index)
}
val (selectedMonth, setMonth) = remember {
mutableStateOf(
MonthData(
name = DateFormatSymbols(locale).shortMonths[currentMonth],
index = currentMonth
)
}
val (selectedYear, setYear) = remember {
mutableStateOf(currentYear)
}
val (showMonths, setShowMonths) = remember {
mutableStateOf(!showOnlyYear)
}
)
}
val (selectedYear, setYear) = remember {
mutableStateOf(currentYear)
}
val (showMonths, setShowMonths) = remember {
mutableStateOf(
calendarType != CalendarType.ONLY_YEAR
)
}

val calendarDate = Calendar.getInstance()
var selectedDate by remember {
mutableStateOf(calendarDate.time)
}
val calendarDate = Calendar.getInstance()
var selectedDate by remember {
mutableStateOf(calendarDate.time)
}

LaunchedEffect(key1 = selectedYear, key2 = selectedMonth) {
calendarDate.set(Calendar.YEAR, selectedYear)
calendarDate.set(Calendar.MONTH, selectedMonth.index)
calendarDate.set(
Calendar.DAY_OF_MONTH,
1
) //For example, if the date is 30 march and we click february, then it shows 2March because february does not have 30 days, so we set default day to 1
selectedDate = calendarDate.time
}
LaunchedEffect(key1 = selectedYear) {
if (selectedYear == minYear) {
if (selectedMonth.index < minMonth) {
setMonth(monthList[minMonth])
}
LaunchedEffect(key1 = selectedYear, key2 = selectedMonth) {
calendarDate.set(Calendar.YEAR, selectedYear)
calendarDate.set(Calendar.MONTH, selectedMonth.index)
calendarDate.set(
Calendar.DAY_OF_MONTH,
1
) //For example, if the date is 30 march and we click february, then it shows 2March because february does not have 30 days, so we set default day to 1
selectedDate = calendarDate.time
}
LaunchedEffect(key1 = selectedYear) {
if (selectedYear == minYear) {
if (selectedMonth.index < minMonth) {
setMonth(monthList[minMonth])
}
if (selectedYear == maxYear) {
if (selectedMonth.index > maxMonth) {
setMonth(monthList[maxMonth])
}
}
if (selectedYear == maxYear) {
if (selectedMonth.index > maxMonth) {
setMonth(monthList[maxMonth])
}
}
}

Card(
modifier = Modifier
.fillMaxSize()
) {
Column(modifier = Modifier.fillMaxSize()) {
CalendarHeader(
Card(
modifier = Modifier
.fillMaxSize()
) {
Column(modifier = Modifier.fillMaxSize()) {
CalendarHeader(
selectedMonth = selectedMonth,
selectedYear = selectedYear,
showMonths = showMonths,
setShowMonths = setShowMonths,
title = title,
calendarType = calendarType,
themeColor = themeColor,
monthViewType = monthViewType
)
if (calendarType == CalendarType.ONE_SCREEN_MONTH_AND_YEAR){
OneScreenMonthYear(
selectedMonth = selectedMonth,
selectedYear = selectedYear,
showMonths = showMonths,
setMonth = setMonth,
minMonth = minMonth,
maxMonth = maxMonth,
setShowMonths = setShowMonths,
title = title,
showOnlyMonth = showOnlyMonth,
showOnlyYear = showOnlyYear,
minYear = minYear,
maxYear = maxYear,
selectedYear = selectedYear,
monthList = monthList,
showOnlyMonth = calendarType == CalendarType.ONLY_MONTH,
themeColor = themeColor,
monthViewType = monthViewType
)
unselectedColor = unselectedColor,
setYear = setYear
)
} else {
Crossfade(targetState = showMonths) {
when (it) {
true -> {
Expand All @@ -148,7 +162,7 @@ fun ComposeCalendar(
maxYear = maxYear,
selectedYear = selectedYear,
monthList = monthList,
showOnlyMonth = showOnlyMonth,
showOnlyMonth = calendarType == CalendarType.ONLY_MONTH,
themeColor = themeColor,
unselectedColor = unselectedColor
)
Expand All @@ -163,7 +177,7 @@ fun ComposeCalendar(
maxYear = maxYear,
selectedYear = selectedYear,
monthList = monthList,
showOnlyMonth = showOnlyMonth,
showOnlyMonth = calendarType == CalendarType.ONLY_MONTH,
themeColor = themeColor,
unselectedColor = unselectedColor,
monthViewType = monthViewType
Expand All @@ -179,22 +193,30 @@ fun ComposeCalendar(
)
}
}
CalendarBottom(
onPositiveClick = { listener.onDateSelected(selectedDate) },
onCancelClick = { listener.onCanceled() },
themeColor = themeColor,
buttonTextSize = buttonTextSize,
negativeButtonTitle = negativeButtonTitle,
positiveButtonTitle = positiveButtonTitle
)
}
CalendarBottom(
onPositiveClick = { listener.onDateSelected(selectedDate) },
onCancelClick = { listener.onCanceled() },
themeColor = themeColor,
buttonTextSize = buttonTextSize,
negativeButtonTitle = negativeButtonTitle,
positiveButtonTitle = positiveButtonTitle
)
}
}
}


enum class MonthViewType {
ONLY_MONTH,
ONLY_NUMBER,
ONLY_NUMBER_ONE_COLUMN,
BOTH_NUMBER_AND_MONTH
}

enum class CalendarType {
ONLY_MONTH,
ONLY_YEAR,
MONTH_AND_YEAR,
ONE_SCREEN_MONTH_AND_YEAR
}
Loading

0 comments on commit 460ea2f

Please sign in to comment.