---
id: "T:cAlgo.API.CustomControl"
kind: "class"
namespace: "cAlgo.API"
url: "https://help.ctrader.com/ctrader-algo/references/Controls/CustomControl/"
---

> Documentation index for agents: https://help.ctrader.com/ctrader-algo/llms.txt · machine index: https://help.ctrader.com/ctrader-algo/api.json

# CustomControl (class)

Represents the custom control to create reusable controls with customized look and behavior.

Environments: Desktop supported · CLI not supported · Cloud not supported.

- CLI: Accepted without error but never displayed, so control events such as Click are never raised.
- Cloud: Accepted without error but never displayed, so control events such as Click are never raised.

## Definition

```csharp
public abstract class CustomControl : ControlBase
```

## Remarks

Using CustomControl is currently not possible in Python algos.

## Examples

C#:

```csharp
using cAlgo.API;
using System.Collections.Generic;

namespace cAlgo
{
    // This sample indicator shows how to use Chart Custom controls to create your own controls
    // by combining multiple built-in controls, the combobox control is not a fully functioning combobox, its just for learning purpose
    public partial class CustomControlSample : Indicator
    {
        protected override void Initialize()
        {
            var comboBox = new ComboBox
            {
                HorizontalAlignment = HorizontalAlignment.Center,
                VerticalAlignment = VerticalAlignment.Center
            };

            comboBox.AddItem("Item 1");
            comboBox.AddItem("Item 2");
            comboBox.AddItem("Item 3");
            comboBox.AddItem("Item 4");
            comboBox.AddItem("Item 5");

            Chart.AddControl(comboBox);
        }

        public override void Calculate(int index)
        {
            // Calculate value at specified index
            // Result[index] = ...
        }
    }

    public class ComboBox : CustomControl
    {
        private TextBox _textBox;

        private Button _button;

        private Grid _itemsGrid;

        private StackPanel _panel;

        private readonly List<object> _items = new List<object>();

        private bool _isExpanded;

        public ComboBox()
        {
            _textBox = new TextBox
            {
                Width = 100,
                IsReadOnly = true,
                IsReadOnlyCaretVisible = false
            };

            _button = new Button
            {
                Text = "▼"
            };

            _button.Click += Button_Click;

            var stackPanel = new StackPanel
            {
                Orientation = Orientation.Horizontal
            };

            stackPanel.AddChild(_textBox);
            stackPanel.AddChild(_button);

            _panel = new StackPanel
            {
                Orientation = Orientation.Vertical
            };

            _panel.AddChild(stackPanel);

            AddChild(_panel);
        }

        public void AddItem(object item)
        {
            _items.Add(item);
        }

        public bool RemoveItem(object item)
        {
            return _items.Remove(item);
        }

        private void Button_Click(ButtonClickEventArgs obj)
        {
            if (_itemsGrid != null)
                _panel.RemoveChild(_itemsGrid);

            if (_isExpanded)
            {
                _isExpanded = false;

                return;
            }

            _isExpanded = true;

            _itemsGrid = new Grid(_items.Count, 1);

            for (int i = 0; i < _items.Count; i++)
            {
                var item = _items[i];

                _itemsGrid.AddChild(new TextBlock
                {
                    Text = item.ToString()
                }, i, 0);
            }

            _panel.AddChild(_itemsGrid);
        }
    }
}
```

Python:

```python
# Not available in Python: CustomControl subclasses are C# classes, compose built-in controls instead
textBox = TextBox()
textBox.Width = 100
textBox.IsReadOnly = True
button = Button()
button.Text = "v"
panel = StackPanel()
panel.Orientation = Orientation.Horizontal
panel.AddChild(textBox)
panel.AddChild(button)
api.Chart.AddControl(panel)
```

config.json:

```json
{
  "AccessRights": "None",
  "TimeZone": "UTC",
  "IsOverlay": true
}
```

## Methods

- `protected void AddChild(ControlBase childControl)` — Adds a child control. [details](https://help.ctrader.com/ctrader-algo/references/Controls/CustomControl/AddChild/index.md)

## Inherited members

- `public void ResetProperty(ControlProperty property)` (from ControlBase) [details](https://help.ctrader.com/ctrader-algo/references/Controls/ControlBase/ResetProperty/index.md)
- `public Guid UniqueId {get;}` (from ControlBase) [details](https://help.ctrader.com/ctrader-algo/references/Controls/ControlBase/UniqueId/index.md)
- `public Style Style {get; set;}` (from ControlBase) [details](https://help.ctrader.com/ctrader-algo/references/Controls/ControlBase/Style/index.md)
- `public double Left {get; set;}` (from ControlBase) [details](https://help.ctrader.com/ctrader-algo/references/Controls/ControlBase/Left/index.md)
- `public double Top {get; set;}` (from ControlBase) [details](https://help.ctrader.com/ctrader-algo/references/Controls/ControlBase/Top/index.md)
- `public double Right {get; set;}` (from ControlBase) [details](https://help.ctrader.com/ctrader-algo/references/Controls/ControlBase/Right/index.md)
- `public double Bottom {get; set;}` (from ControlBase) [details](https://help.ctrader.com/ctrader-algo/references/Controls/ControlBase/Bottom/index.md)
- `public double Width {get; set;}` (from ControlBase) [details](https://help.ctrader.com/ctrader-algo/references/Controls/ControlBase/Width/index.md)
- `public double Height {get; set;}` (from ControlBase) [details](https://help.ctrader.com/ctrader-algo/references/Controls/ControlBase/Height/index.md)
- `public double MinWidth {get; set;}` (from ControlBase) [details](https://help.ctrader.com/ctrader-algo/references/Controls/ControlBase/MinWidth/index.md)
- `public double MinHeight {get; set;}` (from ControlBase) [details](https://help.ctrader.com/ctrader-algo/references/Controls/ControlBase/MinHeight/index.md)
- `public double MaxWidth {get; set;}` (from ControlBase) [details](https://help.ctrader.com/ctrader-algo/references/Controls/ControlBase/MaxWidth/index.md)
- `public double MaxHeight {get; set;}` (from ControlBase) [details](https://help.ctrader.com/ctrader-algo/references/Controls/ControlBase/MaxHeight/index.md)
- `public bool IsEnabled {get; set;}` (from ControlBase) [details](https://help.ctrader.com/ctrader-algo/references/Controls/ControlBase/IsEnabled/index.md)
- `public bool IsVisible {get; set;}` (from ControlBase) [details](https://help.ctrader.com/ctrader-algo/references/Controls/ControlBase/IsVisible/index.md)
- `public double Opacity {get; set;}` (from ControlBase) [details](https://help.ctrader.com/ctrader-algo/references/Controls/ControlBase/Opacity/index.md)
- `public Thickness Margin {get; set;}` (from ControlBase) [details](https://help.ctrader.com/ctrader-algo/references/Controls/ControlBase/Margin/index.md)
- `public VerticalAlignment VerticalAlignment {get; set;}` (from ControlBase) [details](https://help.ctrader.com/ctrader-algo/references/Controls/ControlBase/VerticalAlignment/index.md)
- `public HorizontalAlignment HorizontalAlignment {get; set;}` (from ControlBase) [details](https://help.ctrader.com/ctrader-algo/references/Controls/ControlBase/HorizontalAlignment/index.md)
- `public Dock Dock {get; set;}` (from ControlBase) [details](https://help.ctrader.com/ctrader-algo/references/Controls/ControlBase/Dock/index.md)
- `public bool IsHitTestVisible {get; set;}` (from ControlBase) [details](https://help.ctrader.com/ctrader-algo/references/Controls/ControlBase/IsHitTestVisible/index.md)