title: How to add fading edge effect to Android Jetpack Compose Column or Row?
body: <p>I need to implement LazyColumn with top fading edge effect. On Android I use <a href="https://stackoverflow.com/a/47483972/3124400">fade gradient for ListView or RecyclerView</a>, but couldn't find any solution for Jetpack Compose!</p>
  <p><a href="https://i.stack.imgur.com/wDPWT.jpg" rel="noreferrer"><img src="https://i.stack.imgur.com/wDPWT.jpg" alt="enter image description here" /></a></p>
  <p>I tried to modify canvas:</p>
  <pre><code>@Composable
  fun Screen() {
      Box(
          Modifier
              .fillMaxWidth()
              .background(color = Color.Yellow)
      ) {
          LazyColumn(
              modifier = Modifier
                  .fillMaxSize()
                  .drawWithContent {
                      val colors = listOf(Color.Transparent, Color.Black)
                      drawContent()
                      drawRect(
                          brush = Brush.verticalGradient(colors),
                          blendMode = BlendMode.DstIn
                      )
                  }
          ) {
              itemsIndexed((1..1000).toList()) { item, index -&gt;
                  Text(
                      text = &quot;Item $item: $index value&quot;,
                      modifier = Modifier.padding(12.dp),
                      color = Color.Red,
                      fontSize = 24.sp
                  )
              }
          }
      }
  }
  </code></pre>
  <p>But have wrong result:</p>
  <p><a href="https://i.stack.imgur.com/xDPNZ.png" rel="noreferrer"><img src="https://i.stack.imgur.com/xDPNZ.png" alt="enter image description here" /></a></p>