Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

UI adjustments, allow to navigate to IntroScreen from Conversion #141

Merged
merged 1 commit into from
Aug 21, 2024
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Original file line number Diff line number Diff line change
Expand Up @@ -56,6 +56,9 @@ fun ValkyriePlugin(
IconPack -> IconPackConversionScreen
Unspecified -> IntroScreen
}
editBackStack {
add(IntroScreen)
}
navigate(screen)
},
)
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -34,6 +34,7 @@ import io.github.composegears.valkyrie.ui.domain.model.Mode.Simple
import io.github.composegears.valkyrie.ui.domain.model.Mode.Unspecified
import io.github.composegears.valkyrie.ui.foundation.IconButton
import io.github.composegears.valkyrie.ui.foundation.VerticalSpacer
import io.github.composegears.valkyrie.ui.foundation.WeightSpacer
import io.github.composegears.valkyrie.ui.foundation.icons.BatchProcessing
import io.github.composegears.valkyrie.ui.foundation.icons.SimpleConversion
import io.github.composegears.valkyrie.ui.foundation.icons.ValkyrieIcons
Expand Down Expand Up @@ -79,7 +80,7 @@ private fun IntroScreenUI(
openSettings: () -> Unit,
onModeChange: (Mode) -> Unit,
) {
Box(modifier = Modifier.fillMaxSize()) {
Box {
IconButton(
modifier = Modifier
.padding(end = 8.dp)
Expand All @@ -90,35 +91,41 @@ private fun IntroScreenUI(
Column(
modifier = Modifier.fillMaxSize(),
horizontalAlignment = Alignment.CenterHorizontally,
verticalArrangement = Arrangement.Center,
) {
Text(
text = "Welcome to Valkyrie",
style = MaterialTheme.typography.titleLarge,
textAlign = TextAlign.Center,
)
VerticalSpacer(42.dp)
Text(
text = "Choose conversion mode",
style = MaterialTheme.typography.labelSmall,
color = LocalContentColor.current.copy(alpha = 0.5f),
textAlign = TextAlign.Center,
)
VerticalSpacer(8.dp)
WeightSpacer(weight = 0.3f)
Column(
horizontalAlignment = Alignment.CenterHorizontally,
verticalArrangement = Arrangement.Center,
) {
Text(
text = "Welcome to Valkyrie",
style = MaterialTheme.typography.titleLarge,
textAlign = TextAlign.Center,
)
VerticalSpacer(42.dp)
Text(
text = "Choose conversion mode",
style = MaterialTheme.typography.labelSmall,
color = LocalContentColor.current.copy(alpha = 0.5f),
textAlign = TextAlign.Center,
)
VerticalSpacer(8.dp)

SelectableCard(
onClick = { onModeChange(Simple) },
image = ValkyrieIcons.SimpleConversion,
title = "Simple",
description = "One-click conversion from SVG/XML into ImageVector",
)
VerticalSpacer(16.dp)
SelectableCard(
onClick = { onModeChange(IconPack) },
image = ValkyrieIcons.BatchProcessing,
title = "IconPack",
description = "Create organized icon pack with batch export into your project",
)
SelectableCard(
onClick = { onModeChange(Simple) },
image = ValkyrieIcons.SimpleConversion,
title = "Simple",
description = "One-click conversion from SVG/XML into ImageVector",
)
VerticalSpacer(16.dp)
SelectableCard(
onClick = { onModeChange(IconPack) },
image = ValkyrieIcons.BatchProcessing,
title = "IconPack",
description = "Create organized icon pack with batch export into your project",
)
}
WeightSpacer(weight = 0.7f)
}
Text(
modifier = Modifier
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -40,8 +40,11 @@ import com.composegears.tiamat.navDestination
import com.composegears.tiamat.navigationSlideInOut
import com.intellij.openapi.application.writeAction
import com.intellij.openapi.vfs.VirtualFileManager
import io.github.composegears.valkyrie.generator.imagevector.OutputFormat
import io.github.composegears.valkyrie.settings.ValkyriesSettings
import io.github.composegears.valkyrie.ui.domain.model.Mode
import io.github.composegears.valkyrie.ui.foundation.AppBarTitle
import io.github.composegears.valkyrie.ui.foundation.BackAction
import io.github.composegears.valkyrie.ui.foundation.ClearAction
import io.github.composegears.valkyrie.ui.foundation.SettingsAction
import io.github.composegears.valkyrie.ui.foundation.TopAppBar
Expand Down Expand Up @@ -87,6 +90,9 @@ val IconPackConversionScreen by navDestination<Unit> {
IconPackConversionUi(
state = state,
settings = settings,
onBack = {
navController.back(transition = navigationSlideInOut(false))
},
openSettings = {
navController.navigate(
dest = SettingsScreen,
Expand All @@ -107,6 +113,7 @@ val IconPackConversionScreen by navDestination<Unit> {
private fun IconPackConversionUi(
state: IconPackConversionState,
settings: ValkyriesSettings,
onBack: () -> Unit,
openSettings: () -> Unit,
onPickEvent: (PickerEvent) -> Unit,
updatePack: (BatchIcon, String) -> Unit,
Expand Down Expand Up @@ -143,6 +150,9 @@ private fun IconPackConversionUi(
) {
Column(modifier = Modifier.fillMaxSize()) {
TopAppBar {
if (state is IconsPickering) {
BackAction(onBack = onBack)
}
if (state is BatchProcessing.IconPackCreationState) {
ClearAction(onClear = onReset)
}
Expand Down Expand Up @@ -224,6 +234,32 @@ private fun LoadingStateUi(message: String) {
}
}

@Preview
@Composable
private fun IconPackConversionUiPickeringPreview() = PreviewTheme {
IconPackConversionUi(
state = IconsPickering,
settings = ValkyriesSettings(
mode = Mode.IconPack,
iconPackName = "MyPack",
packageName = "",
iconPackDestination = "",
nestedPacks = emptyList(),
outputFormat = OutputFormat.BackingProperty,
generatePreview = true,
),
onBack = {},
openSettings = {},
onPickEvent = {},
updatePack = { _, _ -> },
onDeleteIcon = {},
onReset = {},
onPreviewClick = {},
onExport = {},
onRenameIcon = { _, _ -> },
)
}

@Preview
@Composable
private fun LoadingStateUiPreview() = PreviewTheme {
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -26,6 +26,8 @@ import androidx.compose.ui.draw.clip
import androidx.compose.ui.graphics.Color
import androidx.compose.ui.text.style.TextAlign
import androidx.compose.ui.unit.dp
import io.github.composegears.valkyrie.ui.foundation.DragAndDropBox
import io.github.composegears.valkyrie.ui.foundation.WeightSpacer
import io.github.composegears.valkyrie.ui.foundation.dashedBorder
import io.github.composegears.valkyrie.ui.foundation.dnd.rememberMultiSelectDragAndDropHandler
import io.github.composegears.valkyrie.ui.foundation.icons.Collections
Expand All @@ -52,10 +54,11 @@ fun IconPackPickerStateUi(
val multipleFilePicker = rememberMultipleFilesPicker()
val directoryPicker = rememberDirectoryPicker()

Box(
Column(
modifier = modifier.fillMaxSize(),
contentAlignment = Alignment.Center,
horizontalAlignment = Alignment.CenterHorizontally,
) {
WeightSpacer(weight = 0.3f)
SelectableState(
onSelectPath = { paths ->
when {
Expand Down Expand Up @@ -89,6 +92,7 @@ fun IconPackPickerStateUi(
}
},
)
WeightSpacer(weight = 0.7f)
}
}

Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -113,6 +113,7 @@ fun ChoosePackDirectory(
}
}
}
VerticalSpacer(16.dp)
Button(
modifier = Modifier.align(Alignment.End),
enabled = state.nextAvailable,
Expand Down
Original file line number Diff line number Diff line change
@@ -1,7 +1,6 @@
package io.github.composegears.valkyrie.ui.screen.mode.simple.conversion

import androidx.compose.desktop.ui.tooling.preview.Preview
import androidx.compose.foundation.layout.Box
import androidx.compose.foundation.layout.Column
import androidx.compose.foundation.layout.fillMaxSize
import androidx.compose.foundation.layout.padding
Expand All @@ -21,6 +20,7 @@ import com.composegears.tiamat.navDestination
import com.composegears.tiamat.navigationSlideInOut
import com.intellij.openapi.ide.CopyPasteManager
import io.github.composegears.valkyrie.ui.foundation.AppBarTitle
import io.github.composegears.valkyrie.ui.foundation.BackAction
import io.github.composegears.valkyrie.ui.foundation.ClearAction
import io.github.composegears.valkyrie.ui.foundation.CopyAction
import io.github.composegears.valkyrie.ui.foundation.DragAndDropBox
Expand Down Expand Up @@ -49,6 +49,9 @@ val SimpleConversionScreen by navDestination<Unit> {
ConversionUi(
state = state,
onSelectPath = viewModel::selectPath,
onBack = {
navController.back(transition = navigationSlideInOut(false))
},
openSettings = {
navController.navigate(
dest = SettingsScreen,
Expand All @@ -62,6 +65,7 @@ val SimpleConversionScreen by navDestination<Unit> {
@Composable
private fun ConversionUi(
state: SimpleConversionState,
onBack: () -> Unit,
onSelectPath: (Path) -> Unit,
openSettings: () -> Unit,
resetIconContent: () -> Unit,
Expand All @@ -72,6 +76,7 @@ private fun ConversionUi(

PluginUI(
content = state.iconContent,
onBack = onBack,
onChoosePath = {
scope.launch {
val path = filePicker.launch()
Expand All @@ -95,6 +100,7 @@ private fun ConversionUi(
@Composable
private fun PluginUI(
content: String?,
onBack: () -> Unit,
onChoosePath: () -> Unit,
onClear: () -> Unit,
onCopy: () -> Unit,
Expand All @@ -103,6 +109,7 @@ private fun PluginUI(
) {
Column(modifier = Modifier.fillMaxSize()) {
TopAppBar {
BackAction(onBack = onBack)
AppBarTitle(title = "Simple conversion")
WeightSpacer()
if (content != null) {
Expand All @@ -118,14 +125,16 @@ private fun PluginUI(
text = content,
)
} else {
Box(
Column(
modifier = Modifier.fillMaxSize(),
contentAlignment = Alignment.Center,
horizontalAlignment = Alignment.CenterHorizontally,
) {
WeightSpacer(weight = 0.3f)
SelectableState(
onSelectPath = onSelectPath,
onChoosePath = onChoosePath,
)
WeightSpacer(weight = 0.7f)
}
}
}
Expand Down Expand Up @@ -169,5 +178,6 @@ private fun SimpleConversionScreenPreview() = PreviewTheme {
onSelectPath = {},
openSettings = {},
resetIconContent = {},
onBack = {},
)
}