Skip to content

TStyledButton

Carlo Barazzetta edited this page Oct 8, 2023 · 9 revisions

Description of Styled Buttons (TStyledGraphicButton and TStyledButton)

TStyledGraphicButton, TStyledButton are designed to expand Button UI styles to break the limits of classic TButton, TBitBtn and TSpeedButton provided in Delphi.

The Button Styles defined are not affected by VCLStyles and are also visibile on a "non styled" Windows application, so you can have more than a single Button styled also using VCLStyles. You can build rectangular or rounded or ellipsis/circle button as you prefer.

using only three elements you can setup your Button in a very simple way:

Component editor for TStyledGraphicButton and StyledButton:

  • StyleFamily: the main attribute for Styled Button
  • StyleClass: a collection of predefined button style
  • Style Appearance: eg.Normal or Outline

To simplify use of the Styled Buttons, there is a useful "Component Editor" to select three values that defines Button Style:

List of available StyleFamily

In this picture the Component Editor to select "Boostrap" styles: Style Appearance are Normal and Outline

StyledButtonComponentEditorBootstrap.jpg

In this picture, the Component Editor to select "AngularUI" styles: Style Appearance are Flat, Raised, Basic, Stroked

StyledButtonComponentEditorAngular.jpg

In this picture, the Component Editor to select "Classic" styles: Style Appearance are Normal and Outline

StyledButtonComponentEditor.jpg

In this picture, the Component Editor to select "SVG-Color" styles: Style Appearance are Normal and Outline

StyledButtonComponentEditorSVG.jpg

Look at the Demo Folder:

Demos\Delphi10_3+\StyledButtonsDemo

A simple demo to show the use of Buttons in many different ways...

StyledButtonDemoBootstrap.jpg

In the demo you can test many different ways to obtain Styled Button, Icon, FAB...

StyledButtonDemoAngular.jpg

Demos\Delphi10_4+\StyledButtonInControlList

A simple demo to show how to use StyledGraphicButton into a ControlList (only for D10.4+)

StyledButtonInControlListDemo.jpg

Return to Home...

Clone this wiki locally