BS PanelTrans - transforms panel to button, groupbox, checkbox, and radiobutton

[Xenno]

Hello,

I'm pleased to share a helper unit designed to transform a TPanel into a functional component that mimics a button, groupbox, checkbox, or radiobutton.

I created this primarily to enable customized styling, especially for color and font, beyond the standard controls. The resulting "fake" button supports TAction, Default and Cancel properties.

You can explore a full demonstration in the attached demo. I only test it in Windows. Please, inform if it works in other environment.

I welcome your comments and suggestions.


Cheers,

[Handoko]

Nice!
It works on Linux too.

Thank you for sharing it.

[Xenno]

Nice!
It works on Linux too.

Thank you for sharing it.

Terima kasih kembali, Mas Handoko. The screenshot means a lot.

[Xenno]

Hello everyone,

I'm pleased to share BS PanelTrans, now at version 1.1!

This helper unit is designed to overcome the styling limitations of standard VCL/LCL controls in Lazarus and Delphi applications. (For those who saw the initial v1.0 post, this is the updated release!)

The core idea is to transform a simple TPanel into a functional UI element that behaves like a Group Box, Check Box, Radio Button, or a regular Button.

The main intention behind this unit is to allow complete customization of color and font, which is often unavailable in standard controls. This makes it perfect for implementing custom color themes in your applications!

Note: The classes created by this unit must be freed manually, usually in the form's OnDestroy event.

The Ancestor Class: TBSPanelTrans

This is the base class for all transformations and provides the core functionality. It utilizes a TPanel and a TLabel (which can be created internally if needed). You should not use this class directly in your application.

Initial property values are derived from the panel being transformed.

Property	Description
Caption	The text displayed on the control.
Enabled, Visible	The control's operational and visibility state.
Font, ParentFont	Font property and the state to use the parent's font.
ParentColor	State to use the parent's color.
Hint, ShowHint	The control's hint text and whether to display it.

Transforming to a Button: TBSPanelAsButton

This class transforms the panel into a regular or speed button. It internally manages a TShape, a TButton (for functionality), and a TTimer (for periodic state updates).

A key feature is its ability to be assigned a TAction, with its properties being monitored and reflected in the button's appearance via the timer.

Styling & Action Properties

• Colors: Color, HoverColor, ClickColor, DownColor, and BorderColor.
• Border: BorderOnHover (determines if the border is shown only on hover or always).
• Behavior: Default (activated by Enter), Cancel (activated by ESC), and Down state.
• Action/Result: Action (assigns a TCustomAction) and ModalResult.
• Glyph/Image: Images (for TImageList support) and ImageIndex or Picture (for direct image assignment).
• Display: ShowCaption (to hide/show the caption text) and RoundCorners (round corners or not).

Methods & Events

• Invalidate: Refreshes the button's appearance.
• PrcSetupColors: Assigns color values, useful for setting light or dark schemes.
• Click: Programmatically simulates a button click.
• Event: OnClick (TNotifyEvent) is provided.

Transforming to Containers and Selectors

1. Group Box: TBSPanelAsGroupBox

This class internally creates a TShape to draw the distinctive border around the panel area.

• Properties: BorderColor and RoundCorners.
• Method: Invalidate (refreshes the group box appearance).

2. Check Box: TBSPanelAsCheckbox

This produces a check box control by internally creating and managing a TCheckBox component.

• Property: Checked (Set or get the checked state).
• Event: OnClick

3. Radio Button: TBSPanelAsRadioButton

This produces a radio button control by internally creating and managing a TRadioButton component.

• Property: Checked (Set or get the checked state).
• Event: OnClick

Explore the Code

The attached demo contains the full helper unit, uBSPanelTrans. Please run the demo to see BS PanelTrans v1.1 in action and learn more about its implementation.

I hope this updated unit proves useful to the community! I would be grateful for any comments, suggestions, critique, or bug report you might have.


Cheers,

[Xenno]

Hello everyone,

I am proud to present BS PanelTrans v2.0. This is a major milestone for the unit, shifting focus from simple panel transformations to a comprehensive WinUI-inspired component suite for Lazarus and Delphi.

The goal of v2.0 is to provide a cohesive, modern aesthetic across all controls, ensuring that your applications look like native Windows 11/10 apps while remaining fully themeable.

• Added new classes TBSPanelAsEdit and TBSPanelAsMemo.
• Enhanced TBSPanelAsCheckBox and TBSPanelAsRadioButton.

Explore the Code and Demo

The v2.0 demo is included in the package. It showcases the new WinUI-style edits, memos, checkboxes, and radio buttons. Experience the focus-sensing bottom borders and the embedded button functionality firsthand. Please, inform how it performs especially on OSes other than Windows.

I’m excited to see what the community builds with these modern components. Your comments, critiques, and contribution are what drive the growth of this project!

Cheers!

[Antek]

Hello Xenno,
I downloaded 2.0 BS PanelTrans today.
I like the idea. (but I am not the person who can tell if this is technically nice or good)

When Windows is scaled other than 100% there are problems with alignment and/or anchors and image sizes.

Did no other testing by now. Just tried with 100 and 200% scaling.
Check attachment with 200% scaling

[Xenno]

When Windows is scaled other than 100% there are problems with alignment and/or anchors and image sizes.

Thank you, @Antek. Yes, it looks awful. I've never tested scaling. Thank you very much for pointing me that. I will be working on it.

EDIT:
@Antek, did you change scaling before running the demo or when the demo is running?

[Antek]

@Xenno
I changed scaling to 200% and then started the prog.

[Xenno]

Great. Thanks. I was relying Lazarus built-in automatic scaling (TForm.Scaled). Your test proves High DPI issue of this helper class suite. Unfornately I only have a standard computer (96 dpi).

For now, I can say, those small boxes are internal TButtons that supposed to be out of sight. It is solved.
The glyphs/images position are TImages size issues. I am still looking at the code.

[Xenno]

Fixes have been applied as seen on the attachments. I tested on 100% and 125% scaling. Hopefully it would survive in 200% or other. TForm.Scale works very good. I really don't need to do anything except calling Invalidate on correct places.

I also add TBSPanelAsComboBox class; thanks for discussion on the separate thread.

[Antek]

@Xenno,
my dev machine (laptop 2560x1440 @ 17.1inch) is also running with 100% scaling( 96ppi/dpi) .

But I'm also using a tablet (surface go 3) with 1920*1200 pix @ 10.1 inch. At on this device it is not possible to work with 100% scaling.  So for my progs I always do some test on that device because of low performance and high dpi.

When I test new components, I (try to) compile on my dev machine @96dpi. Directly afterwards I change windows scaling to a (really) high value like 200% and execute the compiled exe to check how components behave.

Afterwards I do tests on the tablet.

Please check also the radio buttons ( The dot is moving downwards inside corcle at higher scaling)

I really want to support you with this issues. Because that way I might get more understanding of components development.

How are you doing debugging/developing this component? 
Feel free to send me private message to not "waste" this thread. I'll try to help as much as I can.

By the way: the V2.1 of the project was not attached in last post.

Best



 

[Xenno]

When I test new components, I (try to) compile on my dev machine @96dpi. Directly afterwards I change windows scaling to a (really) high value like 200% and execute the compiled exe to check how components behave.

I really don't have high dpi devices. I only have old laptop max res 1366 x 768. Low spec with 4 GB RAM. The issues you've encountered was purely my bug. Surprisingly not related to scaling. For now, I assume if it survives in 125%, I really hope it will in any scaling. If not, you can fine tune the code.

Please check also the radio buttons ( The dot is moving downwards inside corcle at higher scaling)

That's the trick in presenting WinUI look. I use plain unicode characters I got from Windows's Character Map app. The best "dot" is #$E1F5. Indeed it requires accurate positioning. I skip this perfection for later. You'll find it in code.

I really want to support you with this issues. Because that way I might get more understanding of components development.
Feel free to send me private message to not "waste" this thread. I'll try to help as much as I can.

BS PanelTrans is only a helper unit containing classes. But, the classes surely can be adapted to be components. There are plenty Lazarus (and Delphi) literatures for component development. I don't create components. I am more into writing applications. I just like making use of out-of-the-box components or libraries. I really appreciate your offer. Thank you in advance. Let's explore together with everyone in here, too.

By the way: the V2.1 of the project was not attached in last post.

You are right. I did not forgot. I didn't attach it cause I don't want to embarrass myself again. Besides, I am adding a new class with TSpinEdit behaviour. After that, I'd have enough bullets for my apps and share them here.

Thanks,

[Xenno]

Hello everyone,

I'm pleased to share BS PanelTrans 2.1.

This helper unit transforms panels to: Button, BitBtn, CheckBox, ComboBox, Edit, GroupBox, Memo, RadioButton, SpinEdit, SpinEditFloat, and Toolbar. Run the demo to see how they look and perform.

I look forward to your comments, suggestions, and critiques! TIA


Cheers!

[Xenno]

Sorry, reattach the correct ZIP.

[Xenno]

Usage screenshots in a software published in Microsoft Store.
Go Custom!

Cheers,