Merge pull request #182 from kdroidFilter/feat/control-button-icon-colors

kdroidFilter · web-flow · commit f7e489089974 · 2026-04-09T16:04:59.000+03:00
feat(decorated-window): control button icon color customization
diff --git a/decorated-window-core/src/main/kotlin/io/github/kdroidfilter/nucleus/window/WindowControlArea.kt b/decorated-window-core/src/main/kotlin/io/github/kdroidfilter/nucleus/window/WindowControlArea.kt
@@ -16,6 +16,8 @@ import androidx.compose.runtime.setValue
 import androidx.compose.ui.Alignment
 import androidx.compose.ui.ExperimentalComposeUiApi
 import androidx.compose.ui.Modifier
+import androidx.compose.ui.graphics.Color
+import androidx.compose.ui.graphics.ColorFilter
 import androidx.compose.ui.graphics.painter.Painter
 import androidx.compose.ui.input.pointer.PointerEventType
 import androidx.compose.ui.input.pointer.onPointerEvent
@@ -53,6 +55,7 @@ fun TitleBarScope.WindowControlArea(
             iconPressed = closePressed,
             contentDescription = "Close",
             style = style,
+            isCloseButton = true,
         )
 
         // In fullscreen: show maximize icon but click exits fullscreen
@@ -136,6 +139,7 @@ fun TitleBarScope.DialogCloseButton(
             iconPressed = closePressed,
             contentDescription = "Close",
             style = style,
+            isCloseButton = true,
         )
     }
 }
@@ -151,6 +155,7 @@ private fun TitleBarScope.ControlButton(
     iconPressed: Painter,
     contentDescription: String,
     style: TitleBarStyle,
+    isCloseButton: Boolean = false,
 ) {
     val interactionSource = remember { MutableInteractionSource() }
 
@@ -171,16 +176,30 @@ private fun TitleBarScope.ControlButton(
         var hovered by remember { mutableStateOf(false) }
         var pressed by remember { mutableStateOf(false) }
 
+        val isCloseInteracted = isCloseButton && (hovered || pressed)
         val currentIcon =
             when {
                 pressed && (state.isActive || isKde) -> iconPressed
                 hovered && (state.isActive || isKde) -> iconHover
                 else -> icon
             }
 
+        // Apply icon tint when controlButtonIconColor is set,
+        // but skip tinting for close button hover/pressed (icons have baked-in colors).
+        val iconTint = style.colors.controlButtonIconColor
+        val iconHoverTint = style.colors.controlButtonIconHoverColor
+        val colorFilter =
+            when {
+                isCloseInteracted -> null
+                (hovered || pressed) && iconHoverTint != Color.Unspecified -> ColorFilter.tint(iconHoverTint)
+                iconTint != Color.Unspecified -> ColorFilter.tint(iconTint)
+                else -> null
+            }
+
         Image(
             painter = currentIcon,
             contentDescription = contentDescription,
+            colorFilter = colorFilter,
             modifier =
                 Modifier
                     .onPointerEvent(PointerEventType.Enter) { hovered = true }
diff --git a/decorated-window-core/src/main/kotlin/io/github/kdroidfilter/nucleus/window/WindowsWindowControlArea.kt b/decorated-window-core/src/main/kotlin/io/github/kdroidfilter/nucleus/window/WindowsWindowControlArea.kt
@@ -18,6 +18,7 @@ import androidx.compose.ui.Alignment
 import androidx.compose.ui.ExperimentalComposeUiApi
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.graphics.Color
+import androidx.compose.ui.graphics.ColorFilter
 import androidx.compose.ui.graphics.painter.Painter
 import androidx.compose.ui.input.pointer.PointerEventType
 import androidx.compose.ui.input.pointer.onPointerEvent
@@ -148,7 +149,7 @@ fun TitleBarScope.WindowsDialogCloseButton(
 }
 
 @OptIn(ExperimentalComposeUiApi::class)
-@Suppress("FunctionNaming", "LongParameterList", "UnusedParameter")
+@Suppress("FunctionNaming", "LongParameterList", "UnusedParameter", "CyclomaticComplexMethod")
 @Composable
 private fun TitleBarScope.WindowsCaptionButton(
     onClick: () -> Unit,
@@ -164,20 +165,29 @@ private fun TitleBarScope.WindowsCaptionButton(
 
     val isDark = LocalIsDarkTheme.current
     val backgroundColor =
-        when {
-            pressed && isCloseButton -> WindowsCloseButtonPressed
-            pressed -> if (isDark) WindowsButtonPressedDark else WindowsButtonPressedLight
-            hovered && isCloseButton -> WindowsCloseButtonHovered
-            hovered -> if (isDark) WindowsButtonHoveredDark else WindowsButtonHoveredLight
-            else -> Color.Transparent
-        }
+        captionButtonBackground(
+            hovered = hovered,
+            pressed = pressed,
+            isCloseButton = isCloseButton,
+            isDark = isDark,
+            style = style,
+        )
 
+    val isCloseHovered = (hovered || pressed) && isCloseButton
     val currentIcon =
         when {
-            (hovered || pressed) && isCloseButton && iconHover != null -> iconHover
+            isCloseHovered && iconHover != null -> iconHover
             else -> icon
         }
 
+    val colorFilter =
+        captionButtonColorFilter(
+            hovered = hovered,
+            pressed = pressed,
+            isCloseHovered = isCloseHovered,
+            style = style,
+        )
+
     Box(
         modifier =
             Modifier
@@ -202,6 +212,48 @@ private fun TitleBarScope.WindowsCaptionButton(
         Image(
             painter = currentIcon,
             contentDescription = contentDescription,
+            colorFilter = colorFilter,
         )
     }
 }
+
+private fun captionButtonBackground(
+    hovered: Boolean,
+    pressed: Boolean,
+    isCloseButton: Boolean,
+    isDark: Boolean,
+    style: TitleBarStyle,
+): Color {
+    val customHover = style.colors.iconButtonHoveredBackground
+    val customPressed = style.colors.iconButtonPressedBackground
+    val pressedColor =
+        customPressed.takeUnless { it == Color.Transparent }
+            ?: if (isDark) WindowsButtonPressedDark else WindowsButtonPressedLight
+    val hoveredColor =
+        customHover.takeUnless { it == Color.Transparent }
+            ?: if (isDark) WindowsButtonHoveredDark else WindowsButtonHoveredLight
+    return when {
+        pressed && isCloseButton -> WindowsCloseButtonPressed
+        pressed -> pressedColor
+        hovered && isCloseButton -> WindowsCloseButtonHovered
+        hovered -> hoveredColor
+        else -> Color.Transparent
+    }
+}
+
+private fun captionButtonColorFilter(
+    hovered: Boolean,
+    pressed: Boolean,
+    isCloseHovered: Boolean,
+    style: TitleBarStyle,
+): ColorFilter? {
+    val iconTint = style.colors.controlButtonIconColor
+    val iconHoverTint = style.colors.controlButtonIconHoverColor
+    return when {
+        isCloseHovered -> null
+        (hovered || pressed) && iconHoverTint != Color.Unspecified ->
+            ColorFilter.tint(iconHoverTint)
+        iconTint != Color.Unspecified -> ColorFilter.tint(iconTint)
+        else -> null
+    }
+}
diff --git a/decorated-window-core/src/main/kotlin/io/github/kdroidfilter/nucleus/window/styling/TitleBarStyling.kt b/decorated-window-core/src/main/kotlin/io/github/kdroidfilter/nucleus/window/styling/TitleBarStyling.kt
@@ -23,6 +23,8 @@ data class TitleBarColors(
     val fullscreenControlButtonsBackground: Color = Color.Unspecified,
     val iconButtonHoveredBackground: Color = Color.Transparent,
     val iconButtonPressedBackground: Color = Color.Transparent,
+    val controlButtonIconColor: Color = Color.Unspecified,
+    val controlButtonIconHoverColor: Color = Color.Unspecified,
 ) {
     @Composable
     fun backgroundFor(state: DecoratedWindowState): State<Color> =
diff --git a/decorated-window-jewel/src/main/kotlin/io/github/kdroidfilter/nucleus/window/jewel/JewelDecoratedWindow.kt b/decorated-window-jewel/src/main/kotlin/io/github/kdroidfilter/nucleus/window/jewel/JewelDecoratedWindow.kt
@@ -8,6 +8,7 @@ import androidx.compose.ui.window.rememberWindowState
 import io.github.kdroidfilter.nucleus.window.DecoratedWindow
 import io.github.kdroidfilter.nucleus.window.DecoratedWindowScope
 import io.github.kdroidfilter.nucleus.window.NucleusDecoratedWindowTheme
+import io.github.kdroidfilter.nucleus.window.styling.TitleBarStyle
 import org.jetbrains.jewel.foundation.theme.JewelTheme
 
 @Suppress("FunctionNaming", "LongParameterList")
@@ -24,15 +25,16 @@ fun JewelDecoratedWindow(
     alwaysOnTop: Boolean = false,
     onPreviewKeyEvent: (KeyEvent) -> Boolean = { false },
     onKeyEvent: (KeyEvent) -> Boolean = { false },
+    titleBarStyle: TitleBarStyle? = null,
     content: @Composable DecoratedWindowScope.() -> Unit,
 ) {
     val windowStyle = rememberJewelWindowStyle()
-    val titleBarStyle = rememberJewelTitleBarStyle()
+    val jewelTitleBarStyle = rememberJewelTitleBarStyle()
 
     NucleusDecoratedWindowTheme(
         isDark = JewelTheme.isDark,
         windowStyle = windowStyle,
-        titleBarStyle = titleBarStyle,
+        titleBarStyle = titleBarStyle ?: jewelTitleBarStyle,
     ) {
         DecoratedWindow(
             onCloseRequest = onCloseRequest,
diff --git a/decorated-window-jewel/src/main/kotlin/io/github/kdroidfilter/nucleus/window/jewel/JewelDialogTitleBar.kt b/decorated-window-jewel/src/main/kotlin/io/github/kdroidfilter/nucleus/window/jewel/JewelDialogTitleBar.kt
@@ -8,16 +8,18 @@ import io.github.kdroidfilter.nucleus.window.DecoratedDialogScope
 import io.github.kdroidfilter.nucleus.window.DecoratedDialogState
 import io.github.kdroidfilter.nucleus.window.DialogTitleBar
 import io.github.kdroidfilter.nucleus.window.TitleBarScope
+import io.github.kdroidfilter.nucleus.window.styling.LocalTitleBarStyle
+import io.github.kdroidfilter.nucleus.window.styling.TitleBarStyle
 
 @Suppress("FunctionNaming")
 @Composable
 fun DecoratedDialogScope.JewelDialogTitleBar(
     modifier: Modifier = Modifier,
     gradientStartColor: Color = Color.Unspecified,
+    style: TitleBarStyle = LocalTitleBarStyle.current,
     controlButtonsDirection: ControlButtonsDirection = ControlButtonsDirection.Auto,
     content: @Composable TitleBarScope.(DecoratedDialogState) -> Unit = {},
 ) {
-    val style = rememberJewelTitleBarStyle()
     DialogTitleBar(
         modifier = modifier,
         gradientStartColor = gradientStartColor,
diff --git a/decorated-window-jewel/src/main/kotlin/io/github/kdroidfilter/nucleus/window/jewel/JewelTitleBar.kt b/decorated-window-jewel/src/main/kotlin/io/github/kdroidfilter/nucleus/window/jewel/JewelTitleBar.kt
@@ -8,17 +8,19 @@ import io.github.kdroidfilter.nucleus.window.DecoratedWindowScope
 import io.github.kdroidfilter.nucleus.window.DecoratedWindowState
 import io.github.kdroidfilter.nucleus.window.TitleBar
 import io.github.kdroidfilter.nucleus.window.TitleBarScope
+import io.github.kdroidfilter.nucleus.window.styling.LocalTitleBarStyle
+import io.github.kdroidfilter.nucleus.window.styling.TitleBarStyle
 
 @Suppress("FunctionNaming")
 @Composable
 fun DecoratedWindowScope.JewelTitleBar(
     modifier: Modifier = Modifier,
     gradientStartColor: Color = Color.Unspecified,
+    style: TitleBarStyle = LocalTitleBarStyle.current,
     controlButtonsDirection: ControlButtonsDirection = ControlButtonsDirection.Auto,
     backgroundContent: @Composable () -> Unit = {},
     content: @Composable TitleBarScope.(DecoratedWindowState) -> Unit = {},
 ) {
-    val style = rememberJewelTitleBarStyle()
     TitleBar(
         modifier = modifier,
         gradientStartColor = gradientStartColor,
diff --git a/decorated-window-material2/src/main/kotlin/io/github/kdroidfilter/nucleus/window/material2/MaterialDecoratedWindow.kt b/decorated-window-material2/src/main/kotlin/io/github/kdroidfilter/nucleus/window/material2/MaterialDecoratedWindow.kt
@@ -9,6 +9,7 @@ import androidx.compose.ui.window.rememberWindowState
 import io.github.kdroidfilter.nucleus.window.DecoratedWindow
 import io.github.kdroidfilter.nucleus.window.DecoratedWindowScope
 import io.github.kdroidfilter.nucleus.window.NucleusDecoratedWindowTheme
+import io.github.kdroidfilter.nucleus.window.styling.TitleBarStyle
 
 @Suppress("FunctionNaming", "LongParameterList")
 @Composable
@@ -24,16 +25,17 @@ fun MaterialDecoratedWindow(
     alwaysOnTop: Boolean = false,
     onPreviewKeyEvent: (KeyEvent) -> Boolean = { false },
     onKeyEvent: (KeyEvent) -> Boolean = { false },
+    titleBarStyle: TitleBarStyle? = null,
     content: @Composable DecoratedWindowScope.() -> Unit,
 ) {
     val colors = MaterialTheme.colors
     val windowStyle = rememberMaterialWindowStyle(colors)
-    val titleBarStyle = rememberMaterialTitleBarStyle(colors)
+    val materialTitleBarStyle = rememberMaterialTitleBarStyle(colors)
 
     NucleusDecoratedWindowTheme(
         isDark = !colors.isLight,
         windowStyle = windowStyle,
-        titleBarStyle = titleBarStyle,
+        titleBarStyle = titleBarStyle ?: materialTitleBarStyle,
     ) {
         DecoratedWindow(
             onCloseRequest = onCloseRequest,
diff --git a/decorated-window-material2/src/main/kotlin/io/github/kdroidfilter/nucleus/window/material2/MaterialDialogTitleBar.kt b/decorated-window-material2/src/main/kotlin/io/github/kdroidfilter/nucleus/window/material2/MaterialDialogTitleBar.kt
@@ -1,6 +1,5 @@
 package io.github.kdroidfilter.nucleus.window.material2
 
-import androidx.compose.material.MaterialTheme
 import androidx.compose.runtime.Composable
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.graphics.Color
@@ -9,16 +8,18 @@ import io.github.kdroidfilter.nucleus.window.DecoratedDialogScope
 import io.github.kdroidfilter.nucleus.window.DecoratedDialogState
 import io.github.kdroidfilter.nucleus.window.DialogTitleBar
 import io.github.kdroidfilter.nucleus.window.TitleBarScope
+import io.github.kdroidfilter.nucleus.window.styling.LocalTitleBarStyle
+import io.github.kdroidfilter.nucleus.window.styling.TitleBarStyle
 
 @Suppress("FunctionNaming")
 @Composable
 fun DecoratedDialogScope.MaterialDialogTitleBar(
     modifier: Modifier = Modifier,
     gradientStartColor: Color = Color.Unspecified,
+    style: TitleBarStyle = LocalTitleBarStyle.current,
     controlButtonsDirection: ControlButtonsDirection = ControlButtonsDirection.Auto,
     content: @Composable TitleBarScope.(DecoratedDialogState) -> Unit = {},
 ) {
-    val style = rememberMaterialTitleBarStyle(MaterialTheme.colors)
     DialogTitleBar(
         modifier = modifier,
         gradientStartColor = gradientStartColor,
diff --git a/decorated-window-material2/src/main/kotlin/io/github/kdroidfilter/nucleus/window/material2/MaterialTitleBar.kt b/decorated-window-material2/src/main/kotlin/io/github/kdroidfilter/nucleus/window/material2/MaterialTitleBar.kt
@@ -1,6 +1,5 @@
 package io.github.kdroidfilter.nucleus.window.material2
 
-import androidx.compose.material.MaterialTheme
 import androidx.compose.runtime.Composable
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.graphics.Color
@@ -9,6 +8,8 @@ import io.github.kdroidfilter.nucleus.window.DecoratedWindowScope
 import io.github.kdroidfilter.nucleus.window.DecoratedWindowState
 import io.github.kdroidfilter.nucleus.window.TitleBar
 import io.github.kdroidfilter.nucleus.window.TitleBarScope
+import io.github.kdroidfilter.nucleus.window.styling.LocalTitleBarStyle
+import io.github.kdroidfilter.nucleus.window.styling.TitleBarStyle
 
 /**
  * Material 2 themed title bar.
@@ -23,11 +24,11 @@ import io.github.kdroidfilter.nucleus.window.TitleBarScope
 fun DecoratedWindowScope.MaterialTitleBar(
     modifier: Modifier = Modifier,
     gradientStartColor: Color = Color.Unspecified,
+    style: TitleBarStyle = LocalTitleBarStyle.current,
     controlButtonsDirection: ControlButtonsDirection = ControlButtonsDirection.Auto,
     backgroundContent: @Composable () -> Unit = {},
     content: @Composable TitleBarScope.(DecoratedWindowState) -> Unit = {},
 ) {
-    val style = rememberMaterialTitleBarStyle(MaterialTheme.colors)
     TitleBar(
         modifier = modifier,
         gradientStartColor = gradientStartColor,
diff --git a/decorated-window-material3/src/main/kotlin/io/github/kdroidfilter/nucleus/window/material/MaterialDecoratedWindow.kt b/decorated-window-material3/src/main/kotlin/io/github/kdroidfilter/nucleus/window/material/MaterialDecoratedWindow.kt
@@ -9,6 +9,7 @@ import androidx.compose.ui.window.rememberWindowState
 import io.github.kdroidfilter.nucleus.window.DecoratedWindow
 import io.github.kdroidfilter.nucleus.window.DecoratedWindowScope
 import io.github.kdroidfilter.nucleus.window.NucleusDecoratedWindowTheme
+import io.github.kdroidfilter.nucleus.window.styling.TitleBarStyle
 
 @Suppress("FunctionNaming", "LongParameterList")
 @Composable
@@ -24,16 +25,17 @@ fun MaterialDecoratedWindow(
     alwaysOnTop: Boolean = false,
     onPreviewKeyEvent: (KeyEvent) -> Boolean = { false },
     onKeyEvent: (KeyEvent) -> Boolean = { false },
+    titleBarStyle: TitleBarStyle? = null,
     content: @Composable DecoratedWindowScope.() -> Unit,
 ) {
     val colorScheme = MaterialTheme.colorScheme
     val windowStyle = rememberMaterialWindowStyle(colorScheme)
-    val titleBarStyle = rememberMaterialTitleBarStyle(colorScheme)
+    val materialTitleBarStyle = rememberMaterialTitleBarStyle(colorScheme)
 
     NucleusDecoratedWindowTheme(
         isDark = colorScheme.isDark(),
         windowStyle = windowStyle,
-        titleBarStyle = titleBarStyle,
+        titleBarStyle = titleBarStyle ?: materialTitleBarStyle,
     ) {
         DecoratedWindow(
             onCloseRequest = onCloseRequest,
diff --git a/decorated-window-material3/src/main/kotlin/io/github/kdroidfilter/nucleus/window/material/MaterialDialogTitleBar.kt b/decorated-window-material3/src/main/kotlin/io/github/kdroidfilter/nucleus/window/material/MaterialDialogTitleBar.kt
@@ -1,6 +1,5 @@
 package io.github.kdroidfilter.nucleus.window.material
 
-import androidx.compose.material3.MaterialTheme
 import androidx.compose.runtime.Composable
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.graphics.Color
@@ -9,16 +8,18 @@ import io.github.kdroidfilter.nucleus.window.DecoratedDialogScope
 import io.github.kdroidfilter.nucleus.window.DecoratedDialogState
 import io.github.kdroidfilter.nucleus.window.DialogTitleBar
 import io.github.kdroidfilter.nucleus.window.TitleBarScope
+import io.github.kdroidfilter.nucleus.window.styling.LocalTitleBarStyle
+import io.github.kdroidfilter.nucleus.window.styling.TitleBarStyle
 
 @Suppress("FunctionNaming")
 @Composable
 fun DecoratedDialogScope.MaterialDialogTitleBar(
     modifier: Modifier = Modifier,
     gradientStartColor: Color = Color.Unspecified,
+    style: TitleBarStyle = LocalTitleBarStyle.current,
     controlButtonsDirection: ControlButtonsDirection = ControlButtonsDirection.Auto,
     content: @Composable TitleBarScope.(DecoratedDialogState) -> Unit = {},
 ) {
-    val style = rememberMaterialTitleBarStyle(MaterialTheme.colorScheme)
     DialogTitleBar(
         modifier = modifier,
         gradientStartColor = gradientStartColor,
diff --git a/decorated-window-material3/src/main/kotlin/io/github/kdroidfilter/nucleus/window/material/MaterialTitleBar.kt b/decorated-window-material3/src/main/kotlin/io/github/kdroidfilter/nucleus/window/material/MaterialTitleBar.kt
diff --git a/docs/runtime/decorated-window.md b/docs/runtime/decorated-window.md
