diff --git a/app/src/main/java/com/anytypeio/anytype/ui/settings/MainSettingFragment.kt b/app/src/main/java/com/anytypeio/anytype/ui/settings/MainSettingFragment.kt index 01af7b81e9..f5faa33318 100644 --- a/app/src/main/java/com/anytypeio/anytype/ui/settings/MainSettingFragment.kt +++ b/app/src/main/java/com/anytypeio/anytype/ui/settings/MainSettingFragment.kt @@ -8,6 +8,7 @@ import android.view.ViewGroup import androidx.compose.material.MaterialTheme import androidx.compose.ui.platform.ComposeView import androidx.compose.ui.platform.ViewCompositionStrategy +import androidx.compose.ui.unit.dp import androidx.fragment.app.viewModels import androidx.lifecycle.Lifecycle import androidx.lifecycle.lifecycleScope @@ -21,6 +22,8 @@ import com.anytypeio.anytype.presentation.settings.MainSettingsViewModel.Command import com.anytypeio.anytype.presentation.settings.MainSettingsViewModel.Event import com.anytypeio.anytype.ui.settings.system.SettingsActivity import com.anytypeio.anytype.ui_settings.main.MainSettingScreen +import com.google.android.material.bottomsheet.BottomSheetBehavior +import com.google.android.material.bottomsheet.BottomSheetDialog import kotlinx.coroutines.launch import javax.inject.Inject @@ -78,6 +81,15 @@ class MainSettingFragment : BaseBottomSheetComposeFragment() { override fun onViewCreated(view: View, savedInstanceState: Bundle?) { super.onViewCreated(view, savedInstanceState) + + val offsetFromTop = PADDING_TOP + (dialog as? BottomSheetDialog)?.behavior?.apply { + isFitToContents = false + expandedOffset = offsetFromTop + state = BottomSheetBehavior.STATE_EXPANDED + skipCollapsed = true + } + viewLifecycleOwner.lifecycleScope.launch { viewLifecycleOwner.repeatOnLifecycle(Lifecycle.State.STARTED) { vm.commands.collect { command -> processCommands(command) } @@ -112,4 +124,6 @@ class MainSettingFragment : BaseBottomSheetComposeFragment() { override fun releaseDependencies() { componentManager().mainSettingsComponent.release() } -} \ No newline at end of file +} + +private const val PADDING_TOP = 54 \ No newline at end of file diff --git a/core-ui/src/main/java/com/anytypeio/anytype/core_ui/foundation/Foundation.kt b/core-ui/src/main/java/com/anytypeio/anytype/core_ui/foundation/Foundation.kt index 19afc0455b..99681bdacf 100644 --- a/core-ui/src/main/java/com/anytypeio/anytype/core_ui/foundation/Foundation.kt +++ b/core-ui/src/main/java/com/anytypeio/anytype/core_ui/foundation/Foundation.kt @@ -109,6 +109,7 @@ fun Option( } } + @Composable fun Arrow() { Image( diff --git a/ui-settings/src/main/java/com/anytypeio/anytype/ui_settings/main/MainSettingScreen.kt b/ui-settings/src/main/java/com/anytypeio/anytype/ui_settings/main/MainSettingScreen.kt index b538d7223f..7cb4122b90 100644 --- a/ui-settings/src/main/java/com/anytypeio/anytype/ui_settings/main/MainSettingScreen.kt +++ b/ui-settings/src/main/java/com/anytypeio/anytype/ui_settings/main/MainSettingScreen.kt @@ -2,6 +2,8 @@ package com.anytypeio.anytype.ui_settings.main import androidx.compose.foundation.layout.Box import androidx.compose.foundation.layout.Column +import androidx.compose.foundation.layout.Spacer +import androidx.compose.foundation.layout.fillMaxSize import androidx.compose.foundation.layout.height import androidx.compose.foundation.layout.padding import androidx.compose.runtime.Composable @@ -23,44 +25,80 @@ fun MainSettingScreen( onAppearanceClicked: () -> Unit, showDebugMenu: Boolean ) { - Column { - Box( - modifier = Modifier.padding(vertical = 6.dp).align(Alignment.CenterHorizontally) - ) { - Dragger() - } - Option( - image = R.drawable.ic_account_and_data, - text = stringResource(R.string.account_and_data), - onClick = onAccountAndDataClicked - ) + Column(Modifier.fillMaxSize()) { + Header(Modifier.align(Alignment.CenterHorizontally)) + Spacer(modifier = Modifier.height(10.dp)) Divider() - Option( - image = R.drawable.ic_personalization, - text = stringResource(R.string.personalization), - onClick = onPersonalizationClicked + Spacer(modifier = Modifier.height(26.dp)) + Settings( + onAccountAndDataClicked = onAccountAndDataClicked, + onPersonalizationClicked = onPersonalizationClicked, + onAppearanceClicked = onAppearanceClicked, + onAboutAppClicked = onAboutAppClicked, + showDebugMenu = showDebugMenu, + onDebugClicked = onDebugClicked ) - Divider() - Option( - image = R.drawable.ic_appearance, - text = stringResource(R.string.appearance), - onClick = onAppearanceClicked - ) - Divider() - Option( - image = R.drawable.ic_about, - text = stringResource(R.string.about), - onClick = onAboutAppClicked - ) - Divider() - if (showDebugMenu) { - Option( - image = R.drawable.ic_debug, - text = stringResource(R.string.debug), - onClick = onDebugClicked - ) - Divider() - } Box(modifier = Modifier.height(16.dp)) } +} + +@Composable +private fun Settings( + onAccountAndDataClicked: () -> Unit, + onPersonalizationClicked: () -> Unit, + onAppearanceClicked: () -> Unit, + onAboutAppClicked: () -> Unit, + showDebugMenu: Boolean, + onDebugClicked: () -> Unit +) { + Section( + modifier = Modifier.padding(start = 20.dp, bottom = 4.dp), + title = "Settings" + ) + Option( + image = R.drawable.ic_account_and_data, + text = stringResource(R.string.account_and_data), + onClick = onAccountAndDataClicked + ) + Divider(paddingStart = 60.dp) + Option( + image = R.drawable.ic_personalization, + text = stringResource(R.string.personalization), + onClick = onPersonalizationClicked + ) + Divider(paddingStart = 60.dp) + Option( + image = R.drawable.ic_appearance, + text = stringResource(R.string.appearance), + onClick = onAppearanceClicked + ) + Divider(paddingStart = 60.dp) + Option( + image = R.drawable.ic_about, + text = stringResource(R.string.about), + onClick = onAboutAppClicked + ) + Divider(paddingStart = 60.dp) + if (showDebugMenu) { + Option( + image = R.drawable.ic_debug, + text = stringResource(R.string.debug), + onClick = onDebugClicked + ) + Divider(paddingStart = 60.dp) + } +} + +@Composable +private fun Header(modifier: Modifier = Modifier) { + Box(modifier = modifier.padding(vertical = 6.dp)) { + Dragger() + } + Box(modifier = modifier.padding(top = 12.dp, bottom = 28.dp)) { + SpaceNameBlock() + } + Box(modifier = modifier) { + SpaceImageBlock(Modifier) + } + NameBlock(name = "Personal") } \ No newline at end of file diff --git a/ui-settings/src/main/java/com/anytypeio/anytype/ui_settings/main/Views.kt b/ui-settings/src/main/java/com/anytypeio/anytype/ui_settings/main/Views.kt new file mode 100644 index 0000000000..f8f7b0cc92 --- /dev/null +++ b/ui-settings/src/main/java/com/anytypeio/anytype/ui_settings/main/Views.kt @@ -0,0 +1,61 @@ +package com.anytypeio.anytype.ui_settings.main + +import androidx.compose.foundation.Image +import androidx.compose.foundation.layout.Column +import androidx.compose.foundation.layout.height +import androidx.compose.foundation.layout.padding +import androidx.compose.foundation.layout.width +import androidx.compose.material.MaterialTheme +import androidx.compose.material.Text +import androidx.compose.runtime.Composable +import androidx.compose.ui.Modifier +import androidx.compose.ui.res.colorResource +import androidx.compose.ui.res.painterResource +import androidx.compose.ui.unit.dp +import androidx.compose.ui.unit.sp +import com.anytypeio.anytype.ui_settings.R + +@Composable +fun Section(modifier: Modifier = Modifier, title: String) { + Text( + modifier = modifier, + text = title, + color = colorResource(id = R.color.text_secondary), + fontSize = 13.sp + ) +} + +@Composable +fun NameBlock(modifier: Modifier = Modifier, name: String) { + Column(modifier = modifier.padding(start = 20.dp)) { + Text( + text = "Name", + color = colorResource(id = R.color.text_secondary), + fontSize = 13.sp + ) + Text( + text = name, + style = MaterialTheme.typography.h2, + ) + } +} + +@Composable +fun SpaceNameBlock(modifier: Modifier = Modifier) { + Text( + text = "Space", + style = MaterialTheme.typography.h3, + ) +} + +@Composable +fun SpaceImageBlock(modifier: Modifier = Modifier) { + Image( + modifier = modifier + .height(96.dp) + .width(96.dp) + .padding(bottom = 21.dp), + painter = painterResource(id = R.drawable.ic_home_widget_space), + contentDescription = "space_image" + ) +} \ No newline at end of file