Present Video Editor using Jetpack Compose

Register Contract#

The VideoEditorActivityResultContract extends from ActivityResultContract. It is used to start the video editor and handle its result. It parses the result into EditorSDKResult that provides a convenient API to check the status of the export.

Create SettingsList#

The VideoEditorSettingsList stores all the settings that are used to configure the video editor and its tools. The configure() method is used to configure the different ImglySettings models inside the SettingsList. Here, we configure the LoadSettings to set the source to the Uri of the video to be loaded.

Start Editor#

The ActivityResultLauncher obtained from registering the VideoEditorActivityResultContract is used to launch the video editor with the configured VideoEditorSettingsList.


class VideoEditorComposeActivity : ComponentActivity() {

    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContent {
            val editorLauncher = rememberLauncherForActivityResult(
                contract = VideoEditorActivityResultContract(),
                onResult = { result ->
                    when (result.resultStatus) {
                        EditorSDKResult.Status.CANCELED -> showMessage("Editor cancelled")
                        EditorSDKResult.Status.EXPORT_DONE -> showMessage("Result saved at ${result.resultUri}")
                        else -> {
                        }
                    }
                }
            )

            Column(
                modifier = Modifier
                    .fillMaxWidth()
                    .fillMaxHeight(),
                verticalArrangement = Arrangement.Center,
                horizontalAlignment = Alignment.CenterHorizontally,
            ) {
                Button(
                    onClick = {
                        // In this example, we do not need access to the Uri(s) after the editor is closed
                        // so we pass false in the constructor
                        val settingsList = VideoEditorSettingsList(false)
                            .configure<LoadSettings> {
                                // Set the source as the Uri of the video to be loaded
                                it.source = resourceUri(R.raw.skater)
                            }
                        editorLauncher.launch(settingsList)
                        // Release the SettingsList once done
                        settingsList.release()
                    },
                    shape = MaterialTheme.shapes.medium,
                ) {
                    Text(text = "Start", color = Color.White)
                }
            }
        }
    }
}