Jetpack Compose AlertDialog彈出式視窗

MainActivity.kt

package app.ruyut.jetpackcompose

import android.os.Bundle
import androidx.activity.ComponentActivity
import androidx.activity.compose.setContent
import androidx.compose.material.AlertDialog
import androidx.compose.material.Button
import androidx.compose.material.Text
import androidx.compose.runtime.*

class MainActivity : ComponentActivity() {
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContent {
            ClickableText()
        }
    }
}

@Composable
fun ClickableText() {
    var showAlertDialog by remember { mutableStateOf(false) }

    Button(onClick = { showAlertDialog = true }) {
        Text("Show AlertDialog")
    }

    if (showAlertDialog) {
        AlertDialog(
            onDismissRequest = {
                // 點擊 彈出視窗 外的區域觸發
                showAlertDialog = false;
            },
            title = {
                Text("RuyutAlertDialog")
            },
            text = {
                Text("This is a dialog.")
            },
            confirmButton = {
                Button(
                    onClick = {
                        showAlertDialog = false
                    }
                )
                {
                    Text(text = "確認按鈕")
                }
            },
            dismissButton = {
                Button(onClick = { showAlertDialog = false })
                {
                    Text(text = "取消按鈕")
                }
            }
        )
    }
}