@@ -99,7 +99,7 @@ val OudsNavigationBarHeight = 80.dp
9999 * 1. Add Haze dependency
100100 * 2. Follow Haze basic usage instructions:
101101 * - Define Haze state in the screen containing the navigation bar: `val hazeState = rememberHazeState()`
102- * - Use `hazeEffect` Modifier on OudsNavigationBar providing OUDS blur radius: `Modifier.hazeEffect(state = hazeState, style = HazeStyle(tint = null, blurRadius = OudsTheme.effects.blurNavigationBar .dp)),`
102+ * - Use `hazeEffect` Modifier on OudsNavigationBar providing OUDS blur radius: `Modifier.hazeEffect(state = hazeState, style = HazeStyle(tint = null, blurRadius = OudsTheme.navigationBarBlur .dp)),`
103103 * - Apply `hazeSource` Modifier on the content that scrolls behind the navigation bar: `Modifier.hazeSource(state = hazeState)`
104104 * 3. As your screen content needs to scroll behind the navigation bar, you'll probably need to adjust paddings and to add a spacer at the end of the screen
105105 * content that will have the height of OudsNavigationBar. For this, please use `OudsNavigationBarHeight` constant.
@@ -118,8 +118,8 @@ fun OudsNavigationBar(
118118 windowInsets : WindowInsets = NavigationBarDefaults .windowInsets,
119119 content : @Composable RowScope .() -> Unit
120120) {
121+ val topBorderColor = OudsTheme .colorScheme.border.minimal
121122 with (OudsTheme .componentsTokens.bar) {
122- val topBorderColor = colorBorder.value
123123 NavigationBar (
124124 modifier = modifier
125125 .focusProperties { canFocus = false }
@@ -196,20 +196,20 @@ fun RowScope.OudsNavigationBarItem(
196196
197197 // Top active indicator: visual alternative for selected item (a11y)
198198 val topIndicatorColor = topIndicatorColor(state = state)
199- val topIndicatorOpacityColor = topIndicatorColor.copy(alpha = topIndicatorColor.alpha * opacityTopActiveIndicator .value)
199+ val topIndicatorOpacityColor = topIndicatorColor.copy(alpha = topIndicatorColor.alpha * opacityActiveIndicatorCustom .value)
200200 val topIndicatorShape = RoundedCornerShape (
201201 topStart = 0 .dp,
202202 topEnd = 0 .dp,
203- bottomStart = borderRadiusTopActiveIndicator .value,
204- bottomEnd = borderRadiusTopActiveIndicator .value
203+ bottomStart = borderRadiusActiveIndicatorCustomTop .value,
204+ bottomEnd = borderRadiusActiveIndicatorCustomTop .value
205205 )
206206 this @OudsNavigationBarItem.AnimatedVisibility (
207207 modifier = Modifier .constrainAs(topIndicatorRef) {
208208 top.linkTo(parent.top)
209209 start.linkTo(parent.start)
210210 end.linkTo(parent.end)
211- height = Dimension .value(sizeHeightTopActiveIndicator .dp)
212- width = Dimension .value(sizeWidthTopActiveIndicator .dp)
211+ height = Dimension .value(sizeHeightActiveIndicatorCustom .dp)
212+ width = Dimension .value(sizeWidthActiveIndicatorCustomTop .dp)
213213 },
214214 visible = selected || state == OudsNavigationBarItemState .Hovered ,
215215 enter = fadeIn() + slideInVertically { - it * 2 },
@@ -298,11 +298,11 @@ private fun contentColor(state: OudsNavigationBarItemState, selected: Boolean):
298298private fun materialIndicatorColor (state : OudsNavigationBarItemState , selected : Boolean ): Color {
299299 return with (OudsTheme .componentsTokens.bar) {
300300 when (state) {
301- OudsNavigationBarItemState .Enabled -> if (selected) colorMaterialActiveIndicatorSelectedEnabled .value else OudsTheme .colorScheme.opacity.transparent
302- OudsNavigationBarItemState .Hovered -> if (selected) colorMaterialActiveIndicatorSelectedHover .value else colorMaterialActiveIndicatorUnselectedHover .value
303- OudsNavigationBarItemState .Pressed -> if (selected) colorMaterialActiveIndicatorSelectedPressed .value else colorMaterialActiveIndicatorUnselectedPressed .value
301+ OudsNavigationBarItemState .Enabled -> if (selected) colorActiveIndicatorAndroidSelectedEnabled .value else OudsTheme .colorScheme.opacity.transparent
302+ OudsNavigationBarItemState .Hovered -> if (selected) colorActiveIndicatorAndroidSelectedHover .value else colorActiveIndicatorAndroidUnselectedHover .value
303+ OudsNavigationBarItemState .Pressed -> if (selected) colorActiveIndicatorAndroidSelectedPressed .value else colorActiveIndicatorAndroidUnselectedPressed .value
304304 OudsNavigationBarItemState .Disabled -> OudsTheme .colorScheme.opacity.transparent
305- OudsNavigationBarItemState .Focused -> if (selected) colorMaterialActiveIndicatorSelectedFocus .value else colorMaterialActiveIndicatorUnselectedFocus .value
305+ OudsNavigationBarItemState .Focused -> if (selected) colorActiveIndicatorAndroidSelectedFocus .value else colorActiveIndicatorAndroidUnselectedFocus .value
306306 }
307307 }
308308}
@@ -311,11 +311,11 @@ private fun materialIndicatorColor(state: OudsNavigationBarItemState, selected:
311311private fun topIndicatorColor (state : OudsNavigationBarItemState ): Color {
312312 return with (OudsTheme .componentsTokens.bar) {
313313 when (state) {
314- OudsNavigationBarItemState .Enabled -> colorTopActiveIndicatorSelectedEnabled .value
315- OudsNavigationBarItemState .Hovered -> colorTopActiveIndicatorSelectedHover .value
316- OudsNavigationBarItemState .Pressed -> colorTopActiveIndicatorSelectedPressed .value
314+ OudsNavigationBarItemState .Enabled -> colorActiveIndicatorCustomSelectedEnabled .value
315+ OudsNavigationBarItemState .Hovered -> colorActiveIndicatorCustomSelectedHover .value
316+ OudsNavigationBarItemState .Pressed -> colorActiveIndicatorCustomSelectedPressed .value
317317 OudsNavigationBarItemState .Disabled -> OudsTheme .colorScheme.opacity.transparent
318- OudsNavigationBarItemState .Focused -> colorTopActiveIndicatorSelectedFocus .value
318+ OudsNavigationBarItemState .Focused -> colorActiveIndicatorCustomSelectedFocus .value
319319 }
320320 }
321321}
0 commit comments