Landscape mode support for EpochConverter

This commit is contained in:
Sad Ellie 2023-02-01 18:00:55 +04:00
parent 56b89ab0f8
commit 790457cb6f
5 changed files with 134 additions and 84 deletions

View File

@ -16,7 +16,7 @@
* along with this program. If not, see <https://www.gnu.org/licenses/>.
*/
package com.sadellie.unitto.feature.converter.components
package com.sadellie.unitto.core.ui.common
import android.content.res.Configuration
import androidx.compose.foundation.layout.Arrangement
@ -36,7 +36,7 @@ import androidx.compose.ui.unit.dp
* When Landscape mode will place [content1] and [content2] in a [Row].
*/
@Composable
internal fun PortraitLandscape(
fun PortraitLandscape(
modifier: Modifier,
content1: @Composable (Modifier) -> Unit,
content2: @Composable (Modifier) -> Unit,

View File

@ -50,7 +50,7 @@ import androidx.lifecycle.viewmodel.compose.viewModel
import com.sadellie.unitto.core.ui.R
import com.sadellie.unitto.core.ui.common.AnimatedTopBarText
import com.sadellie.unitto.feature.converter.components.Keyboard
import com.sadellie.unitto.feature.converter.components.PortraitLandscape
import com.sadellie.unitto.core.ui.common.PortraitLandscape
import com.sadellie.unitto.feature.converter.components.TopScreenPart
import kotlinx.coroutines.delay

View File

@ -19,27 +19,19 @@
package com.sadellie.unitto.feature.epoch
import androidx.compose.foundation.background
import androidx.compose.foundation.layout.Arrangement
import androidx.compose.foundation.layout.Column
import androidx.compose.foundation.layout.Spacer
import androidx.compose.foundation.layout.fillMaxSize
import androidx.compose.foundation.layout.fillMaxWidth
import androidx.compose.foundation.layout.padding
import androidx.compose.foundation.layout.width
import androidx.compose.material.icons.Icons
import androidx.compose.material.icons.filled.SwapHoriz
import androidx.compose.material3.Button
import androidx.compose.material3.Icon
import androidx.compose.material3.MaterialTheme
import androidx.compose.material3.Text
import androidx.compose.runtime.Composable
import androidx.compose.ui.Modifier
import androidx.compose.ui.res.stringResource
import androidx.compose.ui.text.style.TextAlign
import androidx.compose.ui.unit.dp
import androidx.hilt.navigation.compose.hiltViewModel
import androidx.lifecycle.compose.collectAsStateWithLifecycle
import com.sadellie.unitto.core.ui.common.UnittoTopAppBar
import com.sadellie.unitto.core.ui.common.PortraitLandscape
import com.sadellie.unitto.feature.epoch.component.DateTextField
import com.sadellie.unitto.feature.epoch.component.EpochKeyboard
import com.sadellie.unitto.feature.epoch.component.TopPart
@ -74,72 +66,57 @@ private fun EpochScreen(
title = stringResource(R.string.epoch_converter),
navigateUpAction = navigateUpAction
) { padding ->
Column(
PortraitLandscape(
modifier = Modifier.padding(padding),
verticalArrangement = Arrangement.spacedBy(8.dp)
) {
TopPart(
modifier = Modifier
.fillMaxSize()
.padding(horizontal = 8.dp)
.weight(1f),
unixToDate = !uiState.dateToUnix,
dateField = {
Column(
modifier = Modifier
.background(MaterialTheme.colorScheme.background)
.animateItemPlacement()
) {
DateTextField(
modifier = Modifier.fillMaxWidth(),
date = uiState.dateField
)
Text(
text = "date",
modifier = Modifier.fillMaxWidth(),
textAlign = TextAlign.End
)
content1 = {
TopPart(
modifier = it,
swap = swap,
unixToDate = !uiState.dateToUnix,
dateField = {
Column(
modifier = Modifier
.background(MaterialTheme.colorScheme.background)
.animateItemPlacement()
) {
DateTextField(
modifier = Modifier.fillMaxWidth(),
date = uiState.dateField
)
Text(
text = "date",
modifier = Modifier.fillMaxWidth(),
textAlign = TextAlign.End
)
}
},
unixField = {
Column(
modifier = Modifier
.background(MaterialTheme.colorScheme.background)
.animateItemPlacement()
) {
UnixTextField(
modifier = Modifier.fillMaxWidth(),
unix = uiState.unixField
)
Text(
text = "unix",
modifier = Modifier.fillMaxWidth(),
textAlign = TextAlign.End
)
}
}
},
unixField = {
Column(
modifier = Modifier
.background(MaterialTheme.colorScheme.background)
.animateItemPlacement()
) {
UnixTextField(
modifier = Modifier.fillMaxWidth(),
unix = uiState.unixField
)
Text(
text = "unix",
modifier = Modifier.fillMaxWidth(),
textAlign = TextAlign.End
)
}
}
)
Button(
onClick = swap,
modifier = Modifier
.fillMaxWidth()
.padding(horizontal = 8.dp),
) {
Icon(Icons.Default.SwapHoriz, null)
Spacer(modifier = Modifier.width(8.dp))
Text("SWAP")
)
},
content2 = {
EpochKeyboard(
modifier = it,
addSymbol = addSymbol,
clearSymbols = clearSymbols,
deleteSymbol = deleteSymbol
)
}
EpochKeyboard(
modifier = Modifier
.fillMaxSize()
.padding(horizontal = 8.dp)
.weight(1f),
addSymbol = addSymbol,
clearSymbols = clearSymbols,
deleteSymbol = deleteSymbol
)
}
)
}
}

View File

@ -0,0 +1,65 @@
/*
* Unitto is a unit converter for Android
* Copyright (c) 2023 Elshan Agaev
*
* This program is free software: you can redistribute it and/or modify
* it under the terms of the GNU General Public License as published by
* the Free Software Foundation, either version 3 of the License, or
* (at your option) any later version.
*
* This program is distributed in the hope that it will be useful,
* but WITHOUT ANY WARRANTY; without even the implied warranty of
* MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
* GNU General Public License for more details.
*
* You should have received a copy of the GNU General Public License
* along with this program. If not, see <https://www.gnu.org/licenses/>.
*/
package com.sadellie.unitto.feature.epoch.component
import androidx.compose.animation.core.FastOutSlowInEasing
import androidx.compose.animation.core.animateIntAsState
import androidx.compose.animation.core.tween
import androidx.compose.foundation.interaction.MutableInteractionSource
import androidx.compose.foundation.interaction.collectIsPressedAsState
import androidx.compose.foundation.layout.PaddingValues
import androidx.compose.foundation.layout.Spacer
import androidx.compose.foundation.layout.fillMaxWidth
import androidx.compose.foundation.layout.padding
import androidx.compose.foundation.layout.width
import androidx.compose.foundation.shape.RoundedCornerShape
import androidx.compose.material.icons.Icons
import androidx.compose.material.icons.filled.SwapHoriz
import androidx.compose.material3.Button
import androidx.compose.material3.Icon
import androidx.compose.material3.Text
import androidx.compose.runtime.Composable
import androidx.compose.runtime.getValue
import androidx.compose.runtime.remember
import androidx.compose.ui.Modifier
import androidx.compose.ui.unit.dp
@Composable
internal fun SwapButton(swap: () -> Unit) {
val interactionSource = remember { MutableInteractionSource() }
val isPressed by interactionSource.collectIsPressedAsState()
val cornerRadius: Int by animateIntAsState(
targetValue = if (isPressed) 30 else 50,
animationSpec = tween(easing = FastOutSlowInEasing),
)
Button(
onClick = swap,
shape = RoundedCornerShape(cornerRadius),
modifier = Modifier
.fillMaxWidth()
.padding(horizontal = 8.dp),
contentPadding = PaddingValues(vertical = 26.dp, horizontal = 8.dp),
interactionSource = interactionSource
) {
Icon(Icons.Default.SwapHoriz, null)
Spacer(modifier = Modifier.width(8.dp))
Text("SWAP")
}
}

View File

@ -19,28 +19,36 @@
package com.sadellie.unitto.feature.epoch.component
import androidx.compose.foundation.layout.Arrangement
import androidx.compose.foundation.layout.Column
import androidx.compose.foundation.lazy.LazyColumn
import androidx.compose.foundation.lazy.LazyItemScope
import androidx.compose.runtime.Composable
import androidx.compose.ui.Modifier
import androidx.compose.ui.unit.dp
@Composable
fun TopPart(
modifier: Modifier,
unixToDate: Boolean,
swap: () -> Unit,
dateField: @Composable() (LazyItemScope.() -> Unit),
unixField: @Composable() (LazyItemScope.() -> Unit),
) {
LazyColumn(
Column(
modifier = modifier,
verticalArrangement = Arrangement.Bottom
verticalArrangement = Arrangement.spacedBy(8.dp)
) {
if (unixToDate) {
item("unix") { unixField() }
item("date") { dateField() }
} else {
item("date") { dateField() }
item("unix") { unixField() }
LazyColumn(
verticalArrangement = Arrangement.Bottom
) {
if (unixToDate) {
item("unix") { unixField() }
item("date") { dateField() }
} else {
item("date") { dateField() }
item("unix") { unixField() }
}
}
SwapButton(swap)
}
}