From Clomosy Docs

No edit summary
No edit summary
 
(9 intermediate revisions by 2 users not shown)
Line 1: Line 1:
AddNewProListViewDesignerPanel(TComponent, xName):TClProListViewDesignerPanel;
<div class="alert alert-ligth border border-3 border-primary-subtle rounded-5 p-4 shadow-sm" role="alert">
function AddNewProListViewDesignerPanel(AComponent: TCLComponent; xName: string): TClProListViewDesignerPanel;
</div>


It is a component that can be defined in Listview and that we can add elements to and design. We can add a certain amount of elements in the DesignerPanel. The binding parameters of these elements to be added are as follows:
<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 TclProListViewDesignerPanel should be written.<br>
 
<div class="alert alert-danger" role="alert" data-bs-theme="light">
Used only on the [[TClProListView]] object.
</div>
 
Used on the ListView object, this represents items created within the list. A single item is created, within which a specified number of objects can be added.<br>
 
<div class="alert alert-ligth border border-3 border-primary-subtle rounded-5 p-4 shadow-sm" role="alert">
<b>The field names for defining objects to be added within the TclProListViewDesignerPanel object are listed below.</b><br>
 
<div class="alert alert-danger" role="alert" data-bs-theme="light">
The field name can be used <b>only once</b> within the project.
</div>
 
* clRecord_GUID
* clCaption
* clCaption
* clText
* clText
Line 12: Line 31:
* clImage1
* clImage1
* clImage2
* clImage2
* clRecord_GUID


How do we use these parameters?<br>
How to add an object to a field name?<br>
For example, there is a label and it is text. We can use one of the clText ones for this. Let's take a look at the usage.<br>
The object is added using the AddPanelObject property. The first parameter of this property is the name of the object to be added, and the second parameter specifies the field where the object will be added.<br>
<blockquote style="background-color:#F7F5EB">
For example, if there is a TclEdit object, it contains text, so one of the fields starting with clText can be used for this.<br>
testDesignerPanel.'''AddPanelObject'''(testLabel,'''clText''');
Example usage:<br>
</blockquote>
<pre>
Let's define it to use in our project.<br>
DesignerPanel1.AddPanelObject(Edit1,clText);
<blockquote style="background-color:#F7F5EB">
</pre>
testDesignerPanel : TClProListViewDesignerPanel;
</div>
</blockquote>
 
<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
|-
|TClProListViewDesignerPanel ||DesignerPanel1 : TClProListViewDesignerPanel; || A variable belonging to the TClProListViewDesignerPanel class is created.
|-
|AddNewProListViewDesignerPanel ||DesignerPanel1 = MyForm.AddNewProListViewDesignerPanel(ProListView1,'DesignerPanel1'); || A new TClProListViewDesignerPanel component is added to the form.
|-
|AddPanelObject ||DesignerPanel1.AddPanelObject(Label1,clText); //Label1 :TclLabel; || The TclProListViewDesignerPanel object allows the addition of objects into it.
|}
</div>
 
 
<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>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>
 
<div class="alert alert-danger" role="alert" data-bs-theme="light">
The data will not appear in the TclProListView object unless it is added to the ProListViewDesignerPanel.
</div>
 
<pre>
var
  Form1 : TclForm;
  ListView1 : TClProListView;
  DesignerPanel1 : TClProListViewDesignerPanel;
 
{
  Form1 = TclForm.Create(Self);
 
  ListView1 = Form1.AddNewProListView(Form1,'ListView1');
  ListView1.Align = AlClient;
  ListView1.Margins.Bottom = 20;
  ListView1.Margins.Top = 20;
  ListView1.Margins.Right = 20;
  ListView1.Margins.Left = 20;
  ListView1.clProSettings.ViewType = lvIcon; //(lvList, lvIcon, lvWaterFall)
  ListView1.clProSettings.ColCount = 1;
  ListView1.clProSettings.ItemHeight = 100;
  ListView1.clProSettings.ItemSpace = 10;
  ListView1.clProSettings.BackgroundColor = clAlphaColor.clHexToColor('#FFFCFF');
  ListView1.clProSettings.BorderColor = clAlphaColor.clHexToColor('#66FF7F');
  ListView1.clProSettings.BorderWidth = 2;
  ListView1.clProSettings.RoundHeight = 5;
  ListView1.clProSettings.RoundWidth = 5;
  ListView1.SetclProSettings(ListView1.clProSettings);
 
  DesignerPanel1 = Form1.AddNewProListViewDesignerPanel(ListView1,'DesignerPanel1');
  DesignerPanel1.Align = alMostTop;
  DesignerPanel1.Height = 100;
  DesignerPanel1.clProSettings.BorderColor = clAlphaColor.clHexToColor('#F5BCC9');
  DesignerPanel1.clProSettings.BackgroundColor = clAlphaColor.clHexToColor('#F6EDDB');
  DesignerPanel1.clProSettings.IsTransparent = False;
  DesignerPanel1.clProSettings.IsFill = True;
  DesignerPanel1.clProSettings.IsRound = True;
  DesignerPanel1.clProSettings.RoundHeight = 20;
  DesignerPanel1.clProSettings.RoundWidth = 20;
  DesignerPanel1.clProSettings.BorderWidth = 2;
  DesignerPanel1.SetclProSettings(DesignerPanel1.clProSettings);
  ListView1.SetDesignerPanel(DesignerPanel1);
 
  Form1.Run;
}
</pre>
 
<div class="alert alert-success" role="alert" data-bs-theme="light">
You can see the sample projects in the [[TClProListView|TClProListView]] page.
</div>


Let's add the DesignerPanel to the ProListView.
<h2> See Also </h2>
<blockquote style="background-color:#F7F5EB">
* [[Components]]
    testDesignerPanel := MyForm.AddNewProListViewDesignerPanel(testListview,'testDesignerPanel'); <br>
* [[Pro Object Properties]]
    clComponent.SetupComponent(testDesignerPanel,'{"Height":100,"Width" : 150,"BackgroundColor":"#F6EDDB","BorderColor":"#F5BCC9","BorderWidth":2,"RoundHeight":20,"RoundWidth":20}');<br>
* [[Object Properties]]
    testListview.'''SetDesignerPanel'''(testDesignerPanel);
{{#seo:|description=TClProListViewDesignerPanel is used with TClProListView to create and manage list items, adding objects like text and images to fields.}}
</blockquote>
In this way, we have made our definitions. You can see the sample project in the [[TClProListView|AddNewProListView]] field.

Latest revision as of 08:20, 16 April 2025

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

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

Used on the ListView object, this represents items created within the list. A single item is created, within which a specified number of objects can be added.

Feature Use of Definition
TClProListViewDesignerPanel DesignerPanel1 : TClProListViewDesignerPanel; A variable belonging to the TClProListViewDesignerPanel class is created.
AddNewProListViewDesignerPanel DesignerPanel1 = MyForm.AddNewProListViewDesignerPanel(ProListView1,'DesignerPanel1'); A new TClProListViewDesignerPanel component is added to the form.
AddPanelObject DesignerPanel1.AddPanelObject(Label1,clText); //Label1 :TclLabel; The TclProListViewDesignerPanel object allows the addition of objects into it.


clProSettings Properties

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


  • Example

    var
      Form1 : TclForm;
      ListView1 : TClProListView;
      DesignerPanel1 : TClProListViewDesignerPanel;
      
    {
      Form1 = TclForm.Create(Self);
    
      ListView1 = Form1.AddNewProListView(Form1,'ListView1');
      ListView1.Align = AlClient;
      ListView1.Margins.Bottom = 20;
      ListView1.Margins.Top = 20;
      ListView1.Margins.Right = 20;
      ListView1.Margins.Left = 20;
      ListView1.clProSettings.ViewType = lvIcon; //(lvList, lvIcon, lvWaterFall)
      ListView1.clProSettings.ColCount = 1;
      ListView1.clProSettings.ItemHeight = 100;
      ListView1.clProSettings.ItemSpace = 10;
      ListView1.clProSettings.BackgroundColor = clAlphaColor.clHexToColor('#FFFCFF');
      ListView1.clProSettings.BorderColor = clAlphaColor.clHexToColor('#66FF7F');
      ListView1.clProSettings.BorderWidth = 2;
      ListView1.clProSettings.RoundHeight = 5;
      ListView1.clProSettings.RoundWidth = 5;
      ListView1.SetclProSettings(ListView1.clProSettings);
    
      DesignerPanel1 = Form1.AddNewProListViewDesignerPanel(ListView1,'DesignerPanel1');
      DesignerPanel1.Align = alMostTop;
      DesignerPanel1.Height = 100;
      DesignerPanel1.clProSettings.BorderColor = clAlphaColor.clHexToColor('#F5BCC9');
      DesignerPanel1.clProSettings.BackgroundColor = clAlphaColor.clHexToColor('#F6EDDB');
      DesignerPanel1.clProSettings.IsTransparent = False;
      DesignerPanel1.clProSettings.IsFill = True; 
      DesignerPanel1.clProSettings.IsRound = True;
      DesignerPanel1.clProSettings.RoundHeight = 20;
      DesignerPanel1.clProSettings.RoundWidth = 20;
      DesignerPanel1.clProSettings.BorderWidth = 2;
      DesignerPanel1.SetclProSettings(DesignerPanel1.clProSettings);
      ListView1.SetDesignerPanel(DesignerPanel1);
      
      Form1.Run;
    }
    

    See Also