#### Howdy, Stranger!

It looks like you're new here. If you want to get involved, click one of these buttons!

# Gardient Panel

Member Posts: 106
Hi,

How can I make a TShape or TPanle or TPaint or wathever to have a gardient color so they will look like the Windows XP TitleBar, or XP Toolbar (the gardeint color is changing from TopLeft to ButtomRight I think)?

Regards,
Arash

• Member Posts: 6,349
: Hi,
:
: How can I make a TShape or TPanle or TPaint or wathever to have a gardient color so they will look like the Windows XP TitleBar, or XP Toolbar (the gardeint color is changing from TopLeft to ButtomRight I think)?
:
: Regards,
: Arash
:
This problem is basically a mathematical one. You need some code to calculate the Red-Green-Blue values based on the distance from the source. Here I have a simple but slow code, which shows two things: a gradient over 1 dimension, and a gradient over 2 dimensions. I haven't seen the XP-titlebars yet, so I don't have any clear idea of what they look like, or how they react to resizing.
[code]
procedure TForm1.PaintBox1Paint(Sender: TObject);
var
x, y: integer;
Factor: real;
begin
with TPaintBox(Sender), TPaintBox(Sender).Canvas do begin
{ Factor := 256/Width; // Necessary to make the gradient fill entire width
for x := 0 to Width - 1 do begin
Pen.Color :=
Round(X*Factor)*256*256 // Red
+Round(X*Factor)*256 // Green
+Round(X*Factor); // Blue
MoveTo(X,0);
LineTo(X,Height-1);
end;}
Factor := 256/Sqrt(Sqr(Width)+Sqr(Height)); // Necessary to make the gradient fill entire canvas
for x := 0 to Width - 1 do
for y := 0 to Height -1 do begin
Pixels[X,Y] :=
Round(Sqrt(Sqr(X)+Sqr(Y))*Factor)*256*256 // Red
+Round(Sqrt(Sqr(X)+Sqr(Y))*Factor)*256 // Green
+Round(Sqrt(Sqr(X)+Sqr(Y))*Factor); // Blue
end;
end;
end;
[/code]
Another way of doing this, is to use a TImage and a pre-made bitmap. If it needs to be resized, use the Stretch property. I'm guessing windows itself uses this method.
• Member Posts: 106
Thanks for the grate example, but unfortunately I am not quite sure I understand the code

How do I change the starting and the ending color for instance?
• Member Posts: 6,349
: Thanks for the grate example, but unfortunately I am not quite sure I understand the code
:
: How do I change the starting and the ending color for instance?
:
A color is coded in the following way:
1st byte: Windows code or 0 for a RGB color
2nd byte: Red intensity
3rd Byte: Green intensity
4rd Byte: Blue intensity
Once you know this and you are familiar with the addition of colors used in optics, you can easily determine the value of each byte to get a certain color.
Here is a simple example. Suppose you want a gradient of light-blue to black. You can see that the code for light blue is \$000000FF and black is \$00000000. All you need to do now is to subtract a certain amount from the color per pixel, which is nothing more than some integer mathematics. In code (part of my previous post):
[code]
for x := 0 to Width - 1 do begin
Pen.Color :=
0*256*256 // Red
+0*256 // Green
+Round(X*Factor); // increase Blue
MoveTo(X,0);
LineTo(X,Height-1);
end;
[/code]
This way you can also create a gradient from red or green to black.

It becomes harder if you want to create a gradient from Green to Blue. Here you need to subtract from green while simultaneously adding to blue.
[code]
for x := 0 to Width - 1 do begin
Pen.Color :=
0*256*256 // Red
+Round(X*Factor)*256 // increase Green
+255-Round(X*Factor); // decrease Blue
MoveTo(X,0);
LineTo(X,Height-1);
end;
[/code]
This way you can also gradient from Red to Green, or Red to Blue. The code above also demonstrates how to flip a gradient. If you leave out the green in the code above, it will show the blue above gradient but flipped.

I hope this helps you create the effect you wish for. Just play around with changing the various combinations of adding and subtracting colors and see what happens. It might produce some weird colors if one of the intensities falls below 0.
• USAMember Posts: 0

__ ( http://forcoder.org ) free video tutorials and ebooks about // Go, Visual Basic, Scratch, C#, Python, Objective-C, PHP, C++, Delphi, Assembly, MATLAB, Perl, Visual Basic .NET, JavaScript, R, C, Ruby, Java, Swift, PL/SQL ML, Prolog, FoxPro, Rust, Erlang, Scheme, Logo, LabVIEW, D, Awk, Ada, Dart, Clojure, F#, Julia, Alice, Fortran, ABAP, Transact-SQL, Lua, SAS, Bash, Kotlin, COBOL, VBScript, Hack, Crystal, Scala, Lisp, Apex //