Vẽ nét

Để giúp bạn tạo nét theo cách thành ngữ của Compose, Ink API cung cấp các mô-đun tương tác Compose để tạo, vẽ bằng cọ và hình học.

Để vẽ một nét trong Compose, hãy sử dụng thành phần kết hợp InProgressStrokes. Thành phần này yêu cầu một thực thể cọ vẽ mặc định, một cách để ghi đè cọ vẽ mặc định và một lệnh gọi lại xử lý các nét đã hoàn thành.

1. Thiết lập thành phần giao diện người dùng

   InProgressStrokes(
     defaultBrush = currentBrush,
     nextBrush = onGetNextBrush,
     onStrokesFinished = onStrokesFinished,
   )
   

2. Xử lý các nét vẽ đã hoàn tất

   Khi các nét vẽ ướt trở nên khô, chúng sẽ được truyền đến ứng dụng thông qua đối số lệnh gọi lại onStrokesFinished của InProgressStrokes.

   Ứng dụng của bạn phải chuyển các nét đã hoàn thành sang một Thành phần kết hợp khác trong cùng một luồng giao diện người dùng để xác nhận các nét đó trên màn hình.

   @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.
     }
   }