From Clomosy Docs

(Created page with " AddNewProDateEdit(TComponent, xName): TClProDateEdit; Represents a single-line editable text box containing a date.<br> When you click or tap the TClProDateEdit control, it displays a date picker that allows you to select a date. Its definition is as follows.<br> <blockquote style="background-color:#F7F5EB"> testProDateEdit: TClProDateEdit; </blockquote> It has properties defined by json structure for the use of ProDateEdit. Parameters used for ProDateEdit:<br> * Wi...")
 
No edit summary
 
(6 intermediate revisions by 2 users not shown)
Line 1: Line 1:
AddNewProDateEdit(TComponent, xName): TClProDateEdit;
<div class="alert alert-ligth border border-3 border-primary-subtle rounded-5 p-4 shadow-sm" role="alert">
function AddNewProDateEdit(AComponent: TCLComponent; xName: string): TClProDateEdit;
</div>
 
<span style="color:blue"><b>AComponent</b></span> : Specifies the parent of the object to be defined.<br>
 
<span style="color:blue"><b>xName</b></span> : The name of the defined TClProDateEdit object must be written.<br>


Represents a single-line editable text box containing a date.<br>
Represents a single-line editable text box containing a date.<br>
When you click or tap the TClProDateEdit control, it displays a date picker that allows you to select a date. Its definition is as follows.<br>
When you click or tap the TClProDateEdit control, it displays a date picker that allows you to select a date.<br>
 
<div class="table-responsive">
{| class="wikitable" style="border: 2px solid #c3d7e0"
! style="background-color: #c3d7e0"| Feature  !!style="background-color: #c3d7e0"| Use of !!style="background-color: #c3d7e0"| Definition
|-
|TClProDateEdit ||DateEdit1 : TClProDateEdit; || A variable belonging to the TClProDateEdit class is created.
|-
|AddNewProDateEdit ||DateEdit1 = Form1.AddNewProDateEdit(Form1,'DateEdit1'); ||A new TClProDateEdit is added to the form.
|-
|DateStr ||DateEdit1.DateStr || Returns the selected date value.
|}
</div>
 
In addition to the features of a standard date edit, TClProDateEdit offers new and advanced features, which we will explain in detail below.<br>
 
<div class="row">
<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;">
  clProSettings Properties
</div>
<div style="font-size: 14px;font-weight: normal;text-align:justify; max-width: 350px;">
<li>TextSettings</li>
<li>FontColor</li>
<li>FontSize</li>
<li>FontVertAlign</li>
<li>FontHorzAlign</li>
<li>BackgroundColor</li>
<li>BorderColor</li>
<li>IsTransparent</li>
<li>IsFill</li>
<li>RoundHeight</li>
<li>RoundWidth</li>
<li>IsRound</li>
<li>BorderWidth</li>
</div>
</div>
</div>
</div>
<br>
 
<div class="alert alert-warning" role="alert" data-bs-theme="light">
To learn the purpose and usage of the <b>clProSettings</b> properties, please refer to [[Pro Object Properties| the page]].
</div>
 
<b>Example</b><br>
 
<pre>
Var 
  Form1:TclForm;
  DateEdit1: TClProDateEdit;
  Button1 : TclButton;


<blockquote style="background-color:#F7F5EB">
void ProDateEditShowStr;
testProDateEdit: TClProDateEdit;
{
</blockquote>
  ShowMessage(DateEdit1.DateStr);
}


It has properties defined by json structure for the use of ProDateEdit. Parameters used for ProDateEdit:<br>
void SetTestDate;
* Width
{
* Height
  DateEdit1 = Form1.AddNewProDateEdit(Form1,'DateEdit1');
* PositionX
  DateEdit1.Align = alCenter;
* PositionY
  DateEdit1.Width = 150;
* Align
  DateEdit1.Height = 50;
* TextColor ---
  DateEdit1.clProSettings.BorderColor = clAlphaColor.clHexToColor('#323d8c');
* BackgroundColor
  DateEdit1.clProSettings.BackgroundColor = clAlphaColor.clHexToColor('#a6ade3');
* TextSize----
  DateEdit1.clProSettings.RoundHeight = 10;
* TextBold -----
  DateEdit1.clProSettings.RoundWidth = 10;
* MarginTop
  DateEdit1.clProSettings.BorderWidth = 2;
* MarginBottom
  DateEdit1.clProSettings.FontHorzAlign = palCenter;
* MarginRight
  DateEdit1.clProSettings.TextSettings.Font.Style = [fsBold];
* MarginLeft ----
  DateEdit1.clProSettings.FontSize = 20;
* RoundHeight
  DateEdit1.clProSettings.IsFill = True;
* RoundWidth
  DateEdit1.clProSettings.IsRound = True;
* BorderColor
  DateEdit1.SetclProSettings(DateEdit1.clProSettings);
* BorderWidth
}


Let's define in the form and give properties to the ProDateEdit component. You can design it according to your project as follows.<br>
{
  Form1 = TclForm.Create(Self);
  SetTestDate;
  Button1= Form1.AddNewButton(Form1,'Button1','Click');
  Button1.TextSettings.Font.Size=50;
  Button1.Align = alBottom;
  Button1.Margins.Left = 60;
  Button1.Margins.Right = 60;
  Button1.Margins.Bottom = 50;
  Button1.Height = 50;
  Button1.Width = 100;
  Form1.AddNewEvent(Button1,tbeOnClick,'ProDateEditShowStr');
  Form1.Run;
}
</pre>


<blockquote style="background-color:#F7F5EB">
<b>Output:</b><br>
  testDate := MyForm.'''AddNewProDateEdit'''(MyForm,'testDate');<br>
  clComponent.SetupComponent(testDate,'{"Align":"Center","MarginLeft" : 5,"MarginTop":20,
  "MarginBottom":10,"MarginRight":10,"Width" :120,"Height":40,"RoundHeight":10,"RoundWidth":10,"BorderColor":"#323d8c","BorderWidth":2,
  "BackgroundColor":"#a6ade3"}');
</blockquote>


'''Sample:'''<br>
[[File:ProDateEdit2.png|frameless|400px]]<br>
Let's add a button and dateEdit as an example. Here, when the button is clicked, get the dateEdit value.<br>
'''Var''' 
MyForm:TclForm;
testDate: TClProDateEdit;
testButton : TclButton;<br>
'''procedure''' ProDateEditShowStr;
'''begin'''
  ShowMessage(testDate.DateStr);
'''end;'''<br>
'''procedure''' SetTestDate;
'''begin'''
  testDate := MyForm.AddNewProDateEdit(MyForm,'testDate');
  clComponent.SetupComponent(testDate,'{"Align":"Center","MarginLeft" : 5,"MarginTop":20,
  "MarginBottom":10,"MarginRight":10,
  "Width" :120, "Height":40,"RoundHeight":10,"RoundWidth":10,"BorderColor":"#323d8c","BorderWidth":2,
  "BackgroundColor":"#a6ade3"}');
'''end;'''<br>
'''begin'''
  MyForm := TclForm.Create(Self);
  SetTestDate;
  testButton:= MyForm.AddNewButton(MyForm,'testButton','Click');
  testButton.TextSettings.Font.Size:=50;
  testButton.Align := alBottom;
  testButton.Margins.Left := 60;
  testButton.Margins.Right := 60;
  testButton.Margins.Bottom := 50;
  testButton.Height := 50;
  testButton.Width := 100;
  MyForm.AddNewEvent(testButton,tbeOnClick,'ProDateEditShowStr');
  MyForm.Run;
'''end;'''
'''Output:'''<br>


[[File:ProDateEdit2.png|frameless|400px]]
<h2> See Also </h2>
* [[Components]]
* [[Pro Object Properties]]
* [[Object Properties]]
{{#seo:|title=TClProDateEdit in Clomosy - Clomosy Docs}}
{{#seo:|description=Learn how to use TClProDateEdit in Clomosy to effortlessly manage and edit dates in your mobile apps, streamlining date handling with precision.}}

Latest revision as of 08:17, 16 April 2025

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

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

Represents a single-line editable text box containing a date.
When you click or tap the TClProDateEdit control, it displays a date picker that allows you to select a date.

Feature Use of Definition
TClProDateEdit DateEdit1 : TClProDateEdit; A variable belonging to the TClProDateEdit class is created.
AddNewProDateEdit DateEdit1 = Form1.AddNewProDateEdit(Form1,'DateEdit1'); A new TClProDateEdit is added to the form.
DateStr DateEdit1.DateStr Returns the selected date value.

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

clProSettings Properties

  • TextSettings
  • FontColor
  • FontSize
  • FontVertAlign
  • FontHorzAlign
  • BackgroundColor
  • BorderColor
  • IsTransparent
  • IsFill
  • RoundHeight
  • RoundWidth
  • IsRound
  • BorderWidth

  • Example

     Var   
      Form1:TclForm;
      DateEdit1: TClProDateEdit;
      Button1 : TclButton;
    
    void ProDateEditShowStr;
    {
      ShowMessage(DateEdit1.DateStr);
    }
    
    void SetTestDate;
    {
      DateEdit1 = Form1.AddNewProDateEdit(Form1,'DateEdit1');
      DateEdit1.Align = alCenter;
      DateEdit1.Width = 150;
      DateEdit1.Height = 50;
      DateEdit1.clProSettings.BorderColor = clAlphaColor.clHexToColor('#323d8c');
      DateEdit1.clProSettings.BackgroundColor = clAlphaColor.clHexToColor('#a6ade3');
      DateEdit1.clProSettings.RoundHeight = 10;
      DateEdit1.clProSettings.RoundWidth = 10;
      DateEdit1.clProSettings.BorderWidth = 2;
      DateEdit1.clProSettings.FontHorzAlign = palCenter;
      DateEdit1.clProSettings.TextSettings.Font.Style = [fsBold];
      DateEdit1.clProSettings.FontSize = 20;
      DateEdit1.clProSettings.IsFill = True; 
      DateEdit1.clProSettings.IsRound = True;
      DateEdit1.SetclProSettings(DateEdit1.clProSettings);
    }
    
    {
      Form1 = TclForm.Create(Self);
      SetTestDate;
      Button1= Form1.AddNewButton(Form1,'Button1','Click');
      Button1.TextSettings.Font.Size=50;
      Button1.Align = alBottom;
      Button1.Margins.Left = 60;
      Button1.Margins.Right = 60;
      Button1.Margins.Bottom = 50;
      Button1.Height = 50;
      Button1.Width = 100;
      Form1.AddNewEvent(Button1,tbeOnClick,'ProDateEditShowStr');
      Form1.Run;
    }
    

    Output:

    ProDateEdit2.png

    See Also