From Clomosy Docs

No edit summary
No edit summary
 
(4 intermediate revisions by 2 users not shown)
Line 1: Line 1:
TclLoyout is a container for other graphic object. Use TclLayout to edit multiple chart controls under the same parent. For example, you wanted to put 2 components (label, button) in a single line on the page you want to design. In such cases, you can position these 2 components in a single Layout.
<div class="alert alert-ligth border border-3 border-primary-subtle rounded-5 p-4 shadow-sm" role="alert">
function AddNewLayout(AComponent: TCLComponent; xName: string): TclLayout;
</div>
<span style="color:blue"><b>AComponent</b></span> : Specifies the parent of the object to be defined.<br>


AddNewLayout(xOwner:TComponent; xName:String): TclLayout
<span style="color:blue"><b>xName</b></span> : The name of the defined layout should be written.<br>


<span style="color:blue">''TComponent''</span> : The variable name of the defined component is written. Here you should write the component variable name of whatever your component will be in.
It is used to arrange other components on the form. Simply put, it is used to organize buttons, labels, and other visual elements in a specific layout on a form. This layout automatically adjusts the size and position of the components, making the form appear more organized and aesthetically pleasing. TclLayout is particularly useful when creating dynamic user interfaces and adapting to different screen sizes.<br>
 
<span style="color:blue">''xName''</span> : The name of the defined layout should be written.


The features and usage are provided in the table below.<br>


<div class="table-responsive">
{| class="wikitable" style="border: 2px solid #c3d7e0"
{| class="wikitable" style="border: 2px solid #c3d7e0"
! style="background-color: #c3d7e0"| Feature !!style="background-color: #c3d7e0"| Use of !!style="background-color: #c3d7e0"|Definition  
! style="background-color: #c3d7e0"| Feature !!style="background-color: #c3d7e0"| Use of !!style="background-color: #c3d7e0"| Definition  
|-
|-
|TclLayout || Layout1 : TclLayout; || A variable belonging to the TclLayout class is created.
|TclLayout || Layout1 : TclLayout; || A variable belonging to the TclLayout class is created.
|-
|-
|AddNewLayout || Layout1 = MyForm.AddNewLayout(MyForm,'Layout1'); || A new TclLayout is added to the form.
|AddNewLayout || Layout1 = Form1.AddNewLayout(Form1,'Layout1'); || A new TclLayout is added to the form.
|-
|AutoResize ||Layout1.AutoResize = clVertical; || Enables automatic resizing of a component based on its content. This feature allows resizing horizontally (clHorizontal) or vertically (clVertical) and can be adjusted as needed.
|-
|-
|Width || Layout1.Width = 150; ||Allows adjusting the width of the layout.
|Width || Layout1.Width = 150; ||Allows adjusting the width of the layout.
Line 23: Line 28:
|Margins || Layout1.Margins.Left = 50; // Right, Top, Bottom ||With the Margins parameter, you can give margins at any scale from the right, left, bottom, top.<br>[[File:PanelAppearance.png|frameless|200px]]<br><br>
|Margins || Layout1.Margins.Left = 50; // Right, Top, Bottom ||With the Margins parameter, you can give margins at any scale from the right, left, bottom, top.<br>[[File:PanelAppearance.png|frameless|200px]]<br><br>
|}
|}
</div>


'''Example:'''<br>
<b>Example</b><br>
 
<pre>
:'''TRObject Syntax'''
Var   
  Var   
  MyForm:TclForm;
    MyForm:TclForm;
  Panel1 : TclPanel;
    Panel1 : TclPanel;
  Layout1 : TclLayout;
    Layout1 : '''TclLayout''';
  Edit1 : TclEdit;
    Edit1 : TclEdit;
 
{
  {
 
  MyForm=TclForm.Create(self);
    MyForm=TclForm.Create(self);
   
   
  Panel1=MyForm.AddNewPanel(MyForm,'Panel1');
    Panel1=MyForm.AddNewPanel(MyForm,'Panel1');
  Panel1.Align=ALTop;
    Panel1.Align=ALTop;
  Panel1.Height=100;
    Panel1.Height=100;
   
    Layout1 = MyForm.'''AddNewLayout'''(Panel1,'Layout1');
    Layout1.Align=ALCenter;
    Layout1.Height = 50;
      
      
    Edit1 = MyForm.AddNewEdit(Layout1,'Edit1','Write something...');
  Layout1 = MyForm.AddNewLayout(Panel1,'Layout1');
    Edit1.Align=aLLeft;
  Layout1.Align=ALCenter;
    Edit1.Width = 150;
  Layout1.Height = 50;
   
 
    MyForm.Run;
  Edit1 = MyForm.AddNewEdit(Layout1,'Edit1','Write something...');
 
  Edit1.Align=aLLeft;
  }
  Edit1.Width = 150;
 
:'''Base Syntax'''
  Var 
    MyForm:TclForm;
    Panel1 : TclPanel;
    Layout1 : '''TclLayout''';
    Edit1 : TclEdit;
 
  begin
 
    MyForm:=TclForm.Create(self);
   
    Panel1:=MyForm.AddNewPanel(MyForm,'Panel1');
    Panel1.Align:=ALTop;
    Panel1.Height:=100;
   
    Layout1 := MyForm.'''AddNewLayout'''(Panel1,'Layout1');
    Layout1.Align:=ALCenter;
    Layout1.Height := 50;
      
      
    Edit1 := MyForm.AddNewEdit(Layout1,'Edit1','Write something...');
  MyForm.Run;
    Edit1.Align:=aLLeft;
    Edit1.Width := 150;
}
   
</pre>
    MyForm.Run;
 
  end;


'''Output:'''<br>
<b>Output:</b><br>
[[File:Layout.png|frameless|450px]]
[[File:Layout.png|frameless|450px]]<br>


= See Also =
<h2> See Also </h2>
* [[Components]]
* [[Object Properties]]
* [[Object Properties]]
* [[AddNewEvent]]
* [[AddNewEvent]]
{{#seo:|title=TclLayout Using in Clomosy - Clomosy Docs}}
{{#seo:|description=Discover TclLayout in Clomosy, a component used to organize buttons, labels, and visuals, ensuring dynamic and responsive user interface design.}}

Latest revision as of 13:23, 20 February 2025

AComponent : Specifies the parent of the object to be defined.

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

It is used to arrange other components on the form. Simply put, it is used to organize buttons, labels, and other visual elements in a specific layout on a form. This layout automatically adjusts the size and position of the components, making the form appear more organized and aesthetically pleasing. TclLayout is particularly useful when creating dynamic user interfaces and adapting to different screen sizes.

The features and usage are provided in the table below.

Feature Use of Definition
TclLayout Layout1 : TclLayout; A variable belonging to the TclLayout class is created.
AddNewLayout Layout1 = Form1.AddNewLayout(Form1,'Layout1'); A new TclLayout is added to the form.
AutoResize Layout1.AutoResize = clVertical; Enables automatic resizing of a component based on its content. This feature allows resizing horizontally (clHorizontal) or vertically (clVertical) and can be adjusted as needed.
Width Layout1.Width = 150; Allows adjusting the width of the layout.
Height Layout1.Height = 50; Allows adjusting the height of the layout.
Align Layout1.Align = alTop; With the Align parameter, you can specify where you want our component to be aligned in the form. This parameter has multiple positioning properties. See the page to learn about these features.
Margins Layout1.Margins.Left = 50; // Right, Top, Bottom With the Margins parameter, you can give margins at any scale from the right, left, bottom, top.
PanelAppearance.png

Example

 Var   
   MyForm:TclForm;
   Panel1 : TclPanel;
   Layout1 : TclLayout;
   Edit1 : TclEdit;
 
 {
 
   MyForm=TclForm.Create(self);
    
   Panel1=MyForm.AddNewPanel(MyForm,'Panel1');
   Panel1.Align=ALTop;
   Panel1.Height=100;
    
   Layout1 = MyForm.AddNewLayout(Panel1,'Layout1');
   Layout1.Align=ALCenter;
   Layout1.Height = 50;
   
   Edit1 = MyForm.AddNewEdit(Layout1,'Edit1','Write something...');
   Edit1.Align=aLLeft;
   Edit1.Width = 150;
    
   MyForm.Run;
 
 }

Output:
Layout.png

See Also

Retrieved from "http:///index.php?title=TclLayout&oldid=3869"