From Clomosy Docs

No edit summary
No edit summary
Line 9: Line 9:
<span style="color:blue">''xPromptText''</span> : A hint or message to be displayed when the Text property is empty.
<span style="color:blue">''xPromptText''</span> : A hint or message to be displayed when the Text property is empty.


Let's create a edit.<br>


1. Create a new project.<br>
{| class="wikitable" style="border: 2px solid #c3d7e0"
! 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.
|-
|AddNewEdit ||testEdit := MyForm.AddNewEdit(MyForm,'testEdit','Test Edit Message'); || A new Edit component is added to the form.
|-
|Width || testEdit.Width := 150; ||Allows adjusting the width of the edit component.
|-
|Height || testEdit.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.
|-
|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]]
|-
|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.
|-
|Size ||testEdit.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.
|-
|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".
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.
|-
|Password ||personelPassEdt.Password := False; || It is used to hide the text entered by the user.
|}


2. You need to define TclEdit on the form. To do this, you should add under the ''var'' parameter on the ide as follows. It is the name of your variable you typed at the beginning. You should define this as you want and add it as TclEdit.<br>
'''var'''
testEdit : TclEdit;
3. Add the TclEdit to the form. For this, you must add the begin end block and add it inside the form after the form is defined. By saying MyForm.AddNewEdit, we actually add to the form we have defined. Here, you need to add your form definition as whatever you wrote it.<br>
testEdit := ''MyForm''.AddNewEdit(MyForm,'testEdit','Test Edit Message');
4. If you do not want to define it in the form, you can add it in another component (such as Layout, Panel). Of course, before that, that component must be defined.
<span style="color:blue">testLayout</span> := MyForm.AddNewLayout(MyForm,'testLayout');
testEdit := MyForm.AddNewEdit(<span style="color:blue">testLayout</span>,'testEdit','Test Edit Message');
5. While defining the component, you can define it manually by typing. Another method is to write its shortcut. If you type "AddNewEdit" while the shortcut is in the code block, a pop-up menu will appear.<br>
[[File:TclEditShortcut.png|frameless|400px]]<br><br>
As soon as you click, the following block will come automatically.<br>
AddNewEdit(xOwner:TComponent; xName,xPromptText:String);
6. We gave the variable name while defining the TclEdit in var. Now when you add this in begin end you should use this variable name in all definitions. Your code will throw an error when you write these variable names incorrectly.
7. You can print a message to your Edit component as the last parameter when defining your project. This title is the text that will appear on the screen when the application is run. You may not want to write when defining this title. An empty edit will appear on the screen.
testEdit := MyForm.AddNewEdit(MyForm,'testEdit',<nowiki>''</nowiki>);
10. Now let's design our TclEdit component. Let's set the width and height first. For this, you must make the following definitions.
testEdit.Height := 50;
testEdit.Width := 150;
11. 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 [https://www.docs.clomosy.com/index.php/Object_Properties#Align page] to learn about these features. We're going to call it the top part here. So we have to write "AlTop".
testEdit.Align := alTop;
12. With the Margins parameter, you can give margins at any scale from the right, left, bottom, top.
testEdit.Margins.Left:= 100;
testEdit.Margins.Right:= 100;
testEdit.Margins.Top:= 100;
testEdit.Margins.Bottom:= 10;
[[File:TclEditMargins.png|frameless|500px]]<br><br>
13. You may want to change the appearance of the text in the tag. We will use the TextSettings parameter for this.In order to use this parameter, you have to make the following definition. Otherwise your commands will not work.<br>
testEdit.StyledSettings := ssFamily;
To adjust the text size;<br>
testEdit.TextSettings.Font.Size := 20;
To set the text color;<br>
testEdit.TextSettings.FontColor := clAlphaColor.clHexToColor('#8a067c');
14. When you click on Edit, you can write all the characters you want in a text (such as numbers, symbols, letters). You can restrict the characters you can write in the text. So how will you do this?<br>
You can do this with the "clTypeOfField" command below. You can define this command as "taFloat - taDate - taString".<br>
testEdit.clTypeOfField := taFloat;
What do these mean?<br>
<span style="color:blue">''taFloat''</span> : Only numbers and comma characters can be written.
<span style="color:blue">''taString''</span> : All characters can be written. (numbers, symbols, letters)
15. If you want to prevent writing on TclEdit component, you should write the following piece of code.
testEdit.ReadOnly := True;
16. To tell you the truth, you have created a simple application that does nothing yet. Let's save and start using our project. You can save in one of two ways:<br>
Click the save icon (the button in the upper right corner) or press Ctrl + S to save the project and see what you've done on the platforms now.


'''Example:'''<br>
'''Example:'''<br>
:'''Basic Syntax'''
  '''var'''
  '''var'''
  MyForm:TclForm;
  MyForm:TclForm;
Line 93: Line 55:
  MyForm.Run;<br>
  MyForm.Run;<br>
  '''end;'''
  '''end;'''
:'''TRObject Syntax'''
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:'''<br>
'''Output:'''<br>
[[File:Edit.png|frameless|450px]]
[[File:Edit.png|frameless|450px]]

Revision as of 13:55, 22 December 2023

You can add text input field with "TclEdit". Let's see how it is defined.

AddNewEdit(TComponent, xName, xPromptText)

TComponent : The variable name of the defined component is written. Here you should write the component variable name of whatever your component will be in.

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

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


Feature Use of Definition
TclEdit testEdit : 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.
Width testEdit.Width := 150; Allows adjusting the width of the edit component.
Height testEdit.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 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.
TclEditMargins.png
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.
Size testEdit.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.
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".

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.
Password personelPassEdt.Password := False; It is used to hide the text entered by the user.


Example:

Basic Syntax
var
MyForm:TclForm;
testEdit : TclEdit;
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;
MyForm.Run;
end;
TRObject Syntax
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