From Clomosy Docs

No edit summary
No edit summary
Line 3: Line 3:
It is used to add images into the project. All of the TclImage features are available. Apart from this, border color, rounding borders, image stretching and fitting features are available. <br>
It is used to add images into the project. All of the TclImage features are available. Apart from this, border color, rounding borders, image stretching and fitting features are available. <br>


'''The available SetupComponent properties for TclProButton are:'''<br>
'''The available SetupComponent properties for TclProImage are:'''<br>
* Width
* Width
* Height
* Height
Line 25: Line 25:
<blockquote style="background-color:#CBEDD5">To learn the purpose and usage of the '''SetupComponent''' and '''clProSettings''' properties, please refer to [[JSON Design| the page]]. </blockquote>
<blockquote style="background-color:#CBEDD5">To learn the purpose and usage of the '''SetupComponent''' and '''clProSettings''' properties, please refer to [[JSON Design| the page]]. </blockquote>


Let's define the proButton at the beginning.<br>
Let's define the proImage at the beginning.<br>


  Var
  Var

Revision as of 13:07, 22 August 2024

AddNewProImage(TComponent, xName): TClProImage

It is used to add images into the project. All of the TclImage features are available. Apart from this, border color, rounding borders, image stretching and fitting features are available.

The available SetupComponent properties for TclProImage are:

  • Width
  • Height
  • PositionX
  • PositionY
  • Align
  • TextColor
  • BackgroundColor
  • MarginTop
  • MarginBottom
  • MarginRight
  • MarginLeft
  • RoundHeight
  • RoundWidth
  • BorderColor
  • BorderWidth
  • ImgFit
  • ImgStretch
  • ImgUrl

To learn the purpose and usage of the SetupComponent and clProSettings properties, please refer to the page.

Let's define the proImage at the beginning.

Var
 ProImg1: TClProImage;

Let's add the object to the form. Then, we'll assign properties to our image using both the SetupComponent structure and clProSettings.

For clProSettings:
ProImg1 = Form1.AddNewProImage(Form1,'ProImg1');
ProImg1.Align = alCenter;
ProImg1.Width = 150;
ProImg1.Height = 150;
ProImg1.clProSettings.BorderColor = clAlphaColor.clHexToColor('#fabd2');
ProImg1.clProSettings.FontColor = clAlphaColor.clDarkorchid;
ProImg1.clProSettings.RoundHeight = 10;
ProImg1.clProSettings.RoundWidth = 10;
ProImg1.clProSettings.BorderWidth = 2;
ProImg1.clProSettings.IsFill = True; 
ProImg1.clProSettings.IsRound = True;
ProImg1.clProSettings.PictureSource = 'https://clomosy.com/demos/computerNetwork.png';
ProImg1.clProSettings.PictureAutoFit = True;
ProImg1.SetclProSettings(ProImg1.clProSettings);
For SetupComponent:
 ProImg1 = Form1.AddNewProImage(Form1,'ProImg1');
 clComponent.SetupComponent(ProImg1,'{"Align" : "Center", "Width":150, "Height":150, "RoundHeight":10, "RoundWidth":10, "BorderColor":"#fabd2", "BorderWidth":2, "ImgUrl":"https://clomosy.com/demos/computerNetwork.png", "ImgFit":"yes"}');

Example:

TRObject Syntax
Var   
  Form1:TclForm;
  ProImg1: TClProImage;

void SetImage;
{
  ProImg1 = Form1.AddNewProImage(Form1,'ProImg1');
  ProImg1.Align = alCenter;
  ProImg1.Width = 150;
  ProImg1.Height = 150;
  ProImg1.clProSettings.BorderColor = clAlphaColor.clHexToColor('#fabd2');
  ProImg1.clProSettings.FontColor = clAlphaColor.clDarkorchid;
  ProImg1.clProSettings.RoundHeight = 10;
  ProImg1.clProSettings.RoundWidth = 10;
  ProImg1.clProSettings.BorderWidth = 2;
  ProImg1.clProSettings.IsFill = True; 
  ProImg1.clProSettings.IsRound = True;
  ProImg1.clProSettings.PictureSource = 'https://clomosy.com/demos/computerNetwork.png';
  ProImg1.clProSettings.PictureAutoFit = True;
  ProImg1.SetclProSettings(ProImg1.clProSettings);
}

{
  Form1 = TclForm.Create(Self);
  SetImage;
  Form1.Run;
}
Base Syntax
Var   
  Form1:TclForm;
  ProImg1: TClProImage;

procedure SetImage;
begin
  ProImg1 := Form1.AddNewProImage(Form1,'ProImg1');
  ProImg1.Align := alCenter;
  ProImg1.Width := 150;
  ProImg1.Height := 150;
  ProImg1.clProSettings.BorderColor := clAlphaColor.clHexToColor('#fabd2');
  ProImg1.clProSettings.FontColor := clAlphaColor.clDarkorchid;
  ProImg1.clProSettings.RoundHeight := 10;
  ProImg1.clProSettings.RoundWidth := 10;
  ProImg1.clProSettings.BorderWidth := 2;
  ProImg1.clProSettings.IsFill := True; 
  ProImg1.clProSettings.IsRound := True;
  ProImg1.clProSettings.PictureSource := 'https://clomosy.com/demos/computerNetwork.png';
  ProImg1.clProSettings.PictureAutoFit := True;
  ProImg1.SetclProSettings(ProImg1.clProSettings);
end;

begin
  Form1 := TclForm.Create(Self);
  SetImage;
  Form1.Run;
end;

Output:
ProImage.png