From 2fc87d03cd42ac82b41c3b9e3e1e9b282e935741 Mon Sep 17 00:00:00 2001
From: monitor1394 <monitor1394@gmail.com>
Date: Tue, 17 Dec 2024 22:19:22 +0800
Subject: [PATCH] =?UTF-8?q?=E5=A2=9E=E5=8A=A0`UISlider`=E6=89=A9=E5=B1=95?=
 =?UTF-8?q?=E7=BB=84=E4=BB=B6?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 Documentation~/zh/changelog.md             |  1 +
 Runtime/Component/Background/Background.cs |  6 ++++++
 Runtime/Internal/Utilities/UIHelper.cs     | 18 ++++++++++++++++--
 3 files changed, 23 insertions(+), 2 deletions(-)

diff --git a/Documentation~/zh/changelog.md b/Documentation~/zh/changelog.md
index 366b47ab..b14f23d3 100644
--- a/Documentation~/zh/changelog.md
+++ b/Documentation~/zh/changelog.md
@@ -78,6 +78,7 @@ slug: /changelog
 
 ## master
 
+* (2024.12.17) 增加`UISlider`扩展组件
 * (2024.12.10) 增加`UIToggle`扩展组件
 * (2024.12.09) 修复`UITable`的`scrollbar`无法拖动的问题
 * (2024.12.07) 修复`Chart`节点下不能放自定义节点的问题
diff --git a/Runtime/Component/Background/Background.cs b/Runtime/Component/Background/Background.cs
index bce23b29..c6ee38f7 100644
--- a/Runtime/Component/Background/Background.cs
+++ b/Runtime/Component/Background/Background.cs
@@ -100,6 +100,12 @@ namespace XCharts.Runtime
             set { if (PropertyUtil.SetClass(ref m_BorderStyle, value)) SetComponentDirty(); }
         }
 
+        /// <summary>
+        /// the rect of background.
+        /// ||背景的矩形区域。
+        /// </summary>
+        public Rect rect { get; set; }
+
         public override void SetDefaultValue()
         {
             m_Show = true;
diff --git a/Runtime/Internal/Utilities/UIHelper.cs b/Runtime/Internal/Utilities/UIHelper.cs
index 592df19c..781fd944 100644
--- a/Runtime/Internal/Utilities/UIHelper.cs
+++ b/Runtime/Internal/Utilities/UIHelper.cs
@@ -14,16 +14,30 @@ namespace XCharts.Runtime
         internal static void DrawBackground(VertexHelper vh, UIComponent component)
         {
             var background = component.background;
+            var rect = component.graphRect;
+            if (background.imageWidth > 0 || background.imageHeight > 0)
+            {
+                if (background.imageWidth > 0)
+                {
+                    rect.width = background.imageWidth;
+                    rect.x = component.graphX + (component.graphWidth - background.imageWidth) / 2;
+                }
+                if (background.imageHeight > 0)
+                {
+                    rect.height = background.imageHeight;
+                    rect.y = component.graphY + (component.graphHeight - background.imageHeight) / 2;
+                }
+            }
+            background.rect = rect;
             if (!background.show)
                 return;
             if (background.image != null)
                 return;
-
             var backgroundColor = component.theme.GetBackgroundColor(background);
             var borderWidth = background.borderStyle.GetRuntimeBorderWidth();
             var borderColor = background.borderStyle.GetRuntimeBorderColor();
             var cornerRadius = background.borderStyle.GetRuntimeCornerRadius();
-            UGL.DrawRoundRectangleWithBorder(vh, component.graphRect, backgroundColor, backgroundColor, cornerRadius,
+            UGL.DrawRoundRectangleWithBorder(vh, background.rect, backgroundColor, backgroundColor, cornerRadius,
                 borderWidth, borderColor);
         }