Desenhar um traço

Para ajudar você a criar traços de maneira idiomática no Compose, a API Ink oferece módulos de interoperabilidade do Compose para criação, pincel e geometria.

Para desenhar um traço no Compose, use o elemento combinável InProgressStrokes, que exige uma instância de pincel padrão, uma maneira de substituir o pincel padrão e um callback que processa traços concluídos.

  1. Configurar componente de UI

    InProgressStrokes(
      defaultBrush = currentBrush,
      nextBrush = onGetNextBrush,
      onStrokesFinished = onStrokesFinished,
    )
    
  2. Processar traços concluídos

    Quando os traços úmidos secam, eles são transmitidos ao aplicativo pelo argumento de callback onStrokesFinished de InProgressStrokes.

    Seu app precisa transmitir os traços finalizados para outro elemento combinável na mesma thread de UI para confirmar na tela.

    @Composable
    fun DrawingScreen(
      finishedStrokes: List<Strokes>,
      onStrokesFinished: (List<Stroke>) -> Unit,
      currentBrush: Brush,
      onGetNextBrush: () -> Brush,
      modifier: Modifier = Modifier
    ) {
      val canvasStrokeRenderer = remember { CanvasStrokeRenderer.create() }
    
      Box(modifier = Modifier.fillMaxSize()) {
          // The Canvas for drawing the permanent, dry strokes.
          Canvas(modifier = Modifier.fillMaxSize()) {
              finishedStrokes.forEach { stroke ->
                  canvasStrokeRenderer.draw(
                      stroke = stroke,
                      canvas = this,
                      strokeToScreenTransform = Matrix()
                  )
              }
          }
    
          //The wet ink layer for live drawing.
          // The InProgressStrokes composable for the wet ink layer goes here.
      }
    }