NavigationBar: Added icons animation.
This commit is contained in:
parent
7f785c8f1b
commit
de81a4121e
2 changed files with 42 additions and 23 deletions
|
|
@ -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
|
||||
|
|
|
|||
|
|
@ -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
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue