ข้ามไปที่เนื้อหา

วิธีสร้างปลั๊กอินเฟรมที่กำหนดเอง

นักเทรดมักพยายามเก็บเว็บไซต์ที่มีข้อมูลการเทรดและการวิเคราะห์ทางเทคนิคที่สำคัญไว้ใกล้กับกราฟมากที่สุดเท่าที่จะเป็นไปได้ ปลั๊กอินช่วยให้พวกเขาสามารถทำสิ่งนี้ได้ผ่านเฟรมที่กำหนดเอง

ในบทความนี้และวิดีโอที่เกี่ยวข้อง เราจะแสดงวิธีสร้างเฟรมที่กำหนดเองซึ่งสามารถบรรจุเว็บไซต์และกล่องข้อความโดยใช้ปลั๊กอิน

สร้างกรอบที่กำหนดเองแสดงเว็บไซต์

เราจะสร้างกรอบที่กำหนดเองในพื้นที่กราฟเพื่อแสดงเว็บไซต์

ไปที่แอป Algo และสลับไปที่แท็บ ปลั๊กอิน คลิกปุ่ม ใหม่ เพื่อสร้างปลั๊กอินใหม่ ทำเครื่องหมายที่ตัวเลือก ว่างเปล่า ตั้งชื่อปลั๊กอินของคุณ เช่น "My Custom Frame Example" และคลิกปุ่ม สร้าง

เมื่อตัวแก้ไขโค้ดปรากฏขึ้น ให้เริ่มต้นออบเจ็กต์ WebView

1
_cTraderWebView = new WebView();

สมัครรับเหตุการณ์ WebView ที่โหลดแล้ว

1
_cTraderWebView.Loaded += _cTraderWebView_Loaded;

ตั้งค่าฟอรัม cTrader เป็นเว็บไซต์ใน WebView เมื่อโหลด

1
2
3
4
private void _cTraderWebView_Loaded(WebViewLoadedEventArgs args) 
{
    _cTraderWebView.NavigateAsync("https://ctrader.com/forum");
}

เริ่มต้นกรอบกราฟที่กำหนดเอง

1
var webViewFrame = ChartManager.AddCustomFrame("Forum");

กำหนด WebView เป็นลูกให้กับกรอบกราฟที่กำหนดเอง

1
webViewFrame.Child = _cTraderWebView;

ตั้งค่ากรอบกราฟที่กำหนดเองเป็นโหมดหลายกราฟ

1
webViewFrame.ChartContainer.Mode = ChartMode.Multi;

แนบไปยังกราฟ

1
webViewFrame.Attach();

คุณสามารถคัดลอกโค้ดทั้งหมดด้านล่างนี้:

 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
using System;
using cAlgo.API;
using cAlgo.API.Collections;
using cAlgo.API.Indicators;
using cAlgo.API.Internals;

namespace cAlgo.Plugins
{
    [Plugin(AccessRights = AccessRights.None)]
    public class MyCustomFrameExample : Plugin
    {

        WebView _cTraderWebView = new WebView();

        protected override void OnStart()
        {
            _cTraderWebView.Loaded += _cTraderWebView_Loaded;
            var webViewFrame = ChartManager.AddCustomFrame("Forum");
            webViewFrame.Child = _cTraderWebView;
            webViewFrame.ChartContainer.Mode = ChartMode.Multi;
            webViewFrame.Attach();
        }

        private void _cTraderWebView_Loaded(WebViewLoadedEventArgs args)
        {
            _cTraderWebView.NavigateAsync("https://ctrader.com/forum");
        }

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

หากต้องการสร้างปลั๊กอินของเรา ให้ใช้ปุ่มลัด Ctrl+B หรือคลิกปุ่ม สร้าง

หากต้องการดูผลลัพธ์ ให้ไปที่แอป เทรด ในกรณีของเรา หน้าเว็บฟอรัม cTrader จะแสดงในกรอบที่กำหนดเองของเราในพื้นที่กราฟ

จัดการกรอบที่กำหนดเอง

กรอบที่กำหนดเองที่แสดงเว็บไซต์ฟอรัม cTrader สามารถจัดการได้เหมือนกรอบกราฟใดๆ ใน cTrader สามารถถอดออกและแนบกลับไปยังพื้นที่กราฟ ปรับขนาด สลับหรือแทนที่ด้วยกราฟอื่นๆ ได้

เปลี่ยน URL ของเว็บไซต์

เราจะแทนที่เว็บไซต์ฟอรัม cTrader ด้วยหน้าเว็บอื่น

กลับไปที่แอป Algo และแก้ไขโค้ดปลั๊กอิน แทนที่ URL ของฟอรัม cTrader (https://ctrader.com/forum) ด้วย URL ของ Spotware (https://www.spotware.com)

นี่ควรเป็นบรรทัดโค้ดที่เป็นผลลัพธ์:

1
_cTraderWebView.NavigateAsync("https://www.spotware.com");

สร้างปลั๊กอินอีกครั้งและไปที่แอป เทรด เพื่อดูการเปลี่ยนแปลง ตอนนี้เว็บไซต์ Spotware จะแสดงบนกรอบที่กำหนดเอง

เพิ่มหลายกรอบ

เราจะอัปเดตโค้ดปลั๊กอินเพื่อเพิ่มกรอบที่กำหนดเองสองกรอบ โดยแต่ละกรอบจะแสดงเว็บไซต์ เพิ่มออบเจ็กต์ WebView ใหม่และทำซ้ำขั้นตอนและบรรทัดโค้ดจากตัวอย่างก่อนหน้า

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
WebView _cTraderWebView = new WebView();
WebView _cTraderWebViewSite = new WebView();

_cTraderWebViewSite.Loaded += _cTraderWebViewSite_Loaded;
var webViewFrameSite = ChartManager.AddCustomFrame("Site");
webViewFrameSite.Child = _cTraderWebViewSite;
webViewFrameSite.ChartContainer.Mode = ChartMode.Multi;
webViewFrameSite.Attach();

private void _cTraderWebViewSite_Loaded(WebViewLoadedEventArgs args)
{
    _cTraderWebViewSite.NavigateAsync("https://www.spotware.com");
}

คุณสามารถคัดลอกโค้ดทั้งหมดด้านล่างนี้:

 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
using System;
using cAlgo.API;
using cAlgo.API.Collections;
using cAlgo.API.Indicators;
using cAlgo.API.Internals;

namespace cAlgo.Plugins
{
    [Plugin(AccessRights = AccessRights.None)]
    public class MyCustomFrameExample : Plugin
    {
        WebView _cTraderWebView = new WebView();
        WebView _cTraderWebViewSite = new WebView();

        protected override void OnStart()
        {
            _cTraderWebView.Loaded += _cTraderWebView_Loaded;
            var webViewFrame = ChartManager.AddCustomFrame("Forum");
            webViewFrame.Child = _cTraderWebView;
            webViewFrame.ChartContainer.Mode = ChartMode.Multi;
            webViewFrame.Attach();

            _cTraderWebViewSite.Loaded += _cTraderWebViewSite_Loaded;
            var webViewFrameSite = ChartManager.AddCustomFrame("Site");
            webViewFrameSite.Child = _cTraderWebViewSite;
            webViewFrameSite.ChartContainer.Mode = ChartMode.Multi;
            webViewFrameSite.Attach();
        }

        private void _cTraderWebView_Loaded(WebViewLoadedEventArgs args)
        {
           _cTraderWebView.NavigateAsync("https://www.ctrader.com/forum");
        }

        private void _cTraderWebViewSite_Loaded(WebViewLoadedEventArgs args)
        {
           _cTraderWebViewSite.NavigateAsync("https://www.spotware.com");
        }

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

สร้างปลั๊กอิน เมื่อคุณกลับไปที่แอป Algo คุณควรเห็นเว็บไซต์สองเว็บ (ฟอรัม cTrader และ Spotware) ในกรอบแยกกัน

สร้างกล่องข้อความ

นอกเหนือจากกรอบกราฟที่แสดงหน้าเว็บ ปลั๊กอินยังช่วยให้คุณเพิ่มกรอบที่กำหนดเองที่มีออบเจ็กต์อื่นๆ ได้ ตัวอย่างเช่น คุณสามารถเพิ่มกรอบที่มีกล่องข้อความได้

ลบบรรทัดโค้ด WebView ทั้งหมดและเพิ่มบรรทัดต่อไปนี้สำหรับกล่องข้อความแทน:

1
2
3
4
5
6
7
8
9
var webViewFrame = ChartManager.AddCustomFrame("Hello World");

var txtHelloWorld = new TextBlock
{
    Text = "Hello World"
};
webViewFrame.Child = txtHelloWorld;
webViewFrame.ChartContainer.Mode = ChartMode.Single;
webViewFrame.Attach();

คุณสามารถคัดลอกโค้ดเต็มด้านล่าง

 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
using System;
using cAlgo.API;
using cAlgo.API.Collections;
using cAlgo.API.Indicators;
using cAlgo.API.Internals;

namespace cAlgo.Plugins
{
    [Plugin(AccessRights = AccessRights.None)]
    public class MyCustomFrameExample : Plugin
    {
        protected override void OnStart()
        {
            var webViewFrame = ChartManager.AddCustomFrame("Hello World");

            var txtHelloWorld = new TextBlock
            {
                Text = "Hello World"
            };

            webViewFrame.Child = txtHelloWorld;
            webViewFrame.ChartContainer.Mode = ChartMode.Single;
            webViewFrame.Attach();
        }

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

สร้างปลั๊กอินและดูผลลัพธ์ในแอป เทรด ครั้งนี้ คุณควรเห็นกล่องที่มีข้อความ Hello World ในพื้นที่กราฟ

สรุป

ตอนนี้คุณควรมีความชำนาญในการใช้ปลั๊กอินเพื่อรวมหน้าเว็บ กล่องข้อความ และองค์ประกอบที่มีประโยชน์อื่นๆ ในพื้นที่กราฟ