Difference between revisions of "BGRAControls"

From Lazarus wiki
Jump to navigationJump to search
m (→‎Install: Added browse and git)
 
(51 intermediate revisions by 14 users not shown)
Line 1: Line 1:
 
{{BGRAControls}}
 
{{BGRAControls}}
 +
 +
[[File:bgracontrols.png]]
  
 
== Install ==
 
== Install ==
  
−
You can use TortoiseSVN to download the svn repository and TortoiseGIT to download the git repository.
+
Use the [[Online Package Manager]] to get BGRABitmap and BGRAControls.
  
−
We're using BGRABitmap SVN to develop BGRAControls. Important changes in BGRABitmap can stop working BGRAControls.
+
Notice that you must check only the packages "bgrabitmappack.lpk" and "bgracontrols.lpk" in the Online Package Manager. The other packages are optional and may need third party packages / libraries to work (OpenGL and PascalScript).
  
−
'''1) Download BGRABitmap'''
+
=== Optional Components ===
  
−
'''Release:''' https://sourceforge.net/projects/lazpaint/files/src/
+
Since v4.4 the components TBCDefaultThemeManager, TBCKeyboard and TBCNumericKeyboard are not installed by default to allow Linux users to get a seamless installation with the Online Package Manager not installing third party stuff. If you want these components turn on the "Register unit" in the package options for each file (bcdefaulthememanager.pas, bckeyboard.pas, bcnumerickeyboard.pas) then compile and rebuild Lazarus. On Linux you need to install libxtst-dev and libgl-dev first.
  
−
'''Latest SVN:''' svn co https://lazpaint.svn.sourceforge.net/svnroot/lazpaint lazpaint
+
=== Website ===
  
−
Install BGRABitmap with the file bgrabitmap.lpk
+
BGRABitmap Organization on GitHub: https://github.com/bgrabitmap/
  
−
'''2) Download BGRAControls'''
+
== BGRA Controls ==
  
−
'''Release:''' https://sourceforge.net/projects/bgracontrols/files/
+
BGRA Controls is a set of graphical UI elements that you can use with Lazarus LCL applications.
 +
Under Linux you need to have installed libxtst-dev and libgl-dev.
  
−
''SVN''
+
=== TBCButton ===
  
−
'''SVN Browse:''' http://bgracontrols.svn.sourceforge.net/viewvc/bgracontrols/
+
[[Image:bcbutton.png]]
  
−
'''SVN Checkout:''' svn co https://bgracontrols.svn.sourceforge.net/svnroot/bgracontrols bgracontrols
+
A button control that can be styled through properties for each state like StateClicked, StateHover, StateNormal with settings like gradients, border and text with shadows. You can assign an already made style through the property AssignStyle.
  
−
''GIT''
+
=== TBCButtonFocus ===
  
−
'''GIT Browse:''' http://bgracontrols.git.sourceforge.net/git/gitweb-index.cgi
+
Like TBCButton but it supports focus like normal TButton.
  
−
'''GIT Checkout:''' git://bgracontrols.git.sourceforge.net/gitroot/bgracontrols/bgracontrols
+
=== TBCGameGrid ===
  
−
Install BGRAControls with the file bgracontrols.lpk
+
[[Image:bcgamegrid.png]]
  
−
== Overview ==
+
A grid with custom width and height of items and any number of horizontal and vertical cells that can be drawn with BGRABitmap directly with the OnRenderControl event.
  
−
'''Authors:'''
+
=== TBCImageButton ===
  
−
Dibo (package founder and maintainer, author: ''TBGRAImageList'', ''TBGRASpeedButton'', ''TBGRAButton'', ''TBGRAPanel'')
+
[[Image:samplebgraimagebutton.png]]
  
−
Lainz (package maintainer, author: ''TBGRAImageButton'', ''TBGRAImageToggleBox'', ''TBGRASpriteAnimation'', ''TBGRALabelFX'', ''TBGRAWin7ToolBar'')
+
[[Image:samplebgraimagebuttonalpha.png]]
  
−
Circular (package maintainer, author: ''TBGRAKnob'', ''TBGRAFlashProgressBar'', ''TBGRAVirtualScreen'', ''TBGRAShape'', ''TBGRAGraphicControl'')
+
A button control that can be styled with one image file, containing the drawing for each state Normal, Hovered, Active and Disabled. It supports 9-slice scaling feature. It supports a nice fading animation that can be turned on.
  
−
Emerson Cavalcanti (author: ''TBGRAImageManipulation'')
+
=== TBCXButton ===
  
−
codedeep (author: ''TBGRALabel'')
+
[[Image:bcxbutton.png]]
  
−
'''License:''' Modified LGPL.
+
A button control that can be styled by code with the OnRenderControl event. Or even better create your own child control inheriting from this class.
  
−
As many people know, Lazarus GTK doesn't have full alpha support. I created a set of components which use TBGRABitmap for drawing icons, so it partially solves the problem with alpha in GTK. But this components set is not only a GTK patch but has more fancy components which are using the power of the BGRABitmap package.
+
=== TBCLabel ===
  
−
'''Screenshots:''' Some shots of the project 'testbgracontrols'.
+
[[Image:bclabel.png]]
  
−
[[Image:testbgrac1.png]]
+
A label control that can be styled through properties, it supports shadow, custom borders and background.
  
−
''testbgracontrols > Main.''
+
=== TBCMaterialDesignButton ===
  
−
[[Image:testbgrac2.png]]
+
A button control that has an animation effect according to Google Material Design guidelines. It supports custom color for background and for the circle animation, also you can customize the shadow.
  
−
''testbgracontrols > Windows 7 ToolBar.''
+
=== TBCPanel ===
  
−
[[Image:testbgrac4.png]]
+
[[Image:bcpanel.png]]
  
−
''testbgracontrols > Ribbon.''
+
A panel control that can be styled through properties. You can assign an already made style through the property AssignStyle.
  
−
== Related Articles ==
+
=== TBCRadialProgressBar ===
  
−
[[BGRAButton Gallery]] - Gallery of buttons with source code to use in your projects with BGRAButton.
+
A progress bar with radial style. You can set the color and text properties as you like.
  
−
[[BGRASpriteAnimation]] - Usage of the sprite animation component.
+
=== TBCToolBar ===
  
−
[[uE_Controls]] - Other controls developed with BGRABitmap.
+
A TToolBar with an event OnRedraw to paint it using BGRABitmap. It supports also the default OnPaintButton to customize the buttons drawing. By default it comes with a Windows 7 like explorer toolbar style.
  
−
[[BGRABitmap]] - The library used to create this controls.
+
=== TBCTrackBarUpdown ===
  
−
[[LazPaint]] - A paint program developed with Lazarus and BGRABitmap.
+
A control to input numeric values with works like a trackbar and a spinedit both in one control.
  
−
== Using ==
+
=== TBGRAFlashProgressBar ===
  
−
Drop and use like normal component.
+
[[Image:BC-Bgraflashprogressbar.png]]
  
−
'''Button''':
+
A progress bar with a default style inspired in the old Flash Player Setup for Windows progress dialog. You can change the color property to have different styles and also you can use the event OnRedraw to paint custom styles on it like text or override the entire default drawing.
−
* TBGRAButton
 
−
* TBGRAImageButton
 
−
* TBGRAImageToggleBox
 
−
* TBGRASpeedButton
 
  
−
'''Label'''
+
=== TBGRAGraphicControl ===
−
* TBGRALabel
 
−
* TBGRALabelFX
 
  
−
'''Panel'''
+
Is like a paintbox. You can draw with transparency with this control using the OnRedraw event.
−
* TBGRAPanel
 
−
* TBGRAVirtualScreen
 
  
−
'''Image'''
+
=== TBGRAImageList ===
−
* TBGRAGraphicControl
 
−
* TBGRAImageList
 
−
* TBGRAImageManipulation
 
−
* TBGRASpriteAnimation
 
  
−
'''Other'''
+
An image list that supports alpha in all supported platforms.
−
* TBGRAFlashProgressBar
 
−
* TBGRAKnob
 
−
* TBGRAShape
 
−
* TBGRAWin7ToolBar
 
  
−
== TBGRAImageList ==
+
How app looks with TImageList (with transparent icons):
−
 
 
−
'''Use as replace of:''' TImageList
 
−
 
 
−
'''Before:'''
 
  
 
[[Image:before-TImageList.png]]
 
[[Image:before-TImageList.png]]
  
−
'''After:'''
+
How app looks with BGRAImageList:
  
 
[[Image:after-TBGRAImageList.png]]
 
[[Image:after-TBGRAImageList.png]]
  
−
Component which inherits from TImageList. So each control (tested on TToolBar and TTreeView) which is using TImageList.Draw method for drawing icons, automatically can have alpha support. Just use this component instead of TImageList. This component has been written for enabling GTK alpha, so on Windows (and other interfaces) it works just like normal TImageList (it doesn't use BGRABitmap for drawing)
+
=== TBGRASVGImageList ===
  
−
== TBGRASpeedButton ==
+
It is located in the BGRA Themes tab.
  
−
'''Use as replace of:''' TSpeedButton
+
[[Image:bgrasvgimagelist_edit.png|450px]]
  
−
[[Image:BGRASpeedButton.png]]
+
In its properties, one can define the size and a target raster image list (TImageList or TBGRAImageList):
  
−
Component which inherits from TSpeedButton and draws the glyph using TBGRABitmap. This component has been written for enabling GTK alpha, so on Windows (and other interfaces) it works just like normal TImageList (it doesn't use BGRABitmap for drawing)
+
[[Image:bgrasvgimagelist_prop.png|350px]]
  
−
== TBGRAButton ==
+
This will automatically populate the target image list (here on MacOS, it provides the double sized icons for Retina):
  
−
'''Use as replace of:''' TButton
+
[[Image:targetimagelist_edit.png|350px]]
  
−
[[Image:bgrabutton.png]]
+
=== TBGRAImageManipulation ===
  
−
Customizable graphic component which is using only BGRABitmap functions for drawing. This component is insensitive for -dGTK_ONLY switch. Demo project included in package.
+
[[Image:bgraimagemanipulation.jpg]]
−
 
 
−
'''Functionality:'''
 
−
* Gradient, Clear or Color body. [[Double_Gradient]].
 
−
* Text with shadow: BGRA antialias or like system default with ClearType.
 
−
* Rounded border, inner Light.
 
−
* States: normal, hover & clicked fully customizable and grayscale disabled state.
 
−
* Special: Down, DropDown, Static.
 
−
* Full AutoSize working with Glyph.
 
−
 
 
−
== TBGRAPanel ==
 
  
−
'''Use as replace of:''' TPanel
+
A tool to manipulate pictures, see the demo that shows all the capability that comes with it.
  
−
Simple TPanel descendant which can have gradient background. Created especially for TBGRAButton (for creating a nice looking toolbar for bgrabuttons). This component is insensitive for -dGTK_ONLY switch
+
=== TBGRAKnob ===
  
−
== TBGRAKnob ==
 
 
[[Image:BC-Bgraknob.png]]
 
[[Image:BC-Bgraknob.png]]
  
−
Graphic knob component created by circular.
+
A knob that can be styled through properties.
  
−
== TBGRAFlashProgressBar ==
+
=== TBGRAResizeSpeedButton ===
  
−
'''Use as replace of:''' TProgressBar
+
A speed button that can resize the glyph to fit in the entire control.
  
−
[[Image:BC-Bgraflashprogressbar.png]]
+
=== TBGRAShape ===
  
−
Flash progressbar created by circular.
+
[[Image:samplebgrashape.png]]
  
−
== TBGRAImageManipulation ==
+
A control with configurable shapes like polygon and ellipse that can be filled with gradients and can have custom borders and many other visual settings.
  
−
'''Use as replace of:''' TImage
+
=== TBGRASpeedButton ===
  
−
Component to facilitate the importation of images in an application.
+
[[Image:BGRASpeedButton.png]]
  
−
In the current version you can import an image and cut out keeping the aspect ratio (or not). For example, if you want to import photos using the 3x4 ratio, adjust the 'ratio' property to 3:4. If import an image with different size, the component will ensure that the image meets the proportions of the desired dimensions.
+
A speed button that in GTK and GTK2 provides BGRABitmap powered transparency to the glyph.
  
−
You can determine the minimum size of the image adjusting the properties 'MinWidth'and 'MinHeight'.
+
=== TBGRASpriteAnimation ===
  
−
You can rotate the image using functions builtin.
+
[[Image:bgraspriteanimation.png]]
  
−
See demo of component:
+
A component that can be used as image viewer or animation viewer, supports the loading of gif files.
  
−
[[Image:bgraimagemanipulation.jpg]]
+
=== TBGRAVirtualScreen ===
  
−
After retrieving the image modified by the component, just put the image into your destination using the stretch. It is obvious that the target must have the same ratio chosen on component for do not distort the final result.
+
Is like a panel. You can draw this control using the OnRedraw event.
  
−
== TBGRAImageButton ==
+
=== TDTAnalogClock ===
  
−
If you need some code to load and split an image from file, and then scale the borders like in this control you can download bitmapthemeutils:
+
A clock.
−
* https://sourceforge.net/projects/bmpthemeutils/
 
  
−
'''Use as replace of:''' TButton
+
=== TDTAnalogGauge ===
  
−
[[Image:bgraimagebutton.png]]
+
A gauge.
  
−
Component used to create a button with 4 states from Bitmap.
+
=== TDTThemedClock ===
  
−
'''Features:'''
+
Another clock.
−
* Load the image from the "Bitmap" property in the object inspector or load from file using "BitmapFile".
 
  
−
  // You can load bmp and also png files
+
=== TDTThemedGauge ===
−
  BGRAImageButton1.BitmapLoadFromFile(BGRAImageButton1.BitmapFile);
 
  
−
* BitmapOptions: you can set the border pixels, resample method and fill modes. Usefull to create textured / like Windows themed buttons.
+
Another gauge.
−
* AutoSize, ModalResult.
 
−
* Text with Shadow, you can disable text render with the option "TextVisible".
 
−
* Sound: in mouse enter and leave in Windows from .wav files.
 
−
* Toggle: you can read / set the current state with the property "Checked".
 
−
* Animation: glowing effect.
 
  
−
'''Usage:'''
+
=== TPSImport_BGRAPascalScript ===
  
−
The bitmap must contain 4 states (from top to bottom, with the same Height) in the following order: normal, enter, pressed, disabled.
+
A component to load BGRABitmap pascal script utilities.
  
−
If you choose to use BitmapOptions you need to have for each state an image which has a border, and inside some content that can be repeated. Then with FillCenter option (if you want a textured button), it gets repeated while the borders stay as they are. This is like the method used in Windows to theme the buttons.
+
== BGRA Custom Drawn ==
  
−
''Example Button:''
+
BGRA Custom Drawn is a set of controls inherited from Custom Drawn. These come with a default dark style that is like Photoshop.
  
−
[[Image:samplebgraimagebutton.png]]
+
=== TBCDButton ===
  
−
''Example Button (with Alpha):''
+
A button control that is styled with TBGRADrawer.
  
−
[[Image:samplebgraimagebuttonalpha.png]]
+
=== TBCDEdit ===
  
−
== TBGRAVirtualScreen ==
+
An edit control that is styled with TBGRADrawer.
  
−
'''Use as replace of:''' TPanel
+
=== TBCDStaticText ===
  
−
The principle is to draw on a memory bitmap.
+
A label control that is styled with TBGRADrawer.
  
−
The component has a specific event, OnRedraw, which is called when the whole bitmap needs to be redrawn. It happens at the beginning, when resizing and when the Redraw method is called.
+
=== TBCDProgressBar ===
  
−
Otherwise, it is possible to modify the Bitmap property and call Invalidate or Repaint, to avoid erasing the whole bitmap content.
+
A progress bar control that is styled with TBGRADrawer.
  
−
== TBGRAShape ==
+
=== TBCDSpinEdit ===
  
−
'''Use as replace of:''' TShape
+
A spin edit control that is styled with TBGRADrawer.
  
−
[[Image:samplebgrashape.png]]
+
=== TBCDCheckBox ===
  
−
The component has full alpha support and you can put the number of polygons you want with rounded borders & gradients (linear, radial, diamond, reflected).
+
A check box control that is styled with TBGRADrawer.
  
−
== TBGRAImageToggleBox ==
+
=== TBCRadioButton ===
  
−
REMOVED IN VER 1.1.0.7.
+
A radio button that is styled with TBGRADrawer.
  
−
'''Use as replace of:''' TToggleBox
+
== Sample code ==
  
−
Component used to create a toggle box from Bitmap.
+
BGRA Controls comes with nice demos to show how to use the stuff and extra things you can use in your own projects.
  
−
The bitmap must contain 8 images (from top to bottom, with the same Height) in the following order: unchecked normal, unchecked enter, unchecked pressed, unchecked disabled for Unchecked state and checked normal, checked enter, checked pressed, checked disabled for Normal state.
+
=== Pascal Script Library ===
  
−
''Example toggle box:''
+
Putting BGRABitmap methods into a .dll with c#, java and pascal headers.
  
−
[[Image:sampletogglebox.png]]
+
=== BGRA Ribbon Custom ===
  
−
== TBGRAGraphicControl ==
+
How to create a fully themed window using the controls to achieve a Ribbon like application.
  
−
'''Use as replace of:''' TPaintBox
+
=== Tests ===
  
−
TBGRAGraphicControl, which allows to draw your component by yourself with alpha blending.
+
There are test for analog controls (clock and gauge), BC prefixed controls, BGRA prefixed controls, BGRA Custom Drawn controls, how to use Pascal Script and BGRABitmap, bgrascript or how to create your own scripting solution with BGRABitmap.
  
−
== TBGRASpriteAnimation ==
+
=== Tests Extra ===
  
−
'''Use as replace of:''' TImage
+
[[Image:game_maze.png]]
  
−
Read more in the article [[BGRASpriteAnimation]].
+
[[Image:game_puzzle.png]]
  
−
[[Image:bgraspriteanimation.png]]
+
[[Image:customdrawnwindows7.png]]
  
−
With this you can do animations from bitmap. You need an image with all the frames layout in in a horizontal position.
+
[[File:slicescaledtachart.png]]
  
−
It has the ability to specify how many times the animation should be played (0 for infinite, 1, 2, etc) and static to stop the animation, is capable to specify the speed and direction and support transparency.
+
These are extra tests like how to use fading effect, an fpGUI theme, games like maze and puzzle, how we created the material design animation, pix2svg or how to convert a small picture to svg using hexagons, rectangles and ellipses, plugins or how to load .dlls and use into a TBGRAVirtualScreen, rain effect, shadow effect, 9-slice-scaling with Custom Drawn or how to theme with bitmaps an application to look like Windows themes and 9-slice-scaling with charts.
  
−
Features:
+
== Other units ==
−
* Animation: invert, position, lap, speed, static, repeat.
 
−
* Sprite: fill opacity (global transparency), flip mode (horizontal, vertical, both), key color (transparent color), resample (normal or fine resample modes). AutoSize.
 
−
* AnimatedGifToSprite: convert an animated gif to a BGRABitmap sprite.
 
  
−
== TBGRALabel ==
+
These units come with BGRA Controls and contains more functionality that is sometimes used with the controls, sometimes not but are usefull in some way. Some are listed here, others you can see linked directly with any control like bcrtti, bcstylesform, bctools and bctypes.
  
−
'''Use as replace of:''' TLabel
+
=== BCEffect ===
  
−
Label component based on TBGRAButton.
+
Fading effect with BGRABitmap.
  
−
Features:
+
=== BCFilters ===
−
* Caption with shadow or not
 
−
* Full alpha and antialias support or not
 
−
* WordWarp or not
 
−
* Caption with Property Editor Multiline
 
  
−
== TBGRALabelFX ==
+
A set of pixel filters to use with BGRABitmap.
  
−
'''Use as replace of:''' TLabel
+
=== BGRAScript ===
  
−
[[Image:bgralabelfx.png]]
+
Scripting with BGRABitmap, see test project.
  
−
Features:
+
== Related Articles ==
−
* Outline
 
−
* Shadow
 
  
−
ToDo:
+
[[BGRASpriteAnimation]] - Usage of the sprite animation component.
−
* Use BGRATextFX multicolor, textures.
 
−
* etc.
 
  
−
== TBGRAWin7ToolBar ==
+
[[uE_Controls]] - Other controls developed with BGRABitmap.
  
−
[[Image:bgrawin7toolbar.png]]
+
[[BGRABitmap]] - The library used to create this controls.
  
−
Is a TBGRAVirtualScreen descendant with some default child sizing, and nice Win7 ToolBar background.
+
[[LazPaint]] - A paint program developed with Lazarus and BGRABitmap.
−
 
 
−
== BGRASamples unit ==
 
−
 
 
−
This unit has sample drawings, styles for buttons and colors used in different UI.
 
−
 
 
−
[[Image:ioselements.png]]
 
−
 
 
−
* '''Accent Color:''' the colors used in the Windows Phone. The accent color can be used in TBGRAButton and TBGRAImageButton (see the different procedures).
 
−
* '''Facebook button color:''' gray, green and blue, with a procedure to create an image in the normal or pressed state, also to use this style in a TBGRAImageButton.
 
−
* '''TBGRASampleStyle:''' Styles for TBGRAButton ('Default', 'Flash Player', 'Windows 7 ToolBar', 'Windows 7 ToolBar Smooth', 'Windows 7', 'Office 2010', 'Mac OSX Lion', 'Windows 7 Cristal').
 
−
* '''iOS Elements:''' Draw a gray bar, the blue toolbar and a tiled background, the same elements used in the iOS screen.
 
−
* '''Glass:''' used in testbgracontrols, it show an image in a virtualscreen and apply blur in the buttons area.
 
−
* '''Drawings:''' flash player body and toolbar, windows 7 toolbar.
 
−
 
 
−
* Some other usefull procedures to work with TBGRAButton and TBGRAImageButton.
 
  
 
[[Category:Components]]
 
[[Category:Components]]
 +
[[Category:Graphics]]
 +
[[Category:BGRAControls]]

Latest revision as of 21:27, 13 August 2023

│ Deutsch (de) │ English (en) │ português (pt) │ русский (ru) │ 中文（中国大陆）‎ (zh_CN) │

bgracontrols.png

Install

Use the Online Package Manager to get BGRABitmap and BGRAControls.

Notice that you must check only the packages "bgrabitmappack.lpk" and "bgracontrols.lpk" in the Online Package Manager. The other packages are optional and may need third party packages / libraries to work (OpenGL and PascalScript).

Optional Components

Since v4.4 the components TBCDefaultThemeManager, TBCKeyboard and TBCNumericKeyboard are not installed by default to allow Linux users to get a seamless installation with the Online Package Manager not installing third party stuff. If you want these components turn on the "Register unit" in the package options for each file (bcdefaulthememanager.pas, bckeyboard.pas, bcnumerickeyboard.pas) then compile and rebuild Lazarus. On Linux you need to install libxtst-dev and libgl-dev first.

Website

BGRABitmap Organization on GitHub: https://github.com/bgrabitmap/

BGRA Controls

BGRA Controls is a set of graphical UI elements that you can use with Lazarus LCL applications. Under Linux you need to have installed libxtst-dev and libgl-dev.

TBCButton

bcbutton.png

A button control that can be styled through properties for each state like StateClicked, StateHover, StateNormal with settings like gradients, border and text with shadows. You can assign an already made style through the property AssignStyle.

TBCButtonFocus

Like TBCButton but it supports focus like normal TButton.

TBCGameGrid

bcgamegrid.png

A grid with custom width and height of items and any number of horizontal and vertical cells that can be drawn with BGRABitmap directly with the OnRenderControl event.

TBCImageButton

samplebgraimagebutton.png

samplebgraimagebuttonalpha.png

A button control that can be styled with one image file, containing the drawing for each state Normal, Hovered, Active and Disabled. It supports 9-slice scaling feature. It supports a nice fading animation that can be turned on.

TBCXButton

bcxbutton.png

A button control that can be styled by code with the OnRenderControl event. Or even better create your own child control inheriting from this class.

TBCLabel

bclabel.png

A label control that can be styled through properties, it supports shadow, custom borders and background.

TBCMaterialDesignButton

A button control that has an animation effect according to Google Material Design guidelines. It supports custom color for background and for the circle animation, also you can customize the shadow.

TBCPanel

bcpanel.png

A panel control that can be styled through properties. You can assign an already made style through the property AssignStyle.

TBCRadialProgressBar

A progress bar with radial style. You can set the color and text properties as you like.

TBCToolBar

A TToolBar with an event OnRedraw to paint it using BGRABitmap. It supports also the default OnPaintButton to customize the buttons drawing. By default it comes with a Windows 7 like explorer toolbar style.

TBCTrackBarUpdown

A control to input numeric values with works like a trackbar and a spinedit both in one control.

TBGRAFlashProgressBar

BC-Bgraflashprogressbar.png

A progress bar with a default style inspired in the old Flash Player Setup for Windows progress dialog. You can change the color property to have different styles and also you can use the event OnRedraw to paint custom styles on it like text or override the entire default drawing.

TBGRAGraphicControl

Is like a paintbox. You can draw with transparency with this control using the OnRedraw event.

TBGRAImageList

An image list that supports alpha in all supported platforms.

How app looks with TImageList (with transparent icons):

before-TImageList.png

How app looks with BGRAImageList:

after-TBGRAImageList.png

TBGRASVGImageList

It is located in the BGRA Themes tab.

bgrasvgimagelist edit.png

In its properties, one can define the size and a target raster image list (TImageList or TBGRAImageList):

bgrasvgimagelist prop.png

This will automatically populate the target image list (here on MacOS, it provides the double sized icons for Retina):

targetimagelist edit.png

TBGRAImageManipulation

bgraimagemanipulation.jpg

A tool to manipulate pictures, see the demo that shows all the capability that comes with it.

TBGRAKnob

BC-Bgraknob.png

A knob that can be styled through properties.

TBGRAResizeSpeedButton

A speed button that can resize the glyph to fit in the entire control.

TBGRAShape

samplebgrashape.png

A control with configurable shapes like polygon and ellipse that can be filled with gradients and can have custom borders and many other visual settings.

TBGRASpeedButton

BGRASpeedButton.png

A speed button that in GTK and GTK2 provides BGRABitmap powered transparency to the glyph.

TBGRASpriteAnimation

bgraspriteanimation.png

A component that can be used as image viewer or animation viewer, supports the loading of gif files.

TBGRAVirtualScreen

Is like a panel. You can draw this control using the OnRedraw event.

TDTAnalogClock

A clock.

TDTAnalogGauge

A gauge.

TDTThemedClock

Another clock.

TDTThemedGauge

Another gauge.

TPSImport_BGRAPascalScript

A component to load BGRABitmap pascal script utilities.

BGRA Custom Drawn

BGRA Custom Drawn is a set of controls inherited from Custom Drawn. These come with a default dark style that is like Photoshop.

TBCDButton

A button control that is styled with TBGRADrawer.

TBCDEdit

An edit control that is styled with TBGRADrawer.

TBCDStaticText

A label control that is styled with TBGRADrawer.

TBCDProgressBar

A progress bar control that is styled with TBGRADrawer.

TBCDSpinEdit

A spin edit control that is styled with TBGRADrawer.

TBCDCheckBox

A check box control that is styled with TBGRADrawer.

TBCRadioButton

A radio button that is styled with TBGRADrawer.

Sample code

BGRA Controls comes with nice demos to show how to use the stuff and extra things you can use in your own projects.

Pascal Script Library

Putting BGRABitmap methods into a .dll with c#, java and pascal headers.

BGRA Ribbon Custom

How to create a fully themed window using the controls to achieve a Ribbon like application.

Tests

There are test for analog controls (clock and gauge), BC prefixed controls, BGRA prefixed controls, BGRA Custom Drawn controls, how to use Pascal Script and BGRABitmap, bgrascript or how to create your own scripting solution with BGRABitmap.

Tests Extra

game maze.png

game puzzle.png

customdrawnwindows7.png

slicescaledtachart.png

These are extra tests like how to use fading effect, an fpGUI theme, games like maze and puzzle, how we created the material design animation, pix2svg or how to convert a small picture to svg using hexagons, rectangles and ellipses, plugins or how to load .dlls and use into a TBGRAVirtualScreen, rain effect, shadow effect, 9-slice-scaling with Custom Drawn or how to theme with bitmaps an application to look like Windows themes and 9-slice-scaling with charts.

Other units

These units come with BGRA Controls and contains more functionality that is sometimes used with the controls, sometimes not but are usefull in some way. Some are listed here, others you can see linked directly with any control like bcrtti, bcstylesform, bctools and bctypes.

BCEffect

Fading effect with BGRABitmap.

BCFilters

A set of pixel filters to use with BGRABitmap.

BGRAScript

Scripting with BGRABitmap, see test project.

Related Articles

BGRASpriteAnimation - Usage of the sprite animation component.

uE_Controls - Other controls developed with BGRABitmap.

BGRABitmap - The library used to create this controls.

LazPaint - A paint program developed with Lazarus and BGRABitmap.

Retrieved from "http://wiki.freepascal.org/index.php?title=BGRAControls&oldid=157089"