如何更改 TWebScrollBox 组件上滚动条的颜色？

Question

我有一个

TWebScrollBox

，里面有很多元素，但我不喜欢其中默认滚动条的颜色。

这是我在

TWebScrollBox

上的滚动条：

您可以看到滚动条由两个不同的部分组成：

• 白色背景色
• 还有灰色的前景滚动条和箭头。

我想改变以上两个部分的颜色。

我寻找滚动条颜色属性，但找不到。

是否可以在不使用 CSS 文件或 CSS 类的情况下更改滚动条上的颜色？我想简单地使用 Delphi 代码来做到这一点。

Answer 1

您可以使用以下代码更改滚动条颜色：

WebScrollBox.ElementHandle.style.setProperty('scrollbar-color','Fuchsia Green');

这可以变成一个很好的 Delphi 程序，如下所示：

procedure ChangeScrollbarColor(ScrollBox: TWebScrollBox; ColorThumb, ColorTrack: TColor);
var
  RGB: Integer;
  ColorThumbHex, ColorTrackHex: String;
begin
  RGB := ColorToRGB(ColorThumb);
  ColorThumbHex := '#' + Byte(RGB).ToHexString +
                  Byte(RGB shr 8).ToHexString +
                  Byte(RGB shr 16).ToHexString;

  RGB := ColorToRGB(ColorTrack);
  ColorTrackHex := '#' + Byte(RGB).ToHexString +
                Byte(RGB shr 8).ToHexString +
                Byte(RGB shr 16).ToHexString;

  ScrollBox.ElementHandle.style.setProperty('scrollbar-color',ColorThumbHex + ' ' + ColorTrackHex);
end;

此过程可以轻松地用于更改

TWebScrollBox

组件中滚动条的颜色。这个功能非常好，因为你可以向它传递普通的 Delphi

TColor

值，而不需要使用 HTML Colors。

这是一个例子：

ChangeScrollbarColor(MultiView, clFuchsia, clGreen);