From Clomosy Docs

No edit summary
No edit summary
Line 1: Line 1:
You can add text input field with "TclEdit". Let's see how it is defined.<br>
<div class="alert alert-ligth border border-3 border-primary-subtle rounded-5 p-4 shadow-sm" role="alert">
function AddNewEdit(AComponent: TCLComponent; xName, xPromptText: string): TclEdit;
</div>


AddNewEdit(TComponent, xName, xPromptText)
<span style="color:blue"><b>AComponent</b></span> : The parent object of the defined component must be specified.<br>


<span style="color:blue">''TComponent''</span> : The parent object of the defined component must be specified.
<span style="color:blue"><b>xName</b></span> : The name of the defined TclEdit object must be written.<br>


<span style="color:blue">''xName''</span> : The name of the defined TclEdit object must be written.
<span style="color:blue"><b>xPromptText</b></span> : A hint or message to be displayed when the Text property is empty.<br>


<span style="color:blue">''xPromptText''</span> : A hint or message to be displayed when the Text property is empty.
The TclEdit component is a text box used to allow users to enter or edit text on a form. When placed on the form, the TclEdit component creates an area where users can input the required information. For example, it can be used as a field for entering a username or password.<br>


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  
|-
|-
|TclEdit || testEdit : TclEdit; || A variable belonging to the TclEdit class is created.
|TclEdit || Edit1 : TclEdit; || A variable belonging to the TclEdit class is created.
|-
|-
|AddNewEdit ||testEdit = MyForm.AddNewEdit(MyForm,'testEdit','Test Edit Message'); || A new Edit component is added to the form.
|AddNewEdit ||Edit1 = Form1.AddNewEdit(Form1,'Edit1','Test Edit Message'); || A new Edit component is added to the form.
|-
|-
|Width || testEdit.Width = 150; ||Allows adjusting the width of the edit component.
|Width || Edit1.Width = 150; ||Allows adjusting the width of the edit component.
|-
|-
|Height || testEdit.Height = 50; ||Allows adjusting the height of the edit component.
|Height || Edit1.Height = 50; ||Allows adjusting the height of the edit component.
|-
|-
|Align  || testEdit.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 [[Object_Properties#Align | page]] to learn about these features.
|Align  || Edit1.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 [[Object_Properties#Align | page]] to learn about these features.
|-
|-
|Margins || testEdit.Margins.Left= 100; // Right, Top, Bottom ||With the Margins parameter, you can give margins at any scale from the right, left, bottom, top.<br>[[File:TclEditMargins.png|frameless|200px]]
|Margins || Edit1.Margins.Left= 100; // Right, Top, Bottom ||With the Margins parameter, you can give margins at any scale from the right, left, bottom, top.<br>[[File:TclEditMargins.png|frameless|200px]]
|-
|-
|StyledSettings  || testEdit.StyledSettings = ssFamily; || You may want to change the appearance of the text on the label. In order to make these changes, it is necessary to activate the feature.
|StyledSettings  || Edit1.StyledSettings = ssFamily; || You may want to change the appearance of the text on the label. In order to make these changes, it is necessary to activate the feature.
|-
|-
|Size ||testEdit.TextSettings.Font.Size = 20; || It is used to adjust the text size.
|Size ||Edit1.TextSettings.Font.Size = 20; || It is used to adjust the text size.
|-
|-
|FontColor || testEdit.TextSettings.FontColor = clAlphaColor.clHexToColor('#8a067c'); || It is used to set the text color.
|FontColor || Edit1.TextSettings.FontColor = clAlphaColor.clHexToColor('#8a067c'); || It is used to set the text color.
|-
|-
|HorzAlign || testEdit.TextSettings.HorzAlign = 1; || The property controls the horizontal alignment of text. The possible values for HorzAlign are:<br>
|HorzAlign || Edit1.TextSettings.HorzAlign = 1; || The property controls the horizontal alignment of text. The possible values for HorzAlign are:<br>
* 0: Aligns the text to the center.
* 0: Aligns the text to the center.
* 1: Aligns the text to the left.
* 1: Aligns the text to the left.
* 2: Aligns the text to the right.
* 2: Aligns the text to the right.
|-
|-
|VertAlign|| testEdit.TextSettings.VertAlign = 1; || The property controls the vertical alignment of text. The possible values for VertAlign are:<br>
|VertAlign|| Edit1.TextSettings.VertAlign = 1; || The property controls the vertical alignment of text. The possible values for VertAlign are:<br>
* 0: Aligns the text to the center.
* 0: Aligns the text to the center.
* 1: Aligns the text to the top.
* 1: Aligns the text to the top.
* 2: Aligns the text to the bottom.
* 2: Aligns the text to the bottom.
|-
|-
|clTypeOfField || testEdit.clTypeOfField = taFloat; (taString) ||When you click Edit, you can type all the characters (such as numbers, symbols, letters) you want in a text. You can restrict the characters you can write in the text. You can do this with the "clTypeOfField" command. You can define this command as "taFloat - taString".
|clTypeOfField || Edit1.clTypeOfField = taFloat; (taString) ||When you click Edit, you can type all the characters (such as numbers, symbols, letters) you want in a text. You can restrict the characters you can write in the text. You can do this with the "clTypeOfField" command. You can define this command as "taFloat - taString".
taFloat; Only numbers and comma characters can be written. taString; All characters can be written. (numbers, symbols, letters)
taFloat; Only numbers and comma characters can be written. taString; All characters can be written. (numbers, symbols, letters)
|-
|-
|ReadOnly ||testEdit.ReadOnly = True; || It can be used if you want to prevent writing on the edit component.
|ReadOnly ||Edit1.ReadOnly = True; || It can be used if you want to prevent writing on the edit component.
|-
|-
|Password ||testEdit.Password = False; || It is used to hide the text entered by the user.
|Password ||Edit1.Password = False; || It is used to hide the text entered by the user.
|-
|-
| MaxLength ||testEdit.MaxLength = 5; || To allow the user to restrict the character input for an edit component, you can use the MaxLength property. In the example, only 5 characters can be entered into the component.
| MaxLength ||Edit1.MaxLength = 5; || To allow the user to restrict the character input for an edit component, you can use the MaxLength property. In the example, only 5 characters can be entered into the component.
|}
|}
</div>


<b>Example</b><br>
<pre>
var
MyForm:TclForm;
testEdit : TclEdit;


'''Example:'''<br>
{
MyForm = TclForm.Create(Self);
testEdit= MyForm.AddNewEdit(MyForm,'testEdit','Write something');
testEdit.TextSettings.Font.Size=70;
testEdit.Align = alTop;
testEdit.Margins.Top= 10;
testEdit.Height = 50;
testEdit.Width = 150;


:'''TRObject Syntax'''
MyForm.Run;
var
MyForm:TclForm;
testEdit : TclEdit;
{
MyForm = TclForm.Create(Self);
testEdit= MyForm.AddNewEdit(MyForm,'testEdit','Write something');
testEdit.TextSettings.Font.Size=70;
testEdit.Align = alTop;
testEdit.Margins.Top= 10;
testEdit.Height = 50;
testEdit.Width = 150;
MyForm.Run;
}


:'''Base Syntax'''
}
'''var'''
</pre>
MyForm:TclForm;
testEdit : TclEdit;<br>
'''begin'''
MyForm := TclForm.Create(Self);
testEdit:= MyForm.AddNewEdit(MyForm,'testEdit','Write something');
testEdit.TextSettings.Font.Size:=70;
testEdit.Align := alTop;
testEdit.Margins.Top:= 10;
testEdit.Height := 50;
testEdit.Width := 150;<br>
MyForm.Run;<br>
'''end;'''


'''Output:'''<br>
<b>Output:</b><br>
[[File:Edit.png|frameless|450px]]
[[File:Edit.png|frameless|450px]]<br>
 
<h2> See Also </h2>
* [[Components]]
* [[Object Properties]]

Revision as of 07:48, 7 November 2024

AComponent : The parent object of the defined component must be specified.

xName : The name of the defined TclEdit object must be written.

xPromptText : A hint or message to be displayed when the Text property is empty.

The TclEdit component is a text box used to allow users to enter or edit text on a form. When placed on the form, the TclEdit component creates an area where users can input the required information. For example, it can be used as a field for entering a username or password.

The features and usage are provided in the table below.

Feature Use of Definition
TclEdit Edit1 : TclEdit; A variable belonging to the TclEdit class is created.
AddNewEdit Edit1 = Form1.AddNewEdit(Form1,'Edit1','Test Edit Message'); A new Edit component is added to the form.
Width Edit1.Width = 150; Allows adjusting the width of the edit component.
Height Edit1.Height = 50; Allows adjusting the height of the edit component.
Align Edit1.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 Edit1.Margins.Left= 100; // Right, Top, Bottom With the Margins parameter, you can give margins at any scale from the right, left, bottom, top.
TclEditMargins.png
StyledSettings Edit1.StyledSettings = ssFamily; You may want to change the appearance of the text on the label. In order to make these changes, it is necessary to activate the feature.
Size Edit1.TextSettings.Font.Size = 20; It is used to adjust the text size.
FontColor Edit1.TextSettings.FontColor = clAlphaColor.clHexToColor('#8a067c'); It is used to set the text color.
HorzAlign Edit1.TextSettings.HorzAlign = 1; The property controls the horizontal alignment of text. The possible values for HorzAlign are:
  • 0: Aligns the text to the center.
  • 1: Aligns the text to the left.
  • 2: Aligns the text to the right.
VertAlign Edit1.TextSettings.VertAlign = 1; The property controls the vertical alignment of text. The possible values for VertAlign are:
  • 0: Aligns the text to the center.
  • 1: Aligns the text to the top.
  • 2: Aligns the text to the bottom.
clTypeOfField Edit1.clTypeOfField = taFloat; (taString) When you click Edit, you can type all the characters (such as numbers, symbols, letters) you want in a text. You can restrict the characters you can write in the text. You can do this with the "clTypeOfField" command. You can define this command as "taFloat - taString".

taFloat; Only numbers and comma characters can be written. taString; All characters can be written. (numbers, symbols, letters)

ReadOnly Edit1.ReadOnly = True; It can be used if you want to prevent writing on the edit component.
Password Edit1.Password = False; It is used to hide the text entered by the user.
MaxLength Edit1.MaxLength = 5; To allow the user to restrict the character input for an edit component, you can use the MaxLength property. In the example, only 5 characters can be entered into the component.

Example

var
MyForm:TclForm;
testEdit : TclEdit;

{
MyForm = TclForm.Create(Self);
testEdit= MyForm.AddNewEdit(MyForm,'testEdit','Write something');
testEdit.TextSettings.Font.Size=70;
testEdit.Align = alTop;
testEdit.Margins.Top= 10; 
testEdit.Height = 50;
testEdit.Width = 150;

MyForm.Run;

}

Output:
Edit.png

See Also