Recent

Author Topic: TWindowButton — immitation of the Windows 10 system buttons  (Read 2975 times)

furious programming

  • Hero Member
  • *****
  • Posts: 852
TWindowButton — immitation of the Windows 10 system buttons
« on: January 26, 2021, 12:44:32 am »
I am slowly approaching the end of the Richtris 2.0 implementation, the program I described here. Its main window is frameless, and thus also devoid of system buttons for minimizing, restoring and closing the window.

So I thought that I would program such buttons for myself, that is, I would write appropriate classes (in the form of a ~component) and create them dynamically in the form constructor. All because I didn't want to mess with packages and reinstall the environment to have them on the component palette and in the designer. A total of five — minimize, close and three for other needed purposes, all in the form of a cool, windows-like toolbar. These buttons are very simple — the three main states (normal, hot and pressed) can be simplified to three images, replaced in the corresponding events. Works for half an hour.

But… I came across to implement an animated transition effect, performed after hovering and removing the cursor — the same as for example in the explorer window. To combine images for the transition, I used my old snippet. Well, these animations were not as trivial to program as I thought at first… 8)

It was a bit of fun with the timer and frame counting so that during the animation the class could pause the transition in progress, reverse its direction and resume it, but in the end it could be done.

Anyway, I'm very happy with the end result. The source code for the control and the whole demo application are attached. The demo shows two windows, one with an imitation of a black theme and the other with an imitation of a light one. The button graphics are the same as in the system. In case someone wants to have this control on the palette, you have to move a few things to the published section, add something for the designer and check how it works in the designer. I don't use visual components in Richtris myself, because everything is rendered on the back buffer, so creating these buttons from the code is enough for me.

Sources are free to use, so have fun.


PS: Buttons do not have any action assigned to them when clicked, so to close the program you have to close the black form with Alt+F4. I did not program clicking these buttons to test their correct operation. And you can go ahead and click — the form will neither close nor minimize.

PPS: In case someone wants to check in slow motion and irritate a bit the button by hovering over and taking the cursor, use a bigger frames count (that is, WindowButton.Fade.Frames), for example, set it to 100. The animation will be very long, so it will be time to play.
« Last Edit: January 26, 2021, 07:14:23 pm by furious programming »
Lazarus 3.2 with FPC 3.2.2, Windows 10 — all 64-bit

Working solo on an acrade, action/adventure game in retro style (pixelart), programming the engine and shell from scratch, using Free Pascal and SDL. Release planned in 2026.

furious programming

  • Hero Member
  • *****
  • Posts: 852
Re: TWindowButton — immitation of the Windows 10 system buttons
« Reply #1 on: January 27, 2021, 05:28:48 pm »
One more demo program. This time the test of the timers — a hundred standard window buttons in the light window (these handles mouse events) and a hundred buttons in the dark window, that animates infinitely to see the full animation process (these do not handle mouse events).

Source with one bug fixed. When the FFadeFrame has the value of 0, the method combining two bitmaps just divide by 0, so it causes exception. So, one more condition was added and now everything is working fine.
Lazarus 3.2 with FPC 3.2.2, Windows 10 — all 64-bit

Working solo on an acrade, action/adventure game in retro style (pixelart), programming the engine and shell from scratch, using Free Pascal and SDL. Release planned in 2026.

 

TinyPortal © 2005-2018