Jetpack Compose Show Progress Bar Dialog

@Composablefun SelectPhotoScreen() {    var showProgress by remember { mutableStateOf(false) }    var progressState by remember { mutableStateOf( Pair(0.0f, "") ) }    fun onStart() {        showProgress = true        coroutineScope.launch {            progressState = Pair(0.0f, "Starting")            delay(1000)            progressState = Pair(0.1f, "Going well")            delay(2000)            progressState = Pair(0.1f, "Half way through")            delay(2000)            progressState = Pair(0.1f, "Done")            // delay(1000)            // showProgress = false        }    }    Button(onClick = { onStart() }) {      Text("Start")    }    if (showProgress) {        ProgressDialog(            title = "Importing ...",            progressState = progressState,            onDismiss = { showProgress = false },            onComplete = {                // do something                showProgress = false            }        )    }}
@Composablefun ProgressDialog(    title: String? = null,    progressState: Pair<Float, String>,    onDismiss: () -> Unit,    onComplete: () -> Unit) {    AlertDialog(        modifier = Modifier.fillMaxWidth(),        onDismissRequest = {            onDismiss()        },        /*        // https://stackoverflow.com/questions/69452854/increase-space-between-title-and-text-of-alertdialog-in-compose        title = {           if (!title.isNullOrEmpty()) {               Text(title)           }        },         */        text = {            Column (                modifier = Modifier                    .fillMaxWidth()                    .padding(8.dp),                // horizontalAlignment = Alignment.CenterHorizontally            ) {                if (!title.isNullOrEmpty()) {                    Text(title,                        modifier = Modifier.padding(vertical = 8.dp),                        style = MaterialTheme.typography.subtitle1)                }                val (progress, message) = progressState                ProgressBar(modifier = Modifier                    .height(16.dp)                    .fillMaxWidth(), progress = progress)                    if (message.isNotEmpty()) {                  Text(modifier = Modifier.padding(vertical = 8.dp), text = message)                }            }        },        // buttons = { }        dismissButton = {            val isComplete = progressState.status != Status.LOADING            Button(enabled = isComplete, onClick = onComplete ) {                Text("Done")            }        },        confirmButton = {        }    )}

❤️ Is this article helpful?

Buy me a coffee ☕ or support my work via PayPal to keep this space 🖖 and ad-free.

Do send some 💖 to @d_luaz or share this article.

✨ By Desmond Lua

A dream boy who enjoys making apps, travelling and making youtube videos. Follow me on @d_luaz

👶 Apps I built

Travelopy - discover travel places in Malaysia, Singapore, Taiwan, Japan.