انتقل إلى المحتوى

كيفية استخدام اللوحة القماشية

تمكّن أداة التحكم في اللوحة القماشية من واجهة برمجة تطبيقات cTrader Algo المتداولين من إنشاء رسومات مخصصة، بما في ذلك النصوص والأشكال والصور في cTrader. تحسن هذه الرسومات تصور البيانات لسير العمل وتوفر تجربة تداول أكثر تخصيصًا.

في هذه المقالة والفيديو المصاحب لها، ستتعلم كيفية استخدام أداة التحكم في اللوحة القماشية على مخطط التداول وتنفيذ معلمات قابلة للتخصيص.

إنشاء تحكم القماش

يمكن الوصول إلى فئة Canvas واستخدامها من قبل جميع أنواع الخوارزميات (cBots والمؤشرات والإضافات). بالإضافة إلى رسم النصوص والأشكال والصور، يمكن استخدام تحكم القماش لإضافة كائنات خاصة مثل الأسهم والتسميات أو حتى التعليقات التوضيحية مباشرة إلى الرسوم البيانية.

سنقوم بتطوير cBot يرسم قماشًا على رسم بياني. في cTrader Algo، انقر فوق زر جديد لإنشاء cBot، أدخل اسمًا وانقر فوق إنشاء.

قم بالتصريح عن قماش.

1
private Canvas _canvas;

قم بتهيئة القماش وإضافته إلى رسم بياني.

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

ارسم العناصر داخل القماش. استخدم إحداثيات Left وTop لتحديد موضع العناصر.

 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);

ملاحظة

تختلف محاور x وy هنا عن تلك المرتبطة بكائنات الرسم البياني أو الرسومات. تمثل إحداثيات x وy المستخدمة بواسطة فئة Canvas قيمًا رقمية تبدأ من (0، 0) من الزاوية العلوية اليسرى للرسم البياني.

يمكنك نسخ الكود الكامل أدناه:

 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
        }
    }
}

لبناء cBot، استخدم اختصار لوحة المفاتيح Ctrl+B أو انقر فوق بناء.

أضف نسخة محلية من cBot بالنقر فوق إضافة نسخة، واختيار خيار محليًا ثم النقر فوق إضافة نسخة.

انقر فوق أيقونة التشغيل، وينبغي أن يظهر القماش على الرسم البياني. يجب أن ترى كيف يتم وضع العناصر بالنسبة لزوايا القماش.

إضافة معلمات قابلة للتخصيص

عُد إلى محرر التعليمات البرمجية لـ cBot وقم بإجراء تغييرات بحيث تصبح إحداثيات الكائنات المعروضة على الرسم البياني معلمات قابلة للتخصيص.

قم بإنشاء معلمات لإحداثيات x وy للمستطيل.

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; }

قم بإنشاء معلمات لعرض وارتفاع المستطيل.

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; }

قم بإنشاء معلمات لإحداثيات x وy للنص.

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; }

قم بتعديل كود rectangle لتمكينه من استخدام المعلمات القابلة للتخصيص الجديدة.

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

قم بتعديل كود text لتمكينه من استخدام المعلمات القابلة للتخصيص الجديدة.

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

يمكنك نسخ الكود الكامل أدناه:

 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
        }
    }
}

قم بتشغيل cBot مرة أخرى، يجب أن تكون المعلمات القابلة للتخصيص للمستطيل والنص مرئية.

يمكنك إدخال قيم جديدة لأي معلمة، وستنعكس التغييرات على الرسم البياني على الفور.

الملخص

لقد أظهرت لك هذه المقالة كيفية استخدام تحكم القماش لرسم كائنات على رسم بياني للتداول وكذلك تنفيذ معلمات قابلة للتخصيص للمتغيرات.