DOCSEARCHbyAlgolia
Submit Docs

Capturable

repository·master·Indexed 23 days ago

https://github.com/patilshreyas/capturable

A Jetpack Compose utility library for converting Composable UI content into Bitmap images. It provides a CaptureController via rememberCaptureController(), a Modifier.capturable() to mark target components, and a captureAsync() method to asynchronously retrieve an ImageBitmap.

Tokens
1K
Snippets
2
Records
6
Agent score
29%

What's inside Capturable

  1. How to capture Composable content as a Bitmap

    master

    Capturing Composable content involves three main steps:

    1. Initialize a Controller: Use the rememberCaptureController() Composable function to create a CaptureController instance. This controller manages the capture request.
    2. Apply the Modifier: Apply the Modifier.capturable(captureController) to the specific Composable component (or its parent container) that you want to convert into an image.
    3. Trigger Capture: Call captureController.captureAsync() within a coroutine scope. This method returns a deferred result that, when awaited, provides the ImageBitmap.
    @Composable
fun TicketScreen() {
    val captureController = rememberCaptureController()
    val scope = rememberCoroutineScope()

    // 1. The content to be captured is wrapped in a container with the .capturable modifier
    Column(modifier = Modifier.capturable(captureController)) {
        MovieTicketContent(...)
    }

    Button(onClick = {
        // 2. Trigger the capture asynchronously
        scope.launch {
            val bitmapAsync = captureController.captureAsync()
            try {
                val bitmap = bitmapAsync.await()
                // Use the resulting ImageBitmap here
            } catch (error: Throwable) {
                // Handle capture errors
            }
        }
    }) {
        Text("Capture")
    }
}

  3. CaptureController#captureAsync()

    master

    The captureAsync() method initiates a request to capture the content associated with the CaptureController.

    • Return Value: Returns an asynchronous object (Deferred) that resolves to an ImageBitmap.
    • Thread Safety: This method is safe to call from the Main thread.
    • Error Handling: It is recommended to wrap the .await() call in a try-catch block to handle potential Throwable errors during the capture process.

  4. Capture content asynchronously with captureAsync()

    master

    The CaptureController provides the captureAsync() method to request a capture of the content associated with the controller. This method returns a Deferred<ImageBitmap>, allowing you to handle the resulting image asynchronously.

    Important Usage Rules:

    • This method is thread-safe and can be called directly from the main thread.
    • Do not call captureAsync() directly inside the body of a @Composable function. Instead, call it within a callback (e.g., inside an onClick listener) to avoid triggering captures during the composition phase.

  5. Initialize a CaptureController with rememberCaptureController()

    master
    To use Capturable, you must first initialize a CaptureController within a @Composable function using rememberCaptureController(). This function manages the underlying GraphicsLayer required for the capture process. You should pass this controller instance to the Capturable component to link it to the content you wish to capture.

  6. Modifier.capturable()

    master
    The capturable() modifier is used to mark a Composable component as a target for capture. It requires an instance of CaptureController to function. Everything contained within the Composable applying this modifier will be included in the resulting Bitmap.