NavigationBar: Added icons animation.

This commit is contained in:
acclorite 2024-07-16 15:25:02 +03:00
parent 7f785c8f1b
commit de81a4121e
2 changed files with 42 additions and 23 deletions

View file

@ -1,12 +1,13 @@
package ua.acclorite.book_story.presentation.components.bottom_navigation_bar
import androidx.compose.animation.Crossfade
import androidx.compose.animation.core.tween
import androidx.compose.foundation.layout.RowScope
import androidx.compose.foundation.layout.size
import androidx.compose.material3.Icon
import androidx.compose.material3.NavigationBarItem
import androidx.compose.material3.Text
import androidx.compose.runtime.Composable
import androidx.compose.runtime.remember
import androidx.compose.ui.Modifier
import androidx.compose.ui.res.painterResource
import androidx.compose.ui.res.stringResource
@ -30,12 +31,6 @@ fun RowScope.BottomNavigationBarItem(
isSelected: Boolean,
onClick: () -> Unit
) {
val icon = remember(isSelected) {
if (isSelected) item.selectedIcon
else item.unselectedIcon
}
NavigationBarItem(
label = {
CustomTooltip(
@ -56,11 +51,25 @@ fun RowScope.BottomNavigationBarItem(
text = stringResource(id = item.tooltip),
padding = 32.dp
) {
Crossfade(
targetState = isSelected,
animationSpec = tween(300),
label = ""
) {
if (it) {
Icon(
painter = painterResource(id = icon),
painter = painterResource(id = item.selectedIcon),
contentDescription = null,
modifier = Modifier.size(24.dp)
)
} else {
Icon(
painter = painterResource(id = item.unselectedIcon),
contentDescription = null,
modifier = Modifier.size(24.dp)
)
}
}
}
},
modifier = modifier

View file

@ -1,11 +1,12 @@
package ua.acclorite.book_story.presentation.components.custom_navigation_rail
import androidx.compose.animation.Crossfade
import androidx.compose.animation.core.tween
import androidx.compose.foundation.layout.size
import androidx.compose.material3.Icon
import androidx.compose.material3.NavigationRailItem
import androidx.compose.material3.Text
import androidx.compose.runtime.Composable
import androidx.compose.runtime.remember
import androidx.compose.ui.Modifier
import androidx.compose.ui.res.painterResource
import androidx.compose.ui.res.stringResource
@ -29,11 +30,6 @@ fun CustomNavigationRailItem(
isSelected: Boolean,
onClick: () -> Unit
) {
val icon = remember(isSelected) {
if (isSelected) item.selectedIcon
else item.unselectedIcon
}
NavigationRailItem(
label = {
CustomTooltip(
@ -54,11 +50,25 @@ fun CustomNavigationRailItem(
text = stringResource(id = item.tooltip),
padding = 16.dp
) {
Crossfade(
targetState = isSelected,
animationSpec = tween(300),
label = ""
) {
if (it) {
Icon(
painter = painterResource(id = icon),
painter = painterResource(id = item.selectedIcon),
contentDescription = null,
modifier = Modifier.size(24.dp)
)
} else {
Icon(
painter = painterResource(id = item.unselectedIcon),
contentDescription = null,
modifier = Modifier.size(24.dp)
)
}
}
}
},
modifier = modifier