Home > database >  Vertical LinearProgressIndicator in Jetpack Compose
Vertical LinearProgressIndicator in Jetpack Compose

Time:12-09

I want to show a vertical LinearProgressIndicator, meaning full height, small width, animating from top to bottom. I tried to simply rotating it by 90°, which surprisingly worked somehow, e.g.:

Modifier
    .height(8.dp)
    .fillMaxWidth()
    .graphicsLayer {
        rotationZ = 90f
        transformOrigin = TransformOrigin(0f, 0f)
    }

But it seems limited to the width of the Composable, hence not filling the whole height. Changing the order of modifiers or using width/fillMaxHeight didn't work either.

CodePudding user response:

The LinearProgressIndicator is designed according to Material Guidelines, which only includes a horizontal progress indicator.

For the vertical indicator you will have to create your own element. You can take LinearProgressIndicator source code as a sample, it is quite simple.

  • Related