What format are the images in the delphi IDE menu? - delphi

I'm adding a new entry to the main menu of the Delphi IDE (Delphi 2007) and a bmp image to the image list associated to the menu (without passing a mask as parameter)
IDEMainMenu.Images.Add(Image,nil);
but the image added is not shown with a transparent color , i tried using a 8 and 24 bits bmp and using fucsia as the background color but the ide always display the icon with the background. so the question is which is the color depth of the bmp images which i must use and the color of the backgrpund to make appear the image transparent in the delphi ide menu? or i need pass a mask bmp to the Images.Add function?

try using the icon format (.ico) instead, size 16x16 and 256 colors.
this is the code which I use, the MainMenu is the instance to the IDE menu item.
Image:=TIcon.Create;
try
Image.Handle := LoadIcon(hInstance, sLogo16);
ExplorerItem.ImageIndex:=MainMenu.Images.AddIcon(Image);
finally
Image.Free;
end;

Related

Delphi TBitMap transparency from ImageList to a button

I am trying to create a custom icon button with a transparent bitmap image, below the code.
The icon is stored in an ImageList connected to an ActionList.
bitmap := TBitmap.Create;
BmpObj := TMemoryStream.Create;
try
ImageList.GetBitmap(ActionList.Actions[i].ImageIndex, bitmap);
bitmap.Transparent := TRUE;
bitmap.TransparentColor := clWhite;
bitmap.Canvas.Brush.Color := clWhite;
bitmap.SaveToStream(BmpObj);
finally
BmpObj.Free;
bitmap.Free;
end;
I don't know what I am missing.. Anyone has an idea about this problem?
Without better knowledge about the components I asked about, I show the basic way of having transparent image on many Windows controls.
Take a TImageList and fill it with the images you want to use. The lower left pixel determines the transparent color. In my example black numbers are placed on white background.
On the button, set property Images to your ImageList and ImageIndex to a valid image number (0 .. ). The image will appear on the button, with the white colored areas transparent.
In the image below, I include a TImage with the bitmap so you can see the actual colors.
Note no code required.

Can I change skin colors without using bitmaps?

In Bitmap Style manager when I need to change form client area or borders I have to select it from the Bitmap property left click + right click then apply. But I want to ask is there a way to change colors from the Color property instead ? or everything must be bitmaps
i am using RAD 10.3.3
you can find on TForm properties.
on VCL
Color = $your color
on FMX
set Fill > Kind = Solid after that you can set color on Fill > color

How to save a TImage containing a TPngImage as Bitmap file?

In Delphi 10.4, I have loaded a PNG image (32BPP with Alpha Channel Transparency) at DESIGN-TIME in the Picture property of a TImage. Here is how it looks at run-time:
Here is a copy of the TImage component (which can be pasted at design-time in any Delphi VCL Application project):
object Image1: TImage
Left = 46
Top = 200
Width = 32
Height = 32
AutoSize = True
Center = True
Picture.Data = {
0954506E67496D61676589504E470D0A1A0A0000000D49484452000000200000
00200806000000737A7AF40000000473424954080808087C086488000006F749
44415478DAB557694C545714BE33C3BE8A0CEBB096224EA94241B16AACA68520
6DA1D1D485B00A1421DA0A36A9B64D9AFE68AA69A340451B4A41405903D6A5D4
0AB4285B59442236884C054640C080EC8475A6DF19670803B40C466F72F3DEBB
E7DC73BE77EED92EE78083195BB74A87310E872D1E52261E9D6409CD8FD9CB1A
9CD3EEF66C9B99E11800682FD62F9DBA3F34AE155CD9F212016C788500CCD2FB
12069002002FB8F2C1336658C9CCCC8C595B5B333E9FCF74747494D827262658
5F5F1FEBECEC64DDDDDD4C2291BC180011756DCCDDDD9DB9B8B8700C0D0DB781
F23EE69B988E98AB3149D300A608F32FCCC2D1D1D18AC6C646697D7D3D1B1F1F
7F7E001D1C4DDE9FF61BB8BABABA2158390E2B38AA625AA9544AE77672727232
A3ACAC4C72E7CE9DE703D06624E0D55B39D740F146B960311E7C7CEBE2FD1814
24C0D4126D6DED20ACA5606D06F4C778B791F3D7E211D4D2D2222A2C2C645353
532B03D0C2B7E5DDB35C2B81A04758F91CCF6A0827538FE15D909E9E3E3A3838
C8A2A3A3D53435351F81660E3C6E780AC1F32D9EB6E01BC6DC03BF28CECDCD55
02B12C0091B135EFAEA5300B020EE25C47F4F5F58F40681CBE33E16C41999999
32566F6F6FE6EAEA7A06B443A07D353636F60D9C541FDF4998FBB13685E9FBF0
E1C3E24B972E91655403D0A9BB9A57C45FC36EDDBAC56C6C6CC811AF41E07B10
10505C5C9CAD385B3B3B3BB66FDF3E3FD02E83562A168BDFA9ADAD65BEBEBE4C
4B4BEB14D663C91260DD585A5A2A229ACA51A008C3D0D0500AC32710C687996D
9293933B07060664341E8FC76263634DF0ECC1E7087CC3283E3E5E6A6E6E4EC0
084496DC12B538822D29292992E1E1E19501387AF4A8B58686861842FA6062D3
C4C44425F6C0C040261008C450640D808EA03FA410B4B5B5657BF7EED5E772B9
F7C839B13F0CE199565252B23C00B1BA1E2F47DD8C6133B3B7B77F1B024A20A0
1C7FB89D12CEFC41494A4F4FAF083C9EE0F1E9E8E8B8A170382B2B2B0627F507
2D934214FB8500285D16C03FE48482D7964F692B1CB0D0F6828282721500D800
80F085038015BEABA9A939BE2C80475AAB78D70C6CC98918D2F0699830069B63
E17C090B938A9A9A1A333636FE043CF1E0F901611B035F99A3D3319A98987882
5E047A596B6BEB0E959D70FDFAF5CCC7C7E7276C8EC0E688FCFCFC54C4B412BB
A9A929454A1814FD0C9E94F2F2F28FAAAAAAE6E854CC6262622CE00B5DA077F7
F4F408540680F8673B77EE3C0F2121D81C92969676A1B7B757891DF5821D3E7C
9852723A78322A2A2A422B2B2B957800500DA1494969020074560A200DC283B1
3918002EFE078040F06480E70200842C04101212C2B3B0B098067D1200B4570A
2019C2C3B1393C2F2FEF7C5B5B9B123BF508E1E1E107E445291500221602A023
803FD111407F8FE5F2D550439F97CB336106060674C671107E849C1085256161
9D4792A266E563F02490133E7DFA344691296950B644CA563861797B7BFB7625
00280F7F4F334EA81A93A671197B5D660154C326544395E34BC50100DFDFBE7D
FBD81C002C34F4E819BF7BD7C2698F437F4781C340E7AF5C297BA3896FC7BB6F
E9F45212D1D5AB57CB39A79E35A565542A2BAC5D867B579937A949669B843DA2
68C7818E7CB196D15BBFE959CBCC871856A4E2B2E9E9E91D30B192503A263426
73A9B8BFBFFFC6CCCC8C8C6664644447A448C522EC5F2B4BC5B1424BE66AA4CB
2A9E0CB1660B27B679F3E60388E314EEECCCEF82C1EE0FC71EDC1BFFACAC5126
04C54800211D10D03F32326272EEDC39250001010194F3A929B1C21FBE7AF6EC
D9564A44541151A8F4F1138DF206251CFDE2F9EBD7AF2B3B1E75B99191915C24
8A2A307A80311B9D6E007531F0581616164656E801CD140A6C9392923A868686
647B29CBC1C3F9EAEAEA149BC3C892ABE3E2E2A4F4E7FEFEFE0C8DCC5C399E9D
9DDD929A9A2A210B2EF27C373737E6E9E9B906CCB59806D81007109F5EB97285
098542CA8897B1EE47B9A0A8A8E8624343836C1FB5EA50F40180FC02DA1F6848
BC6EDEBCC976EFDE4DCAE71A12CC8DD5D5D52234AAB27D8B0050BADCB56B1773
7474F4C62729D3244BE08FA3807804B17E086B67B0968772BB3F2B2B4BB6CFCB
CB8BC0FF08DA41D0BE84654EA03493D9955A3294F0E29C9C9CB93BC352F731AA
DBD44030642C6F6CCEC3D49777C35F605266A1223089352B34A583D494464545
6920C15083608CE982B98E2D684AF103C5D9D9D96C7E815A12000D4A2A7E7E7E
CCC1C1C1099F19F3DAF276522207F5359CF1243C5D82B38EC45A22FD29E8DDA4
58CE5F8BBF0DEAEAEA12D131CE57FEBF0014C7E1E1E1C1B66EDDCA8573ADF462
42ADFB0980CBA8ABAB93504A86F32DD6A18A308AEF4D9B36316767670E2CB30D
20E65FCD8C481F9B773583F24228AE686E6E96C2E1D8C27CB162008A410D07B5
DF4B5D4EA9CF479F27BB9CC23919F2FCA25BD052E35F02ED3A5D68222C670000
000049454E44AE426082}
Proportional = True
end
Now, at run-time, I try to save this image as a BITMAP image file (.bmp):
procedure TForm1.btnSaveTImageToBitmapClick(Sender: TObject);
begin
Image1.Picture.Bitmap.SaveToFile('Y:\Downloads\test.bmp');
end;
But when I execute this code at run-time, something very strange happens: The TImage component VANISHES (it becomes apparently INVISIBLE!) and the created .bmp file has a ZERO size (0 bytes).
However, when instead of the above code I execute this code:
procedure TForm1.btnSaveTImageToBitmapClick(Sender: TObject);
begin
Image1.Picture.SaveToFile('Y:\Downloads\test.bmp');
end;
...then the resulting file is a .PNG file with a WRONG .BMP file extension!
So how can I save this image as a valid BITMAP (.BMP) file?
EDIT: The answer by #Andreas Rejbrand and #Remy Lebeau has provided extensive explanations and ways to solve the problem.
You must create a TBitmap and assign the Picture.Graphic to it:
procedure TForm3.btnSaveClick(Sender: TObject);
var
bm: TBitmap;
begin
bm := TBitmap.Create;
try
bm.Assign(Image1.Picture.Graphic);
bm.SaveToFile('C:\Users\Andreas Rejbrand\Desktop\bitmap.bmp');
finally
bm.Free;
end;
end;
Your approach:
Image1.Picture.Bitmap.SaveToFile('Y:\Downloads\test.bmp');
doesn't work because the Picture doesn't contain a bitmap. From the documentation of the TPicture.Bitmap property:
Use Bitmap to reference the picture object when it contains a bitmap. If Bitmap is referenced when the picture contains a Metafile or Icon graphic, the graphic won't be converted (Types of Graphic Objects). Instead, the original contents of the picture are discarded and Bitmap returns a new, blank bitmap.
This approach:
Image1.Picture.SaveToFile('Y:\Downloads\test.bmp');
does exactly what it is supposed to do. It saves the Picture.Graphic as-is, which happens to be a PNG image in your case, to the file you specified. You chose a strange extension for a PNG image, but that's not something the VCL tries to correct.
Handling PNG transparency
If the PNG file has an alpha channel, bm.Assign will very faithfully create a bitmap image with an alpha channel. That's great, in one sense, because then you don't lose any information: the BMP you get contains all graphic data from the PNG, including the entire alpha channel. So you can, in principle, render this BMP onto any background and will look as nice as the PNG would look.
But in another way, it's not that great, after all. Because almost no image viewers or editors support BMPs with alpha channels. These applications will probably ignore the alpha channel, effectively making every pixel fully opaque. That will look horrible.
So if you want to create a normal BMP, without alpha channel, you need to "render" the PNG, using its alpha channel, onto a background of your choice, and then save the non-transparent result. The BMP you get will not contain the alpha channel of the original PNG, so you lose information. The BMP will not be transparent. For instance, if you draw it onto a white background, you will always have this white rectangle behind your icon/subject, even if you place it on a red area of the screen.
procedure TForm3.Image1Click(Sender: TObject);
var
bm: TBitmap;
begin
bm := TBitmap.Create;
try
bm.SetSize(Image1.Picture.Width, Image1.Picture.Height);
bm.Canvas.Brush.Color := clSkyBlue; {*}
bm.Canvas.FillRect(Rect(0, 0, bm.Width, bm.Height)); {*}
bm.Canvas.Draw(0, 0, Image1.Picture.Graphic);
bm.SaveToFile('C:\Users\Andreas Rejbrand\Desktop\bitmap2_1.bmp');
finally
bm.Free;
end;
end;
The lines with asterisks (*) can be omitted if you are happy with the default background color, which is white.

Setting the glyph image in a FireMonkey TListView

I have a FireMonkey TListView in a project. It's using a DynamicAppearance, each item features a couple of text entries and a glyph button. What I cannot seem to figure out is how to set the glyph image for that button when I build the list.
For example, when building the list items, I can do this for a text field:
lviAmount := lvi.Objects.FindObjectT<TListItemText>('Amount');
lviAmount.Text := FloatToStrF( tx.amount, ffNumber, 7, 2);
But I cannot see how to do the same thing with a TListItemGlyphButton:
lviDelete := lvi.Objects.FindObjectT<TListItemGlyphButton>('DeleteButton');
//then??
How can I set/assign the glyph image on a TListItemGlyphButton in a FireMonkey TListView? Any help would be greatly appreciated.
You cannot do that with a TListViewGlyphButton. It's only for Add, Delete or CheckBox button types. If you want to have an image of your own, use TListItemImage, and use the Bitmap property, e.g:
lviDelete := lvi.Objects.FindObjectT<TListItemImage>('DeleteButton');
lviDelete.Bitmap := SomeBitmap;
You'll also need to use the OnListViewItemClickEx event to determine whether or not it was the image that was clicked

Using TBitmapLinks with the FireMonkey Style Designer

I have been styling FireMonkey controls, but there is one issue that I have been having some real issues with, and that is how to incorporate bitmaps into FireMonkey styles using the FireMonkey Style Designer (and specifically not the Bitmap Style Designer). Certain styled objects (TButtonStyleObject, for example), have BitmapLink properties, but I cannot see how they are working in the new custom styles that are generated for a FireMonkey control.
Let me try to make the problem as transparent as possible. I add a StyleBook and set its Resource to the MetropolisUIGreen.Style in Delphi's Style directory (in XE7 this is located in C:\Users\Public\Documents\Embarcadero\Studio\16.0\Styles). I then open the FireMonkey Style Designer and locate the buttonstyle style, which consists of a TButtonStyleObject and a TButtonStyleTextObject, both parented to a TLayout. The TButtonStyleObject has a SourceLookup property value of MetroGreenstyle.png, which is a StyleName assoiated with a TImage into which the MetropolisUIGreen.png image has been loaded.
With the TButtonStyleObject (whose StyleName is background) selected, I examine the NormalLink property, which is a collection of TBitmapLinks. It is my understanding that the one BitmapLink that I see defined in NormalLink contains information about the bitmap that should be used for the button, including the coordinates (SourceRect) corresponding to a rectangular region of the MetroGreenstyle.png file.
My assumptions appear to be wrong, because when I examine MetroGreenstyle.png using a graphics program, there is nothing interesting at these coordinates. I have examined the BitmapLinks of many other styles, and there too I find that the SourceRect coordinates do not seem to actually define a meaningful region of the stylelookup png file.
I obviously have this wrong. How does the SourceRect coordinates of a BitmapLink define the bitmap that FireMonkey should use when rendering a control.
-- Edit I actually asked four question. I have updated this question to include just one question. I will include the other questions in another post. --
I think there is a difference between the bitmap embedded in the .style file (embedded as a resource) and the one stored in the file (C:\Users\Public\Documents\Embarcadero\Studio\15.0\Styles\MetropolisUIGreen.png, that is 519x760).
The embedded bitmap seems to be different in size than the external file (you can check that by looking in the Style Editor, selecting the metrogreenstyle.png node, opening the property editor for MultiResBitmap and looking at the image size provided for Scale 1.00: 750x850.
This explains why coordinates seems all wrong. I don't know if it is the external file to be out of date or the opposite.
HTH!
Update: I managed to extract the bitmap stored in the .style file and I can confirm the coordinates are relative to that bitmap!
Update(2):
.Style files and .fmx file are very similar so you can do:
1) open MetropolisUIGreen.Style with a text editor and locate the embedded bitmap (line 18), you can see:
object TImage
StyleName = 'MetroGreenstyle.png'
MultiResBitmap = <
item
Width = 0
Height = 0
PNG = {...}
2) create a new FMX application, add a TImage on the form and load a bitmap (any picture you want)
3) copy the PNG value from the .Style file into the XFM file. Beware to also fix the Width and Height properties:
MultiResBitmap = <
item
Width = 750
Height = 850
PNG = {...}
4) you should be able to see the picture at design time;
5) add a button with Image1.Bitmap.SaveToFile('C:\temp\new_file.png');
run the program and save the file to your disk. :-)
I'd like to verify Andreas solution. This is what I did.
Exported the .png as Andrea described
Opened the .png in Photoshop and changed some of the various objects
Saved the .png from Photoshop
Loaded it into the temp project TImage I used to export it in step 1.
Alt+F12 and copied the png content into the clipboard
Pasted it directly into my .style file (with Ultraedit)
Loaded the .style file in the style editor in Delphi
All the color changes was emediatly reflected in my design. Possibly there is a simpler way, but I don't know it. I did this in XE10 Seattle.

Resources