Ir para o conteúdo

Como usar uma tela

O controlo de tela da API do cTrader Algo permite aos traders criar elementos visuais personalizados, incluindo textos, formas e imagens no cTrader. Estes desenhos melhoram a visualização de dados para fluxos de trabalho e proporcionam uma experiência de negociação mais personalizada.

Neste artigo e no vídeo correspondente, aprenderá a usar o controlo de tela num gráfico de negociação e a implementar parâmetros personalizáveis.

Criar controlo de tela

A classe Canvas pode ser acedida e utilizada por todos os tipos de algoritmos (cBots, indicadores e plugins). Além de desenhar textos, formas e imagens, o controlo de tela pode ser usado para adicionar objetos especiais como setas, etiquetas ou até anotações diretamente nos gráficos.

Vamos desenvolver um cBot que desenha uma tela num gráfico. No cTrader Algo, clique no botão Novo para criar um cBot, introduza um nome e clique em Criar.

Declare uma tela.

1
private Canvas _canvas;

Inicialize a tela e adicione-a a um gráfico.

1
2
_canvas = new Canvas();
Chart.AddControl(_canvas);

Desenhe elementos dentro da tela. Use as coordenadas Left e Top para posicionar os elementos.

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
var rectangle = new Rectangle
{
    Left = 50,
    Top = 50,
    Width = 100,
    Height = 50,
    StrokeColor = Color.Blue
};

_canvas.AddChild(rectangle);

var text = new TextBlock
{
    Left = 70,
    Top = 70,
    Text = "Hello Canvas!",
};

_canvas.AddChild(text);

Nota

Os eixos x e y aqui diferem daqueles associados a objetos ou desenhos do gráfico. As coordenadas x e y utilizadas pela classe Canvas representam valores numéricos começando em (0, 0) a partir do canto superior esquerdo do gráfico.

Pode copiar o código completo abaixo:

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
using System;
using cAlgo.API;
using cAlgo.API.Collections;
using cAlgo.API.Indicators;
using cAlgo.API.Internals;

namespace cAlgo.Robots
{
    [Robot(AccessRights = AccessRights.None, AddIndicators = true)]
    public class CanvasExample : Robot
    {
        [Parameter(DefaultValue = "Hello world!")]
        public string Message { get; set; }

        private Canvas _canvas;

        protected override void OnStart()
        {
           _canvas = new Canvas();
           Chart.AddControl(_canvas);

           var rectangle = new Rectangle
           {
               Left = 50,
               Top = 50,
               Width = 100,
               Height = 50,
               StrokeColor = Color.Blue 
           };

           _canvas.AddChild(rectangle);

           var text = new TextBlock
           {
               Left = 70,
               Top = 70,
               Text = "Hello Canvas!",
           };

           _canvas.AddChild(text);
        }

        protected override void OnTick()
        {
            // Handle price updates here
        }

        protected override void OnStop()
        {
            // Handle cBot stop here
        }
    }
}

Para criar o cBot, utilize o atalho Ctrl+B ou clique em Criar.

Adicione uma instância local do cBot clicando em Adicionar instância, selecionando a opção Localmente e depois clicando em Adicionar instância.

Clique no ícone de reprodução, e a tela deverá aparecer no gráfico. Deverá ver como os elementos são colocados em relação aos cantos da tela.

Adicionar parâmetros personalizáveis

Volte ao editor de código do cBot e faça alterações para que as coordenadas dos objetos mostrados no gráfico se tornem parâmetros personalizáveis.

Crie parâmetros para as coordenadas x e y do retângulo.

1
2
3
4
5
[Parameter("Rectangle Left", DefaultValue = 50)]
public int RectangleLeft { get; set; }

[Parameter("Rectangle Top", DefaultValue = 50)]
public int RectangleTop { get; set; }

Crie parâmetros para a largura e altura do retângulo.

1
2
3
4
5
[Parameter("Rectangle Width", DefaultValue = 100)]
public int RectangleWidth { get; set; }

[Parameter("Rectangle Height", DefaultValue = 50)]
public int RectangleHeight { get; set; }

Crie parâmetros para as coordenadas x e y do texto.

1
2
3
4
5
[Parameter("Text Left", DefaultValue = 70)]
public int TextLeft { get; set; }

[Parameter("Text Top", DefaultValue = 70)]
public int TextTop { get; set; }

Modifique o código do rectangle para permitir que use os novos parâmetros personalizáveis.

1
2
3
4
5
6
7
8
var rectangle = new Rectangle
{
    Left = RectangleLeft,
    Top = RectangleTop,
    Width = RectangleWidth,
    Height = RectangleHeight,
    StrokeColor = Color.Blue
};

Modifique o código do text para permitir que use os novos parâmetros personalizáveis.

1
2
3
4
5
6
var text = new TextBlock
{
    Left = TextLeft,
    Top = TextTop,
    Text = "Hello Canvas!",
};

Pode copiar o código completo abaixo:

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
using System;
using cAlgo.API;
using cAlgo.API.Collections;
using cAlgo.API.Indicators;
using cAlgo.API.Internals;

namespace cAlgo.Robots
{
    [Robot(AccessRights = AccessRights.None, AddIndicators = true)]
    public class CanvasExample : Robot
    {
        [Parameter("Rectangle Left", DefaultValue = 50 )]
        public int RectangleLeft { get; set; }

        [Parameter("Rectangle Top", DefaultValue = 50 )]
        public int RectangleTop { get; set; }

        [Parameter("Rectangle Width", DefaultValue = 100 )]
        public int RectangleWidth { get; set; }

        [Parameter("Rectangle Height", DefaultValue = 50 )]
        public int RectangleHeight { get; set; }

        [Parameter("Text Left", DefaultValue = 70 )]
        public int TextLeft { get; set; }

        [Parameter("Text Top", DefaultValue = 70 )]
        public int TextTop { get; set; }

        private Canvas _canvas;

        protected override void OnStart()
        {
           _canvas = new Canvas();
           Chart.AddControl(_canvas);

           var rectangle = new Rectangle
           {
               Left = RectangleLeft,
               Top = RectangleTop,
               Width = RectangleWidth,
               Height = RectangleHeight,
               StrokeColor = Color.Blue 
           };

           _canvas.AddChild(rectangle);

           var text = new TextBlock
           {
               Left = TextLeft,
               Top = TextTop,
               Text = "Hello Canvas!",
           };

           _canvas.AddChild(text);
        }

        protected override void OnTick()
        {
            // Handle price updates here
        }

        protected override void OnStop()
        {
            // Handle cBot stop here
        }
    }
}

Execute o cBot novamente, os parâmetros personalizáveis para o retângulo e o texto devem estar visíveis.

Pode introduzir novos valores para qualquer parâmetro, e as alterações serão refletidas no gráfico imediatamente.

Resumo

Este artigo mostrou-lhe como usar o controlo de tela para desenhar objetos num gráfico de negociação e também implementar parâmetros personalizáveis para variáveis.