From Clomosy Docs

No edit summary
No edit summary
Line 1: Line 1:
AddNewProPanel(TComponent, xName): TclProPanel
<div class="alert alert-ligth border border-3 border-primary-subtle rounded-5 p-4 shadow-sm" role="alert">
function AddNewProPanel(AComponent: TCLComponent; xName: string): TclProPanel;
</div>


The TclProPanel feature is a component that contains components that we use more than once in our application. You can define the component with the json structure. It has the features described below.<br>
<span style="color:blue"><b>AComponent</b></span> :  The variable name of the defined component is written. Here you have to write the name of the component you want in it.<br>


'''The available SetupComponent properties for TclProPanel are:'''<br>
<span style="color:blue"><b>xName</b></span> : The name of the defined panel should be written.<br>
* Width
* Height
* PositionX
* PositionY
* Align
* BackgroundColor
* MarginTop
* MarginBottom
* MarginRight
* MarginLeft
* RoundHeight
* RoundWidth
* BorderColor
* BorderWidth


<blockquote style="background-color:#CBEDD5">To learn the purpose and usage of the '''SetupComponent''' and '''clProSettings''' properties, please refer to [[Pro Object Properties| the page]]. </blockquote>
Used to group and manage other components within a specific area on the form, TclProPanel allows developers to allocate a distinct section in the user interface where other components (such as buttons, text boxes, labels, etc.) can be placed. This makes it easier to control the layout and appearance of components on the form.<br>


Let's define the proPanel at the beginning.
<div class="alert alert-info" role="alert" data-bs-theme="light">
Refer to the [[TclPanel]] page for standard panel usage.
</div>


  Var
<div class="table-responsive">
  ProPanel1 : TClProPanel;
{| class="wikitable" style="border: 2px solid #c3d7e0"
! style="background-color: #c3d7e0"| Feature !!style="background-color: #c3d7e0"| Use of !!style="background-color: #c3d7e0"| Definition
|-
|TclProPanel || ProPanel1 : TclProPanel; || A variable belonging to the TclPanel class is created.
|-
|AddNewProPanel ||ProPanel1 = Form1.AddNewProPanel(Form1,'ProPanel1'); || A new TclProPanel is added to the form.
|}
</div>


Let's add the object to the form. Then, we'll assign properties to our panel using both the SetupComponent structure and clProSettings.<br>
In addition to the features of a standard panel, TclProPanel offers new and advanced features, which we will explain in detail below.<br>


:''For clProSettings:''
<div class="row">
<pre>
<div class="col-lg-6">
ProPanel1 = Form1.AddNewProPanel(Form1,'ProPanel1');
<div  class="card d-flex flex-column justify-content-start gap-1 mb-3 h-100" style="padding: 3;">
ProPanel1.Align = alCenter;
<div style="font-size: 16px;font-weight: bold;text-align:left;">
ProPanel1.Width = 200;
  clProSettings Properties
ProPanel1.Height = 280;
</div>
ProPanel1.clProSettings.BorderColor = clAlphaColor.clHexToColor('#fabd2');
<div style="font-size: 14px;font-weight: normal;text-align:justify; max-width: 350px;">
ProPanel1.clProSettings.RoundHeight = 10;
<li>BorderColor</li>
ProPanel1.clProSettings.RoundWidth = 10;
<li>BorderWidth</li>
ProPanel1.clProSettings.BorderWidth = 2;
<li>BackgroundColor</li>
ProPanel1.clProSettings.IsFill = True;  
<li>IsTransparent</li>
ProPanel1.clProSettings.IsRound = True;
<li>IsFill</li>
ProPanel1.SetclProSettings(ProPanel1.clProSettings);
<li>IsRound</li>
</pre>
<li>RoundHeight</li>
<li>RoundWidth</li>
</div>
</div>
</div>
<div class="col-lg-6">
<div  class="card d-flex flex-column justify-content-start gap-1 mb-3 h-100" style="padding: 3;">
<div style="font-size: 16px;font-weight: bold;text-align:left;">
SetupComponent Properties
</div>
<div style="font-size: 14px;font-weight: normal;text-align:justify; max-width: 350px;">
<li>Width</li>
<li>Height</li>
<li>PositionX</li>
<li>PositionY</li>
<li>Align</li>
<li>BackgroundColor</li>
<li>MarginTop</li>
<li>MarginBottom</li>
<li>MarginRight</li>
<li>MarginLeft</li>
<li>RoundHeight</li>
<li>RoundWidth</li>
<li>BorderColor</li>
<li>BorderWidth</li>
</div>
</div>
</div>
</div>
<br>


:''For SetupComponent:''
<div class="alert alert-warning" role="alert" data-bs-theme="light">
<pre>
To learn the purpose and usage of the <b>SetupComponent</b> and <b>clProSettings</b> properties, please refer to [[Pro Object Properties| the page]].
ProPanel1 = Form1.AddNewProPanel(Form1,'ProPanel1');
</div>
clComponent.SetupComponent(ProPanel1,'{"Align" : "Center", "Width":200, "Height":280, "RoundHeight":10, "RoundWidth":10, "BorderColor":"#fabd2", "BorderWidth":2}');
</pre>


<b>Example</b><br>


'''Example:'''<br>
For clProSettings:<br>
:'''TRObject Syntax'''
<pre>
<pre>
Var   
Var   
Line 75: Line 99:
</pre>
</pre>


:'''Base Syntax'''
For SetupComponent:<br>
<pre>
<pre>
Var   
Var   
   Form1:TclForm;
   Form1:TclForm;
   ProPanel1 : TclProPanel;
   ProPanel1 : TclProPanel;
 
{
begin
   Form1=TclForm.Create(self);
   Form1:=TclForm.Create(self);
   ProPanel1=Form1.AddNewProPanel(Form1,'ProPanel1');
   ProPanel1:=Form1.AddNewProPanel(Form1,'ProPanel1');
  ProPanel1.Align := alCenter;
  ProPanel1.Width := 200;
  ProPanel1.Height := 280;
  ProPanel1.clProSettings.BorderColor := clAlphaColor.clHexToColor('#fabd2');
  ProPanel1.clProSettings.RoundHeight := 10;
  ProPanel1.clProSettings.RoundWidth := 10;
  ProPanel1.clProSettings.BorderWidth := 2;
  ProPanel1.clProSettings.IsFill := True;
  ProPanel1.clProSettings.IsRound := True;
  ProPanel1.SetclProSettings(ProPanel1.clProSettings);
    
    
   Form1.Run;
   clComponent.SetupComponent(ProPanel1,'{
end;
  "Align" : "Center",
  "Width":200,
  "Height":280,
  "BorderWidth":2,
  "BorderColor":"#fabd2",
  "RoundHeight":10,
  "RoundWidth":10
}');
</pre>
</pre>
<h2> See Also </h2>
* [[Components]]
* [[Pro Object Properties]]
* [[Object Properties]]

Revision as of 11:06, 12 November 2024

AComponent : The variable name of the defined component is written. Here you have to write the name of the component you want in it.

xName : The name of the defined panel should be written.

Used to group and manage other components within a specific area on the form, TclProPanel allows developers to allocate a distinct section in the user interface where other components (such as buttons, text boxes, labels, etc.) can be placed. This makes it easier to control the layout and appearance of components on the form.

Feature Use of Definition
TclProPanel ProPanel1 : TclProPanel; A variable belonging to the TclPanel class is created.
AddNewProPanel ProPanel1 = Form1.AddNewProPanel(Form1,'ProPanel1'); A new TclProPanel is added to the form.

In addition to the features of a standard panel, TclProPanel offers new and advanced features, which we will explain in detail below.

clProSettings Properties

  • BorderColor
  • BorderWidth
  • BackgroundColor
  • IsTransparent
  • IsFill
  • IsRound
  • RoundHeight
  • RoundWidth

    • SetupComponent Properties

  • Width
  • Height
  • PositionX
  • PositionY
  • Align
  • BackgroundColor
  • MarginTop
  • MarginBottom
  • MarginRight
  • MarginLeft
  • RoundHeight
  • RoundWidth
  • BorderColor
  • BorderWidth


    • Example

    For clProSettings:

    Var  
  Form1:TclForm;
  ProPanel1 : TclProPanel;

{
  Form1=TclForm.Create(self);
  ProPanel1=Form1.AddNewProPanel(Form1,'ProPanel1');
  ProPanel1.Align = alCenter;
  ProPanel1.Width = 200;
  ProPanel1.Height = 280;
  ProPanel1.clProSettings.BorderColor = clAlphaColor.clHexToColor('#fabd2');
  ProPanel1.clProSettings.RoundHeight = 10;
  ProPanel1.clProSettings.RoundWidth = 10;
  ProPanel1.clProSettings.BorderWidth = 2;
  ProPanel1.clProSettings.IsFill = True; 
  ProPanel1.clProSettings.IsRound = True;
  ProPanel1.SetclProSettings(ProPanel1.clProSettings);
  
  Form1.Run;
}

    For SetupComponent:

    Var  
  Form1:TclForm;
  ProPanel1 : TclProPanel;
{
  Form1=TclForm.Create(self);
  ProPanel1=Form1.AddNewProPanel(Form1,'ProPanel1');
  
  clComponent.SetupComponent(ProPanel1,'{
  "Align" : "Center",
  "Width":200,
  "Height":280,
  "BorderWidth":2,
  "BorderColor":"#fabd2",
  "RoundHeight":10,
  "RoundWidth":10	
}');

    See Also

    Retrieved from "http:///index.php?title=TclProPanel&oldid=3074"