BGRA Button Designer App

[digeo]

I have recently started with Lazarus after working with Delphi 2007. I have also discovered the BGRA graphics library and liked it a lot.

I have just completed my first app using lazarus and the BGRA library. It is GUI based app to design buttons using BGRA and their button control.

Please try the app (it is virus, malware etc free) and give feedback and suggestions please.

The source is still in the quick and dirty phase and will be available for download shortly.

Due to size limit, program download is available from my website at the following link:

http://www.digeotek.com/bgra-button-designer

So far only available for Win as I am trying to update my Lazarus install on my Linux Mint PC to 0.9.30. BUT, the source should be available soon for download after some clean up.

[lainz]

When I run the exe the app crash

[digeo]

Sorry about that. Do not know how that happened. I transfered the exe to the server again and tested download successfully. Probably got corrupted during the upload.

http://www.digeotek.com/bgra-button-designer

[circular]

Nice app.

I noticed that the button is not updated when the gradient type is changed (radial, linear etc.)

[digeo]

Everything seems to be working fine on my side. Make sure you are checking the correct state as selected on the ribbon.

There are 3 static buttons, each indicating a state and then there is a 4th button where you can check the normal, hover and clicked states.

I will investigate further to see if I can spot the problem as you mentioned.

[circular]

I understood about the 3 buttons, but this was not the problem. By the way, I suppose you can use csDropDownList for Style property of Comboboxes.

[lainz]

Your code can be used to add 'LoadFromFile' and 'SaveToFile' in TBGRAButton?

Also if you want we can add the editor in the package.

[digeo]

At the moment I just stream the Test Button component and save all its properties to file. Bad thing is that a binary file is unreadable. SO I am trying to figure out the Lazarus XML support as this will make it much easier to edit the file afterwards with a XML editor.

Save Procedure:

Code: [Select]

procedure TfrmMain.SaveStyle(filename: string);
var
  stream : TFileStream;
begin
  stream := TFileStream.Create(filename, fmCreate);
  stream.WriteComponent(btnTest);
  stream.Free;
end;

Load Procedure:

Code: [Select]

procedure TfrmMain.OpenStyle(filename: string);
var
  strm : TFileStream;
begin
  if FileExists(filename) then
  begin
    strm := TFileStream.Create(filename, fmOpenRead);
    strm.ReadComponent(btnTest);
    strm.Free;
  end; 
end;


[lainz]

At the moment I just stream the Test Button component and save all its properties to file. Bad thing is that a binary file is unreadable. SO I am trying to figure out the Lazarus XML support as this will make it much easier to edit the file afterwards with a XML editor.

Save Procedure:

Code: [Select]

procedure TfrmMain.SaveStyle(filename: string);
var
  stream : TFileStream;
begin
  stream := TFileStream.Create(filename, fmCreate);
  stream.WriteComponent(btnTest);
  stream.Free;
end;

Load Procedure:

Code: [Select]

procedure TfrmMain.OpenStyle(filename: string);
var
  strm : TFileStream;
begin
  if FileExists(filename) then
  begin
    strm := TFileStream.Create(filename, fmOpenRead);
    strm.ReadComponent(btnTest);
    strm.Free;
  end; 
end;


Wow, nice.

I did some LoadFromFile and SaveToFile with TBGRAImageButton, with INIFiles, but seems that this is the easy way.

[circular]

Lainz, it would be great to have the same text size with or without the canvas option. In fact, I guess it would be good to have the same size as a TLabel component with the same font. Maybe it would be necessary to set the font size in the constructor, because the behavior of unnamed font is strange. What do you think about it ?

[lainz]

With canvas option has the same height as TLabel.

Without is the problem, we need to set an internal size when the font.height is zero to scale it to the os default, or set a fixed height in the constructor, but we need to know the value of the height.

This is a crazy thing that I never tested:

In Windows if you change the font height (changing the dpi settings) you are logged out, so there is not any problem on setting the font size on create.

In Ubuntu you can change the font without log out or restart! What happen to the application that is already running?

Of course is a situation that doesn't matter, you're not changing the font height 60 times on an hour =)

[circular]

With canvas option has the same height as TLabel.

I've tried, but here i've got another result : the height is always different from TLabel.

With TLabel and Font Arial of Height -32,
the equivalent is for TBGRAButton without TextCanvas and Font Arial of Height -28
and for TBGRAButton with TextCanvas and Font Arial of Height -36

Without is the problem, we need to set an internal size when the font.height is zero to scale it to the os default, or set a fixed height in the constructor, but we need to know the value of the height.

That's right. We can do it with ScaleY(...)

This is a crazy thing that I never tested:

In Windows if you change the font height (changing the dpi settings) you are logged out, so there is not any problem on setting the font size on create.

In Ubuntu you can change the font without log out or restart! What happen to the application that is already running?

I wonder what would happen.

[lainz]

Code: [Select]

I've tried, but here i've got another result : the height is always different from TLabel.

With TLabel and Font Arial of Height -32,
the equivalent is for TBGRAButton without TextCanvas and Font Arial of Height -28
and for TBGRAButton with TextCanvas and Font Arial of Height -36
Ok. I've tested only 'default' with 0 as font height for both label and canvas, that I've obtained that result.. the height is the same only in that case.

Code: [Select]

That's right. We can do it with ScaleY(...)
you've seen the code of tbgrabutton to see if it works? is that it is filled with the word 'font' everywhere =)

[circular]

Ok.

You sent a PM about using more states for buttons. In fact, I think it would be simplified if the states were dependents. I mean that for example if you change the value for normal state, and that other states have the same value as the normal state, then the other states are also changed. But if you change for example the hover state, it will not change the normal state. See what I mean ? Some states are more logically deduced from other states. This would simplify the whole process of defining a button state, like in CSS.

[lainz]

Yes. I think =)

If I change, for example, BodyNormal.Gradient1.StartColor (that now is clRed) with (clLime) and some of the other states has clRed in Gradient1.StartColor, also will be changed. Always I need to change first the BodyNormal and then the other states.