mirror of
https://github.com/openflocon/Flocon.git
synced 2026-05-18 19:29:29 +00:00
Add FloconTab
This commit is contained in:
parent
88c37d75cc
commit
da3dde3487
2 changed files with 74 additions and 35 deletions
|
|
@ -57,7 +57,9 @@ import io.github.openflocon.library.designsystem.components.FloconDialogButtons
|
|||
import io.github.openflocon.library.designsystem.components.FloconDialogHeader
|
||||
import io.github.openflocon.library.designsystem.components.FloconJsonTree
|
||||
import io.github.openflocon.library.designsystem.components.FloconSurface
|
||||
import io.github.openflocon.library.designsystem.components.FloconTab
|
||||
import io.github.openflocon.library.designsystem.components.FloconTextField
|
||||
import io.github.openflocon.library.designsystem.components.TabType
|
||||
import io.github.openflocon.library.designsystem.components.defaultLabel
|
||||
import io.github.openflocon.library.designsystem.components.defaultPlaceHolder
|
||||
|
||||
|
|
@ -206,17 +208,21 @@ fun MockEditorScreen(
|
|||
)
|
||||
|
||||
Row(modifier = Modifier.fillMaxWidth()) {
|
||||
Tab(
|
||||
FloconTab(
|
||||
modifier = Modifier.weight(1F),
|
||||
text = "HttpCode + Body",
|
||||
isSelected = mock.responseType == EditableMockNetworkUiModel.ResponseType.BODY,
|
||||
tabType = TabType.Start,
|
||||
onSelected = {
|
||||
mock =
|
||||
mock.copy(responseType = EditableMockNetworkUiModel.ResponseType.BODY)
|
||||
}
|
||||
)
|
||||
Tab(
|
||||
FloconTab(
|
||||
modifier = Modifier.weight(1F),
|
||||
text = "Exception",
|
||||
isSelected = mock.responseType == EditableMockNetworkUiModel.ResponseType.EXCEPTION,
|
||||
tabType = TabType.End,
|
||||
onSelected = {
|
||||
mock =
|
||||
mock.copy(responseType = EditableMockNetworkUiModel.ResponseType.EXCEPTION)
|
||||
|
|
@ -374,15 +380,19 @@ fun MockEditorScreen(
|
|||
var isEditSelected by remember { mutableStateOf(true) }
|
||||
|
||||
Row(modifier = Modifier.fillMaxWidth()) {
|
||||
Tab(
|
||||
FloconTab(
|
||||
modifier = Modifier.weight(1F),
|
||||
text = "Edit",
|
||||
isSelected = isEditSelected,
|
||||
onSelected = { isEditSelected = true }
|
||||
onSelected = { isEditSelected = true },
|
||||
tabType = TabType.Start
|
||||
)
|
||||
Tab(
|
||||
FloconTab(
|
||||
modifier = Modifier.weight(1F),
|
||||
text = "Validate",
|
||||
isSelected = !isEditSelected,
|
||||
onSelected = { isEditSelected = false }
|
||||
onSelected = { isEditSelected = false },
|
||||
tabType = TabType.End
|
||||
)
|
||||
}
|
||||
|
||||
|
|
@ -521,32 +531,3 @@ private fun HeaderInputField(
|
|||
}
|
||||
}
|
||||
}
|
||||
|
||||
@Composable
|
||||
fun RowScope.Tab(
|
||||
text: String,
|
||||
isSelected: Boolean,
|
||||
onSelected: () -> Unit
|
||||
) {
|
||||
Text(
|
||||
modifier = Modifier.weight(1f)
|
||||
.clip(RoundedCornerShape(4.dp))
|
||||
.background(
|
||||
color = if (isSelected) {
|
||||
Color.White.copy(alpha = 0.8f)
|
||||
} else {
|
||||
Color.White.copy(alpha = 0.1f)
|
||||
},
|
||||
).clickable {
|
||||
onSelected()
|
||||
}.padding(vertical = 8.dp),
|
||||
text = text,
|
||||
textAlign = TextAlign.Center,
|
||||
style = FloconTheme.typography.bodyMedium,
|
||||
color = if (isSelected) {
|
||||
FloconTheme.colorPalette.primary
|
||||
} else {
|
||||
FloconTheme.colorPalette.onSurface.copy(alpha = 0.45f)
|
||||
},
|
||||
)
|
||||
}
|
||||
|
|
|
|||
|
|
@ -0,0 +1,58 @@
|
|||
package io.github.openflocon.library.designsystem.components
|
||||
|
||||
import androidx.compose.foundation.background
|
||||
import androidx.compose.foundation.clickable
|
||||
import androidx.compose.foundation.layout.padding
|
||||
import androidx.compose.foundation.shape.RoundedCornerShape
|
||||
import androidx.compose.material3.Text
|
||||
import androidx.compose.runtime.Composable
|
||||
import androidx.compose.ui.Modifier
|
||||
import androidx.compose.ui.draw.clip
|
||||
import androidx.compose.ui.graphics.Color
|
||||
import androidx.compose.ui.graphics.RectangleShape
|
||||
import androidx.compose.ui.text.style.TextAlign
|
||||
import androidx.compose.ui.unit.dp
|
||||
import io.github.openflocon.library.designsystem.FloconTheme
|
||||
|
||||
@Composable
|
||||
fun FloconTab(
|
||||
text: String,
|
||||
isSelected: Boolean,
|
||||
onSelected: ()-> Unit,
|
||||
tabType: TabType,
|
||||
modifier: Modifier = Modifier,
|
||||
) {
|
||||
Text(
|
||||
modifier = modifier
|
||||
.clip(
|
||||
when(tabType) {
|
||||
TabType.Start -> RoundedCornerShape(topStart = 8.dp, bottomStart = 8.dp)
|
||||
TabType.Middle -> RectangleShape
|
||||
TabType.End -> RoundedCornerShape(topEnd = 8.dp, bottomEnd = 8.dp)
|
||||
}
|
||||
)
|
||||
.background(
|
||||
color = if (isSelected) {
|
||||
Color.White.copy(alpha = 0.8f)
|
||||
} else {
|
||||
Color.White.copy(alpha = 0.1f)
|
||||
},
|
||||
).clickable {
|
||||
onSelected()
|
||||
}.padding(vertical = 8.dp),
|
||||
text = text,
|
||||
textAlign = TextAlign.Center,
|
||||
style = FloconTheme.typography.bodyMedium,
|
||||
color = if (isSelected) {
|
||||
FloconTheme.colorPalette.primary
|
||||
} else {
|
||||
FloconTheme.colorPalette.onSurface.copy(alpha = 0.45f)
|
||||
},
|
||||
)
|
||||
}
|
||||
|
||||
enum class TabType {
|
||||
Start,
|
||||
Middle,
|
||||
End
|
||||
}
|
||||
Loading…
Add table
Add a link
Reference in a new issue