Use plot theme background for the PlotPanel background.

Author: alshan

demo/plot/compose-desktop/src/main/kotlin/demo/plot/pixeldensity/PixelDensityTestDemo.kt

@@ -5,14 +5,15 @@
 
 package demo.plot.pixeldensity
 
+import androidx.compose.foundation.background
 import androidx.compose.foundation.layout.*
 import androidx.compose.material.Button
 import androidx.compose.material.MaterialTheme
 import androidx.compose.material.Slider
 import androidx.compose.material.Text
 import androidx.compose.runtime.*
-import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
+import androidx.compose.ui.graphics.Color
 import androidx.compose.ui.platform.LocalDensity
 import androidx.compose.ui.unit.Density
 import androidx.compose.ui.unit.dp
@@ -22,10 +23,12 @@ import org.jetbrains.letsPlot.Figure
 import org.jetbrains.letsPlot.geom.geomPoint
 import org.jetbrains.letsPlot.letsPlot
 import org.jetbrains.letsPlot.skia.compose.PlotPanel
+import org.jetbrains.letsPlot.themes.flavorDarcula
+import org.jetbrains.letsPlot.themes.flavorHighContrastDark
 
 fun main() = application {
     var pixelDensity by remember { mutableFloatStateOf(1.0f) }
-    
+
     Window(onCloseRequest = ::exitApplication, title = "Pixel Density Test Demo") {
         MaterialTheme {
             CompositionLocalProvider(LocalDensity provides Density(pixelDensity)) {
@@ -38,14 +41,14 @@ fun main() = application {
                         Column(modifier = Modifier.padding(16.dp)) {
                             Text("Current Pixel Density: ${String.format("%.2f", pixelDensity)}")
                             Text("Effective DPI: ${String.format("%.0f", pixelDensity * 96)}")
-                            
+
                             Slider(
                                 value = pixelDensity,
                                 onValueChange = { pixelDensity = it },
                                 valueRange = 0.5f..3.0f,
                                 modifier = Modifier.fillMaxWidth()
                             )
-                            
+
                             Row(
                                 horizontalArrangement = Arrangement.spacedBy(8.dp)
                             ) {
@@ -56,7 +59,7 @@ fun main() = application {
                             }
                         }
                     }
-                    
+
                     // Plot panel that reacts to pixel density changes
                     PlotPanel(
                         figure = createTestFigure(),
@@ -89,15 +92,15 @@ private fun Card(
 private fun createTestFigure(): Figure {
     val n = 100
     val rand = kotlin.random.Random(42)
-    
+
     val data = mapOf(
         "x" to List(n) { rand.nextDouble() * 10 },
         "y" to List(n) { rand.nextDouble() * 10 },
         "color" to List(n) { listOf("A", "B", "C", "D").random(rand) }
     )
-    
-    return letsPlot(data) + 
-           geomPoint(size = 3.0, alpha = 0.7) { 
-               x = "x"; y = "y"; color = "color" 
-           }
+
+    return letsPlot(data) +
+            geomPoint(size = 3.0, alpha = 0.7) {
+                x = "x"; y = "y"; color = "color"
+            } + flavorHighContrastDark()
 }

lets-plot-compose/src/desktopMain/kotlin/org/jetbrains/letsPlot/skia/compose/PlotPanelRaw.kt

@@ -14,13 +14,13 @@ import androidx.compose.ui.graphics.Color
 import androidx.compose.ui.layout.onSizeChanged
 import androidx.compose.ui.platform.LocalDensity
 import androidx.compose.ui.text.TextStyle
-import androidx.compose.ui.unit.dp
 import org.jetbrains.letsPlot.commons.geometry.DoubleVector
 import org.jetbrains.letsPlot.core.plot.builder.interact.tools.FigureModelHelper
 import org.jetbrains.letsPlot.core.spec.Option.Meta.Kind.GG_TOOLBAR
 import org.jetbrains.letsPlot.core.spec.config.PlotConfig
 import org.jetbrains.letsPlot.core.spec.front.SpecOverrideUtil
 import org.jetbrains.letsPlot.core.util.MonolithicCommon.processRawSpecs
+import org.jetbrains.letsPlot.core.util.PlotThemeHelper
 import org.jetbrains.letsPlot.core.util.sizing.SizingPolicy
 import org.jetbrains.letsPlot.skia.builderLW.MonolithicSkiaLW
 import org.jetbrains.letsPlot.skia.compose.desktop.PlotContainer
@@ -39,6 +39,25 @@ actual fun PlotPanelRaw(
     errorModifier: Modifier,
     computationMessagesHandler: (List<String>) -> Unit
 ) {
+
+    // Background
+
+    // Check if the modifier already has a background
+    val hasBackground = modifier.foldIn(false) { hasBg, element ->
+        hasBg || element.toString().contains("BackgroundElement")
+    }
+
+    // Apply a plot background only if the user hasn't set one
+    val finalModifier = if (!hasBackground) {
+        val lpBackground = rawSpec.let {
+            val lpColor = PlotThemeHelper.plotBackground(rawSpec)
+            Color(lpColor.red, lpColor.green, lpColor.blue, lpColor.alpha)
+        }
+        modifier.background(lpBackground)
+    } else {
+        modifier
+    }
+
     // Update density on each recomposition to handle monitor DPI changes (e.g., drag between HIDPI/regular monitor)
     val density = LocalDensity.current.density.toDouble()
 
@@ -59,20 +78,19 @@ actual fun PlotPanelRaw(
         }
     }
 
-    Column(modifier = modifier) {
+    Column(modifier = finalModifier) {
         if (plotFigureModel != null && GG_TOOLBAR in processedPlotSpec) {
             PlotToolbar(plotFigureModel!!)
         }
 
         Box(
-            modifier = modifier
+            modifier = finalModifier
                 .weight(1f) // Take the remaining vertical space
                 .fillMaxWidth() // Fill available width
                 .onSizeChanged { newSize ->
                     // Convert logical pixels (from Compose layout) to physical pixels (plot SVG pixels)
                     panelSize = DoubleVector(newSize.width / density, newSize.height / density)
                 }
-                .background(Color.LightGray)
         ) {
             if (PlotConfig.isFailure(processedPlotSpec)) {
                 BasicTextField(