Цвет фона строки заголовка JetBrains Compose для рабочего стола или темный режим

Question

Есть ли способ в JetBrains Compose для рабочего стола изменить цвет фона строки заголовка или просто изменить его для темного режима? Я использую MacOS, поэтому панель может быть светлой или темной. Также было бы неплохо сделать сам заголовок невидимым (но сохранить кнопки закрытия, свертывания и развертывания) и создать собственное представление под ним.

Я искал в коде окна создания, но не смог найти его там.

Answer 1

Compose построен на основе Swing, и кажется невозможным изменить цвет строки заголовка.

Но, по крайней мере, вы можете следить за темным/светлым режимом системы с помощью следующей опции в вашем build.gradle.kts:

      compose.desktop {
    application {
        // ...
        nativeDistributions {
            // ...
            jvmArgs(
                "-Dapple.awt.application.appearance=system"
            )
        }
    }
}

Другой вариант — создать собственную строку заголовка, как показано в этом руководстве , но это также скроет системные кнопки, что далеко не идеально.

Answer 2

проверьте это для пользовательской строки заголовка

Я написал это, чтобы решить свою проблему в Windows, но вы должны понять идею.

Я надеюсь, что команда Jetbrains предоставит готовое решение.

Обновлять

Также проверьте Jetbrains Jewel

Кажется, они использовали собственные кнопки (для Windows и Mac, но кнопки для Linux являются пользовательскими), когда я читал их код.

Answer 3

Основываясь на учебнике, указанном в приведенном выше ответе, я создал функцию расширения для DialogWindowScopeи добавил его в качестве первого элемента в недекорированном Dialog

      Dialog(...) {
    Column (...) {
        dialogTitleBar("dialog title") { on close clicked }
    }
}

@Composable
fun DialogWindowScope.dialogTitleBar(
    title: String? = null,
    onClick: () -> Unit
) = WindowDraggableArea{
    Column(modifier = Modifier.fillMaxWidth()) {
        Row(
            modifier = Modifier.fillMaxWidth(),
            horizontalArrangement = Arrangement.SpaceBetween,
            verticalAlignment = Alignment.CenterVertically
        ) {
            Text(
                modifier = Modifier.padding(start = 10.dp, bottom = 4.dp, top = 4.dp),
                color = MaterialTheme.colors.primary,
                fontSize = MaterialTheme.typography.body2.fontSize,
                text = title ?: ""
            )

            CloseButton(onClick)
        }
        Divider(
            Modifier.fillMaxWidth(),
            color = MaterialTheme.colors.primary.copy(alpha = .95f)
        )
    }
}

@Composable
fun CloseButton(onClick: () -> Unit) {
    val interactionSource = remember { MutableInteractionSource() }
    val isHovered by interactionSource.collectIsHoveredAsState()
    Icon(
        modifier = Modifier.size(24.dp)
            .background(if (isHovered) Color.Red else MaterialTheme.colors.onPrimary)
            .hoverable(interactionSource)
            .clickable(onClick = onClick),
        imageVector = Icons.Default.Close,
        contentDescription = "Close",
        tint = MaterialTheme.colors.primary
    )
}```