February 22, 2014

HowTo: Create a DCR file for your Delphi component

When you create a component for Delphi, you need a bitmap to represent your component in the component palette. This bitmap must be saved as a DCR file and linked into the component package. DCR stands for Delphi Component Resource. It is a binary resource file (RES) renamed to DCR.

In the old days, Delphi was delivered with a simple image editor which let you draw your bitmap and create the DCR file. The last version which included that tool was Delphi 7 if memory serves me well.

Now, you have to use a "paint" program to build your bitmap. Any will do provided it is able to produce Windows bitmap file (BMP) with a 24x24 pixels image having 16 or 256 colors. Windows "Paint" is enough for that.

Then you must transform that bitmap into a DCR file which is easy using any "resource compiler" program. Delphi is delivered with one named BRCC32. A resource compiler produce a RES file.

A resource compiler takes a resource script as a source file (RC). This is a text file containing commands to describe the resource you want to build. There are many kind of resources that can be included in a resource file. Here we are only interested in a bitmap resource.

Assuming be are building a component whose class name is TDemoComponent and that the source code is in DemoComponent.pas, we need to create a DemoComponent.dcr resource file containing a bitmap resource named TDemoComponent. We thus need to create DemoComponent.bmp bitmap and DemoComponent.rc resource script.

TDemoComponent BITMAP "DemoComponent.bmp"

Then we run BRCC32 with the following command line:

brcc32 -fo"DemoComponent.dcr" "DemoComponent.rc"

The resulting file has to be included in the package source file (DPK) containing the component. This is done by adding a single line into the dpk:

{$R 'SimpleComponent.dcr'}

Usually you add this line right after the existing line

{$R *.res}

Summary of required files:

DemoComponent.pasComponent source codeYou create this with Delphi
DemoComponent.bmpComponent bitmapYou create this with Windows Paint
DemoComponent.rcResource scriptYou create this with NotePad
DemoComponent.dcrBinary resource fileYou use BRCC32 to create it

This works for VCL and FireMonkey components. Visual and non visual components.

It is likely that you want to automate the process. Easy! Just add the BRCC32 command shown above in your package project option. Add it to the "Build Events" for target "All configurations", "Pre-build events". That's it. Doing this way, your DCR file will be recreated at each build. This takes time but BRCC32 is blazing fast at compiling a so simple RC file. Whenever you change the bitmap, just recompile/install the package and the updated bitmap will be shown.

Follow me on Twitter
Follow me on LinkedIn
Follow me on Google+
Visit my website: http://www.overbyte.be
This article is available from http://francois-piette.blogspot.be


Anonymous said...

It used to be required that the resource name of the bitmap had to be in ALL CAPS. It has been a long time since I last had to create a component palette bitmap. Has that restriction been lifted in newer versions?

FPiette said...

Remy, this requirement has gone out of XE5 (at least).

jaenicke said...

Why do you suggest to use the command line resource compiler?

Better is to use the built-in compiler of Delphi, so you just write in the unit of the component:
{$R 'DemoComponent.dcr' 'DemoComponent.rc'}

So you only have to:
- create the image file
- in Delphi: File --> new --> other --> other files --> text file
(translated from German, could be a bit different)
- select resource script as type
- save beside the component's unit
- and add the line above to the component's unit

FPiette said...

Jaenicke, does it works for you? It doesn't for me with XE5 upd2.

Anonymous said...

Excellent works fine in XE7 :)

Geoff said...

Actually, the way you can do it is
- select the "Project" menu
- select "Resources and Images".
- Click the "Add" button in the dialog box.
- Select the file you want and click "ok".
- Set the Resource Identifier as the Component name.
- Click "OK".

I have done this in Delphi 10 Seattle, and from what I can see it is there in XE2. It is probably there in earlier versions as well!

Unknown said...

A little background info:
Fran├žois method works but that is not the method RAD Studio/Delphi is planned to use today.
The DCR was restricted to 256 color palette, that is if you want to compile a 24Bit image into your DCR you'll get an error “Invalid bitmap format”.
And usually when changing your components tools palette icon you do not see the change in the tools palette when you recompile your package. To see the new icons you have to uninstall the package, close the IDE and restart it and then install your components again. Now the new component icons are displayed.

The better way is to use the above (cf. Geoffs post) described method:
- Menu: Project/Resources and Images
- Click “Add” and select your image file (in this case) e.g. “Funny_Bunny.BMP”
- Set ResourceID like your component name e.g. “TMyComponent” (check the spelling of the ID, it should match the components class name)
- Click “Ok” or add further resources/images

Assume our test package was named “MyPackage”
In your “MyPackage.dpk”-file you will find a new entry.
To view the source of it:
select the package “MyPackage.bpl” in the object inspector,
then click right and select “display source code” in the popup menu,
you'll see something like this:

package MyPackage;
{$R *.res}
{$R *.dres}

The delphi resource (*.dres) was added to your package source code.

Keep in mind that you can select 3 different sizes for the icons in tools palette (when using the docked IDE modes - which is not very comfortable when you want to use the IDE with more than one monitor, here the classic undocked mode is more convenient).
However, it is suitable to design the component icons in 32x32 pixel @ 24Bit colour.
The RAD/Delphi IDE scales the icons pretty well.

Finally: The method herein was tested wit XE 10.1.

Anonymous said...

>>However, it is suitable to design the component icons in 32x32 pixel @ 24Bit colour.

I just tried this new method with Delphi XE4 and a bitmap as described above and it works fine! Much better than DCR capability.

Anonymous said...

I was getting mad trying to do this simple thing in Delphi 2010. No help found on Delphi Help file.

Thank you for the ideas given in this post for other versions of Delphi.

In Delphi 2010, you need to:
· Create a 24x24 pixels bitmap using Windows Paint i.ex. (I could create a 24-bits bitmap). Store it in any location of your package project.
· Activating package project, go to menu Project > Resources... Select this bitmap file, set type to Bitmap, Identifier as exactly the class name of your component (doesn't need to be in capitals). Click OK.
· You don't need to create any .rc file. Delphi 2010 will create/recreate it for you when building. Two files will be re-created every time you build: 'DemoPackage.dres' and 'DemoPackageResource.rc'.
· Add the following directive {$R 'DemoPackage.dres') to you component unit file (i.ex. "DemoComponent.pas"). Note that "DemoPackage.dres" might not yet exist till your first build after adding resources. No worries.
· Once you build 'DemoPackage.dres' and 'DemoPackageResource.rc' will be created and the {$R 'DemoPackage.dres'} directive will be used to determine correctly the bitmap icon for you component. You can now install the component and you should see the correct icon in the palete without needing to restart the IDE.