Skip to content

Commit

Permalink
Merge pull request #70 from PetJournal/refactor/changes-to-new-pet-in…
Browse files Browse the repository at this point in the history
…tro-screen-design

Refactor/changes to new pet intro screen design
  • Loading branch information
N0stalgiaUltra authored Sep 19, 2024
2 parents 3be9bf2 + 64cf529 commit d99f295
Show file tree
Hide file tree
Showing 8 changed files with 154 additions and 88 deletions.
Original file line number Diff line number Diff line change
Expand Up @@ -132,7 +132,7 @@ val mainModule = module {
// ViewModels
viewModel<HomeScreenViewModel> { HomeScreenViewModelImpl(get(), get()) }
viewModel<IntroRegisterPetViewModel> {
com.soujunior.petjournal.ui.screens_app.screens_pets.introRegisterPetScreen.IntroIntroRegisterPetViewModelImpl(
com.soujunior.petjournal.ui.screens_app.screens_pets.introRegisterPetScreen.IntroRegisterPetViewModelImpl(
get(),
get(),
get()
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -42,6 +42,7 @@ fun ScaffoldCustom(
modifier: Modifier = Modifier
) {
Scaffold(
/*
topBar = {
if (showTopBar) {
Surface(shadowElevation = shadowBelowTopBar) {
Expand Down Expand Up @@ -89,6 +90,8 @@ fun ScaffoldCustom(
}
}
},
*/
bottomBar = {
if (showBottomBarNavigation) {
bottomNavigationBar()
Expand Down Expand Up @@ -118,6 +121,7 @@ fun ScaffoldCustom(
contentToUse: @Composable (PaddingValues) -> Unit = {},
modifier: Modifier = Modifier){
Scaffold(
/*
topBar = {
if (showTopBar) {
Surface(shadowElevation = shadowBelowTopBar) {
Expand Down Expand Up @@ -148,6 +152,8 @@ fun ScaffoldCustom(
}
}
},
*/
bottomBar = {
if (showBottomBarNavigation) {
bottomNavigationBar()
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -14,11 +14,11 @@ import kotlinx.coroutines.flow.MutableStateFlow
import kotlinx.coroutines.flow.StateFlow
import kotlinx.coroutines.launch

class IntroIntroRegisterPetViewModelImpl(
class IntroRegisterPetViewModelImpl(
private val setWasViewed: SetPetRegistrationWentLive,
private val getWasViewed: GetPetRegistrationWentLive,
private val getName: GetGuardianNameUseCase,
) : com.soujunior.petjournal.ui.screens_app.screens_pets.introRegisterPetScreen.IntroRegisterPetViewModel() {
) : IntroRegisterPetViewModel() {
override val name: StateFlow<String?> get() = _name
private val _name = MutableStateFlow("")
override val visualizedScreen: StateFlow<Boolean> get() = _visualizedScreen
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -2,118 +2,134 @@ package com.soujunior.petjournal.ui.screens_app.screens_pets.introRegisterPetScr

import androidx.compose.foundation.Image
import androidx.compose.foundation.isSystemInDarkTheme
import androidx.compose.foundation.layout.*
import androidx.compose.foundation.layout.Arrangement
import androidx.compose.foundation.layout.Row
import androidx.compose.foundation.layout.Spacer
import androidx.compose.foundation.layout.padding
import androidx.compose.foundation.layout.size
import androidx.compose.runtime.Composable
import androidx.compose.ui.Modifier
import androidx.compose.ui.res.painterResource
import androidx.compose.ui.tooling.preview.Preview
import androidx.compose.ui.unit.Dp
import androidx.compose.ui.unit.dp
import com.soujunior.petjournal.R
import com.soujunior.petjournal.ui.components.RoundedSquare
import com.soujunior.petjournal.ui.theme.ColorGrid
import ir.kaaveh.sdpcompose.sdp

@Composable
fun GridVectors() {
val defaultSize = 13
val defaultSize = 11
Row(
modifier = Modifier.padding(vertical = 2.dp),
horizontalArrangement = Arrangement.spacedBy(8.dp)
modifier = Modifier.padding(vertical = 2.sdp),
horizontalArrangement = Arrangement.spacedBy(8.sdp)
) {
RoundedSquare(
size = calcDefault(defaultSize, 8),
topLeftRadius = calcDefault(defaultSize, 4),
topRightRadius = defaultSize.dp,
bottomLeftRadius = defaultSize.dp,
bottomRightRadius = defaultSize.dp,
topRightRadius = defaultSize.sdp,
bottomLeftRadius = defaultSize.sdp,
bottomRightRadius = defaultSize.sdp,
colorBackground = ColorGrid.purple_grid,
image = painterResource(id = R.drawable.dog),
)
RoundedSquare(
size = calcDefault(defaultSize, 8),
topLeftRadius = defaultSize.dp,
topRightRadius = defaultSize.dp,
bottomLeftRadius = defaultSize.dp,
bottomRightRadius = defaultSize.dp,
topLeftRadius = defaultSize.sdp,
topRightRadius = defaultSize.sdp,
bottomLeftRadius = defaultSize.sdp,
bottomRightRadius = defaultSize.sdp,
colorBackground = ColorGrid.blue_grid,
image = painterResource(id = R.drawable.cat),
)
RoundedSquare(
size = calcDefault(defaultSize, 8),
topLeftRadius = defaultSize.dp,
topLeftRadius = defaultSize.sdp,
topRightRadius = calcDefault(defaultSize, 4),
bottomLeftRadius = defaultSize.dp,
bottomRightRadius = defaultSize.dp,
bottomLeftRadius = defaultSize.sdp,
bottomRightRadius = defaultSize.sdp,
colorBackground = ColorGrid.red_grid,
image = painterResource(id = R.drawable.parrot),
)

}
Row(
modifier = Modifier.padding(vertical = 2.dp),
horizontalArrangement = Arrangement.spacedBy(8.dp)
modifier = Modifier.padding(vertical = 2.sdp),
horizontalArrangement = Arrangement.spacedBy(8.sdp)
) {
RoundedSquare(
size = calcDefault(defaultSize, 8),
topLeftRadius = defaultSize.dp,
topRightRadius = defaultSize.dp,
bottomLeftRadius = defaultSize.dp,
bottomRightRadius = defaultSize.dp,
topLeftRadius = defaultSize.sdp,
topRightRadius = defaultSize.sdp,
bottomLeftRadius = defaultSize.sdp,
bottomRightRadius = defaultSize.sdp,
colorBackground = ColorGrid.pink_grid,
image = painterResource(id = R.drawable.penguim),
)
Image(
painter = if(isSystemInDarkTheme()) painterResource(id = R.drawable.logo_white) else painterResource(id = R.drawable.logo_purple) ,
painter = if (isSystemInDarkTheme()) painterResource(id = R.drawable.logo_white) else painterResource(
id = R.drawable.logo_black
),
contentDescription = "Image logo",
modifier = Modifier
.size(calcDefault(defaultSize, 8))
)
RoundedSquare(
size = calcDefault(defaultSize, 8),
topLeftRadius = defaultSize.dp,
topRightRadius = defaultSize.dp,
bottomLeftRadius = defaultSize.dp,
bottomRightRadius = defaultSize.dp,
topLeftRadius = defaultSize.sdp,
topRightRadius = defaultSize.sdp,
bottomLeftRadius = defaultSize.sdp,
bottomRightRadius = defaultSize.sdp,
colorBackground = ColorGrid.pink_grid,
image = painterResource(id = R.drawable.rat),
)

}

Row(
modifier = Modifier.padding(vertical = 2.dp),
horizontalArrangement = Arrangement.spacedBy(8.dp)
modifier = Modifier.padding(vertical = 2.sdp),
horizontalArrangement = Arrangement.spacedBy(8.sdp)
) {
RoundedSquare(
size = calcDefault(defaultSize, 8),
topLeftRadius = defaultSize.dp,
topRightRadius = defaultSize.dp,
topLeftRadius = defaultSize.sdp,
topRightRadius = defaultSize.sdp,
bottomLeftRadius = calcDefault(defaultSize, 4),
bottomRightRadius = defaultSize.dp,
colorBackground = ColorGrid.red_grid,
bottomRightRadius = defaultSize.sdp,
colorBackground = ColorGrid.monkey_grid,
image = painterResource(id = R.drawable.monkey),
)
RoundedSquare(
size = calcDefault(defaultSize, 8),
topLeftRadius = defaultSize.dp,
topRightRadius = defaultSize.dp,
bottomLeftRadius = defaultSize.dp,
bottomRightRadius = defaultSize.dp,
colorBackground = ColorGrid.blue_grid,
topLeftRadius = defaultSize.sdp,
topRightRadius = defaultSize.sdp,
bottomLeftRadius = defaultSize.sdp,
bottomRightRadius = defaultSize.sdp,
colorBackground = ColorGrid.shark_grid,
image = painterResource(id = R.drawable.shark),
)
RoundedSquare(
size = calcDefault(defaultSize, 8),
topLeftRadius = defaultSize.dp,
topRightRadius = defaultSize.dp,
bottomLeftRadius = defaultSize.dp,
colorBackground = ColorGrid.purple_grid,
topLeftRadius = defaultSize.sdp,
topRightRadius = defaultSize.sdp,
bottomLeftRadius = defaultSize.sdp,
colorBackground = ColorGrid.turtle_grid,
bottomRightRadius = calcDefault(defaultSize, 4),
image = painterResource(id = R.drawable.turtle),
)

}
Spacer(modifier = Modifier.padding(top = 64.dp))
Spacer(modifier = Modifier.padding(top = 13.sdp))
}

private fun calcDefault(sizeToMultiply: Int, quantity: Int): Dp {
return (sizeToMultiply * quantity).dp
}

@Preview
@Composable
private fun GridPrev() {

GridVectors()
}
Original file line number Diff line number Diff line change
@@ -1,5 +1,6 @@
package com.soujunior.petjournal.ui.screens_app.screens_pets.introRegisterPetScreen.components

import androidx.compose.foundation.isSystemInDarkTheme
import androidx.compose.foundation.layout.Spacer
import androidx.compose.foundation.layout.padding
import androidx.compose.material3.MaterialTheme
Expand All @@ -8,30 +9,44 @@ 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 com.soujunior.petjournal.R
import com.soujunior.petjournal.ui.components.CreateTitleAndImageLogo
import com.soujunior.petjournal.ui.theme.ColorCustom
import com.soujunior.petjournal.ui.util.capitalizeFirstLetter
import ir.kaaveh.sdpcompose.sdp
import ir.kaaveh.sdpcompose.ssp

@Composable
fun Header(name: String?) {
if (name != null) {
if (!name.isNullOrEmpty()) {
CreateTitleAndImageLogo(
spaceBetween = 10.sdp,
title = stringResource(id = R.string.hello_name, name.capitalizeFirstLetter()),
styleTitle = MaterialTheme.typography.headlineLarge,
)
Spacer(modifier = Modifier.padding(10.sdp))
Text(
text = stringResource(id = R.string.hello_name, name.capitalizeFirstLetter()),
style = MaterialTheme.typography.displaySmall,
textAlign = TextAlign.Center,
color = MaterialTheme.colorScheme.primary
text = stringResource(id = R.string.welcome_message),
style = MaterialTheme.typography.titleLarge,
textAlign = TextAlign.Start,
fontSize = 12.ssp,
color = if (isSystemInDarkTheme()) MaterialTheme.colorScheme.primary else ColorCustom.dark_texts_variant,
modifier = Modifier.padding(start = 16.sdp, end = 16.sdp)
)
} else {
CreateTitleAndImageLogo(
spaceBetween = 10.sdp,
title = "",
styleTitle = MaterialTheme.typography.headlineLarge,
)
Text(
text = stringResource(id = R.string.welcome_message),
style = MaterialTheme.typography.titleLarge,
fontSize = 12.ssp,
textAlign = TextAlign.Start,
color = if (isSystemInDarkTheme()) MaterialTheme.colorScheme.primary else ColorCustom.dark_texts_variant,
modifier = Modifier.padding(start = 16.sdp, end = 16.sdp)
)
}
Spacer(modifier = Modifier.padding(12.dp))

Text(
text = stringResource(id = R.string.welcome_message),
style = MaterialTheme.typography.headlineLarge,
textAlign = TextAlign.Center,
color = MaterialTheme.colorScheme.primary,
modifier = Modifier.padding(start = 10.dp, end = 10.dp)
)

Spacer(modifier = Modifier.padding(bottom = 20.dp))

}
}
Loading

0 comments on commit d99f295

Please sign in to comment.