0

question

I am using the android material3 library and want to change the color transparency of the indicator, but the source code uses color transparency by default to control the display or hide, how should I control the display and hide of the indicator?

Navigation bar source code

  val animationProgress: Float by animateFloatAsState(
            targetValue = if (selected) 1f else 0f,
            animationSpec = tween(ItemAnimationDurationMillis)
        )

        val indicator = @Composable {
            Box(
                Modifier.layoutId(IndicatorLayoutIdTag)
                    .background(
                        color = colors.indicatorColor.copy(alpha = animationProgress),
                        shape = NavigationBarTokens.ActiveIndicatorShape.toShape(),
                    )
            )
        }

The indicator refers to the position of marker 4 on this picture：navigationBar images tag

Gabriele Mariotti
  • 320,139
  • 94
  • 887
  • 841
waterbang
  • 11
  • 2

1 Answers1

0

You should make use of the library that Google created for this kind of things. It is called Accompanist and can be found here: https://github.com/google/accompanist.

Also, here you have some documentation: https://google.github.io/accompanist/systemuicontroller/

After you add the dependency for that library

implementation "com.google.accompanist:accompanist-systemuicontroller:0.26.2-beta"

you can do something like

systemUiController.setSystemBarsColor(
    color = Color.Transparent
)
MihaiBC
  • 472
  • 5
  • 15
  • Thanks for your answer，But this is the control system ui may not be the effect I want, What I want to hide is the indicator of [this component](https://m3.material.io/components/navigation-bar/specs), which is the style numbered 4 in the picture above. – waterbang Sep 02 '22 at 06:23